# Guides

> Guides: a worked guide from route registry through to a production build.

Source: [https://askrjs.com/docs/guides](https://askrjs.com/docs/guides)

Status: stable. Packages: @askrjs/askr.

**Published packages are authoritative.** Examples may lag behind a published contract. When guidance differs, verify the exports and TypeScript declarations in your installed package, then file an issue.

## Example

Start from an explicit route registry and add one application boundary at a time so browser, server, and production behavior stay testable.

```tsx
export const registry = createRouteRegistry(() => {
  group({ layout: AppLayout }, () => {
    route('/', DashboardPage);
    route('/projects/{projectId}', ProjectPage);
    route('/404', NotFoundPage);
  });
});
```

## Choose a guide

Each recipe in this section targets a specific shape of application: an SPA, an SSR app, an authenticated full-stack app, an API-only server, a static site, or an MCP server. Pick the one that matches your deployment target rather than reading them in order — `createSPA`, `hydrateSPA`, and `createIslands` are mutually exclusive client execution models, not layers you stack. `createStaticGen` is different: it's a build-time step, commonly paired with `hydrateSPA` (generate HTML, then hydrate it), not a fourth option in the same mutually-exclusive set. If you're not sure which fits, start with the SPA guide and add SSR or static generation later; the router and component code barely changes.

## Start from a starter

`askr create startkit my-app` scaffolds a working project with the right `@askrjs/vite` plugin wiring already in place, so you're not hand-assembling `vite.config.ts` from these snippets. `askr create --prompt "..."` picks a template automatically when you describe the app you want. Both write a `.askr/blueprint.json` you can diff against as you follow a guide, which makes it easy to see exactly what a recipe added on top of the base scaffold.

## Keep boundaries explicit

Askr's server layer asks you to build dependencies — database handles, auth resolvers, audit loggers — at a single composition root and pass them into route registration functions, not stash them on request context or reach for a service locator. Follow the same pattern on the client: build your route registry with `createRouteRegistry()` once, and pass query and mutation definitions in rather than constructing them ad hoc inside components. It costs a little boilerplate up front and pays off the first time you need to swap a real dependency for a test fake.

## Production finish bar

Before calling any of these recipes done, check that `ErrorBoundary` wraps the parts of the tree that can fail at render time, that mutations declared with `defineAction`/`action` invalidate the right query keys, and that routes carrying real auth requirements are marked runtime-only rather than accidentally prerendered by `createStaticGen`. Run `askr openapi --check` if you're exposing a contract, since it fails CI on any byte-level drift from the committed spec. None of this is exotic — it's the same checklist every guide in this section ends on.

## In this section

- [Build an SPA](https://askrjs.com/docs/guides/build-an-spa/index.md): Build an SPA: a worked guide from route registry through to a production build.
- [Add SSR to an SPA](https://askrjs.com/docs/guides/add-ssr-to-an-spa/index.md): Add SSR to an SPA: a worked guide from route registry through to a production build.
- [Build an Authenticated Full-Stack App](https://askrjs.com/docs/guides/build-an-authenticated-full-stack-app/index.md): Build an Authenticated Full-Stack App: a worked guide from route registry through to a production build.
- [Build an API-Only Server](https://askrjs.com/docs/guides/build-an-api-only-server/index.md): Build an API-Only Server: a worked guide from route registry through to a production build.
- [Generate a Static Site](https://askrjs.com/docs/guides/generate-a-static-site/index.md): Generate a Static Site: a worked guide from route registry through to a production build.
- [Build an MCP Server](https://askrjs.com/docs/guides/build-an-mcp-server/index.md): Build an MCP Server: a worked guide from route registry through to a production build.
- [Forms, Actions, and CRUD](https://askrjs.com/docs/guides/forms-actions-and-crud/index.md): Forms, Actions, and CRUD: a worked guide from route registry through to a production build.
- [Tables, Filters, and URL State](https://askrjs.com/docs/guides/tables-filters-and-url-state/index.md): Tables, Filters, and URL State: a worked guide from route registry through to a production build.
- [Dashboards, Charts, and Polling](https://askrjs.com/docs/guides/dashboards-charts-and-polling/index.md): Dashboards, Charts, and Polling: a worked guide from route registry through to a production build.
- [Protected Routes and Permissions](https://askrjs.com/docs/guides/protected-routes-and-permissions/index.md): Protected Routes and Permissions: a worked guide from route registry through to a production build.
- [API Integration and Error Handling](https://askrjs.com/docs/guides/api-integration-and-error-handling/index.md): API Integration and Error Handling: a worked guide from route registry through to a production build.
- [Loading, Empty, Error, and Pending States](https://askrjs.com/docs/guides/loading-empty-error-and-pending-states/index.md): Loading, Empty, Error, and Pending States: a worked guide from route registry through to a production build.
- [Realtime Streams](https://askrjs.com/docs/guides/realtime-streams/index.md): Realtime Streams: a worked guide from route registry through to a production build.
- [File Uploads and Artifacts](https://askrjs.com/docs/guides/file-uploads-and-artifacts/index.md): File Uploads and Artifacts: a worked guide from route registry through to a production build.
- [Environment Configuration](https://askrjs.com/docs/guides/environment-configuration/index.md): Environment Configuration: a worked guide from route registry through to a production build.
- [Accessibility](https://askrjs.com/docs/guides/accessibility/index.md): Accessibility: a worked guide from route registry through to a production build.
- [Testing Deterministic Applications](https://askrjs.com/docs/guides/testing-deterministic-applications/index.md): Testing Deterministic Applications: a worked guide from route registry through to a production build.
- [Testing HTTP Applications](https://askrjs.com/docs/guides/testing-http-applications/index.md): Testing HTTP Applications: a worked guide from route registry through to a production build.
- [Production Readiness](https://askrjs.com/docs/guides/production-readiness/index.md): Production Readiness: a worked guide from route registry through to a production build.
- [Migration from React](https://askrjs.com/docs/guides/migration-from-react/index.md): Migration from React: a worked guide from route registry through to a production build.

## Documentation navigation

[Previous](https://askrjs.com/docs/tooling/vite/index.md) | [Next](https://askrjs.com/docs/guides/build-an-spa/index.md)