# Guides

> Task-oriented how-tos and learning paths for building Progressive Web Apps — from your first PWA to installability, offline, performance, and advanced topics.

import { CardGrid, LinkCard } from '@astrojs/starlight/components';

Where the [Reference](/reference/) describes *what things are*, Guides are
**task-oriented** — how to actually get something done. They form a progression from
your first PWA through the harder problems, and link back into the Reference and
[Compatibility](/compatibility/) data for the authoritative detail.

## The learning path

Work top to bottom: each guide assumes the outcome of the one before it.

<CardGrid>
	<LinkCard title="Getting started" href="/guides/getting-started/" description="Build and ship your first installable PWA — manifest, service worker, installability." />
	<LinkCard title="Make it installable" href="/guides/installable/" description="Beyond the bar: design the install moment and the launch experience." />
	<LinkCard title="Offline strategies" href="/guides/offline/" description="Pick a caching strategy per request type; stay useful with no network." />
	<LinkCard title="Performance" href="/guides/performance/" description="Measure and move LCP, INP, and CLS; make launch feel instant." />
	<LinkCard title="Advanced" href="/guides/advanced/" description="Push, file access, and platform integration as progressive enhancement." />
</CardGrid>

## How guides relate to the rest of the site

Guides are the *how*. They never restate the facts that live elsewhere:

- For *what a thing is and how it behaves*, guides link into the [Reference](/reference/).
- For *where it works*, guides link into the [Compatibility](/compatibility/) data.

That keeps the facts in one place — a guide tells you the steps and cites the
reference entry or support matrix for the detail, so guidance never drifts from the
facts. Every guide carries `sources` and a `lastVerified` date, and is written to stay
current: it teaches a durable task, not a dated announcement.