Getting Started with Astro
astro tutorial web-dev
Getting Started with Astro
Astro is a modern web framework that focuses on content-driven websites. It’s perfect for blogs, marketing sites, and portfolios.
Why Astro?
- Fast by Default: Ships zero JavaScript by default
- Content Collections: Built-in support for markdown and MDX
- Island Architecture: Partial hydration for interactive components
- Framework Agnostic: Use React, Vue, Svelte, or vanilla JS
Creating Your First Page
Pages in Astro are simple .astro files in the src/pages directory:
---
// Component script (runs at build time)
const title = "My Page";
---
<html>
<head>
<title>{title}</title>
</head>
<body>
<h1>{title}</h1>
</body>
</html>
Next Steps
Check out the Astro documentation to learn more!