Getting Started

Astro is a modern static site builder. Learn what Astro is all about from our homepage or our release post. This page is an overview of the Astro documentation and all related resources.

Try Astro

The easiest way to try Astro is to run npm init astro in a new directory on your machine. Our CLI wizard will assist you in starting a new Astro project.

To get started with Astro in 5 quick and easy steps, visit our Quick-Start guide.

Alternatively, read our Installation Guide for a full walk-through on getting set up with Astro.

Example Projects

If you prefer to learn Astro by example, check out our complete library of examples on GitHub.

You can check out any of these examples on your local machine by running npm init astro with the --template CLI flag. The --template flag also supports third-party, community templates.

# Run the init wizard and use this official template
npm init astro -- --template [OFFICIAL_EXAMPLE_NAME]
# Run the init wizard and use this community template
npm init astro -- --template [GITHUB_USER]/[REPO_NAME]
npm init astro -- --template [GITHUB_USER]/[REPO_NAME]/path/to/example

Online Playgrounds

If you’re interested in playing around with Astro in the browser, you can instantly spin up a new Astro project with our UI at astro.new.

You can try Astro in online code editors like Stackblitz, CodeSandbox, Gitpod, and GitHub Codespaces. Click the “Open in Stackblitz” link in any of the examples in our examples library. Or, click here to start a new project in Stackblitz.

Learn Astro

All manner of people come to Astro from different backgrounds bringing with them different learning styles. Whether you prefer a more theoretical or a practical approach, we hope you’ll find this section helpful.

Like any unfamiliar technology, Astro comes with a slight learning curve. However, with practice and some patience, we know, you will get the hang of it, in no time.

Learn .astro Syntax

When you begin to learn Astro, you’ll see many files using the .astro file extension. This is Astro’s Component Syntax: a special HTML-like file format which Astro uses for templating. It was designed to feel familiar to anyone with HTML or JSX experience.

Our helpful guide on Astro components introduces you to the Astro syntax, and is the best way to learn.

API Reference

This documentation section is useful when you want to learn more details about a particular Astro API. For example, Configuration Reference lists all possible configuration options available to you. Built-in Components Reference lists all available core components, like <Markdown /> and <Code />.

Versioned Documentation

This documentation always reflects the latest stable version of Astro. Once we hit the v1.0 milestone, we will add the ability to view versioned documentation.

Staying Informed

The @astrodotbuild Twitter account is the official source for the updates from the Astro team.

We also post release announcements to our Discord community in the #announcements channel.

Not every Astro release deserves its own blog post, but you can find a detailed changelog for every release in the CHANGELOG.md file in the Astro repository.

Something Missing?

If something is missing in the documentation or if you found some part confusing, please file an issue for the documentation with your suggestions for improvement, or tweet at the @astrodotbuild Twitter account. We love hearing from you!

Credit

This getting started guide was originally based off of React’s getting started guide.