Getting Started with Astro
Astro is a modern web framework that delivers fast, content-focused websites. In this guide, we’ll explore the fundamentals of building with Astro.
Why Choose Astro?
Astro stands out for its unique approach to building websites:
- Zero JavaScript by default: Only ship the JavaScript you need
- Component Islands: Hydrate interactive components on demand
- Framework agnostic: Use React, Vue, Svelte, or any framework
Your First Astro Project
Getting started is simple. First, create a new project:
npm create astro@latestFollow the prompts to set up your project structure.
Building Pages
Astro pages live in the src/pages/ directory and use the .astro extension:
---const title = "My Page";---
<html> <head> <title>{title}</title> </head> <body> <h1>Welcome to Astro!</h1> </body></html>Next Steps
Now that you understand the basics, explore:
- Content collections for managing markdown
- Component frameworks integration
- Deployment options
Happy building with Astro!
