Astro
The main framework. Good starting point for docs, guides, and examples.
Overview
Astro is a website framework that is built mainly around speed, SEO (showing up well on Google), and content-heavy websites like blogs, docs, and marketing pages. By default, Astro tries to send as little JavaScript as possible to the browser.
Astro’s own way of describing itself:
“Ship less JavaScript.”
Most other frameworks, like React or Next.js, send JavaScript to the browser and let the browser build the page. Astro works differently. Astro builds the HTML pages ahead of time (this is called build time), and it only sends JavaScript to the browser when you specifically ask for it.
Why This Matters
Section titled “Why This Matters”In simple words:
- Less JavaScript means your website loads faster.
- Faster websites are usually better for SEO (search engines like fast sites).
- Content sites (blogs, docs, portfolios) don’t need a lot of JavaScript anyway, so Astro fits them very well.
Useful Links
Section titled “Useful Links”Here are some official websites worth bookmarking while you learn Astro:
- Astro itself - https://astro.build/
- Starlight (the documentation site framework built on top of Astro, used for sites like this one) - https://starlight.astro.build/
- UI Full Dev (a UI component resource) - https://ui.full.dev/
Starlight
A ready-made theme/framework for building documentation websites using Astro.
UI Full Dev
A place to find ready-made UI components you can use in your projects.
What’s Next
Section titled “What’s Next”In the next sections, we’ll set up an Astro project from scratch, understand the folder structure, learn routing, build components, work with content collections (for blogs), and finally look at SSR (Server-Side Rendering), search, APIs, and deployment.