← Back to Blog

Getting Started with Astro

astro web development static sites

Astro is a modern static site generator that allows you to build fast, content-focused websites. In this post, we’ll explore why Astro is gaining popularity and how to get started with it.

Why Choose Astro?

Astro brings several advantages to modern web development:

  • Zero JavaScript by default: Astro ships zero JavaScript to the browser by default, making your sites incredibly fast.
  • Component Islands: Use your favorite framework (React, Vue, Svelte) where you need interactivity.
  • Content Collections: Built-in support for managing markdown content with type safety.

Getting Started

First, create a new Astro project:

npm create astro@latest

Then navigate to your project directory and start the dev server:

cd my-astro-site
npm run dev

Creating Your First Page

Pages in Astro are incredibly simple. Create a new file in the src/pages directory:

---
const greeting = 'Hello, World!';
---
 
<html>
  <body>
    <h1>{greeting}</h1>
  </body>
</html>

Next Steps

Now that you’ve got the basics down, try:

  1. Adding components to your site
  2. Setting up content collections
  3. Deploying your site to production

Astro makes it easy to build performant websites without sacrificing developer experience.