Start an Astro project
Why Astro
Understand Astro as a web framework that renders useful HTML first and makes browser JavaScript an explicit choice.
8 minute lesson
Astro starts from the HTML the visitor needs.
An .astro component runs while Astro renders the page. That can happen during a production build or on a server request. Its component script does not become browser JavaScript.
---
const title = 'My field notes'
---
<h1>{title}</h1>The browser receives an h1. It does not receive the title variable or an Astro runtime.
Add browser JavaScript only where behavior needs it. A page can remain mostly links, forms, images, and text while one search box or chart becomes an interactive island.
This makes Astro a strong fit for content sites, documentation, marketing pages, and stores where most of the page is read rather than continuously manipulated.
Astro does not make every page fast automatically. Large images, third-party scripts, poor caching, and unnecessary hydrated components still cost time. Its architecture makes those decisions visible.
Use Astro when HTML-first rendering matches the product. A dense offline application with continuous local state may be clearer in an application framework.
View the page source for this example. Confirm that the useful heading exists before any client JavaScript runs.
Lesson completed