Tag
astro
Published articles tagged astro.
Astro cheat sheet
CLI commands, special files, component syntax, directives, routing patterns, and content collection functions in one scannable page, meant to sit beside the Astro series.
Astro components
An .astro file is a server-side script and an HTML template in one file. This page covers the component script, template expressions, typed props, slots, scoped styles, client scripts, and the Image component, which together make up most of the Astro code you will write.
Content collections in Astro
Content collections give Markdown, JSON, and remote data a schema, typed queries, and validation at build time. This page defines collections with the glob and file loaders, validates frontmatter with Zod, links entries with references, and generates one page per entry.
Creating an Astro project
Scaffold a project with the create-astro wizard, learn which folders Astro treats specially, and run the dev, build, preview, and check commands. The steps end with a configured project ready for the rest of the series.
Islands and client directives in Astro
Client directives decide whether a framework component stays static HTML or hydrates in the browser, and when. This page covers framework integrations, the five client directives, what props can cross into an island, sharing state between islands, server islands, and client-side navigation with view transitions.
Routing in Astro
Astro maps files in src/pages to URLs. This page covers static and dynamic routes, getStaticPaths, rest parameters, endpoints that return JSON or feeds, redirects, custom error pages, and the precedence rules that decide which file wins when several match.
Server rendering in Astro
Static output is the default, but any route can render on demand once an adapter is installed. This page covers prerendering per route, adapters, request data and cookies, middleware with locals, actions for forms, and typed environment variables.
What is Astro
Astro renders pages to HTML on the server and ships JavaScript only for the components that need it. This overview explains the islands model, the kind of site Astro is built for, how the project got here, and when another framework is the better choice.