---
title: "Pitlane guides"
description: "An introduction to Pitlane, a composable toolkit for Remix 3, with guides for each task."
url: "https://pitlane.tools/guides"
---

# Pitlane guides

Pitlane is a composable toolkit for [Remix 3](https://remix.run). Its Vite plugin runs the dev server and builds the app for its host. Additional packages resolve built assets and handle content and styling, with a Cloudflare D1 driver and an in-memory crawler available separately.

Remix owns routing and UI. Pitlane's packages compose with its APIs: content collections validate with `remix/data-schema`, and the D1 driver plugs into `remix/data-table`.

These guides explain how each piece behaves and when to reach for it. The [API reference](https://pitlane.tools/package/vite-plugin-remix/index.md) documents every export separately.

## Guides

### Build and develop

- [Using the Vite plugin](https://pitlane.tools/guides/vite-plugin.md)

    What `remix()` does in dev, preview, and the build, including the `clientEntry()` transform.

- [Hot module replacement](https://pitlane.tools/guides/hmr.md)

    Component state across edits and server-data revalidation through the frame runtime.

- [Single-page apps](https://pitlane.tools/guides/spa.md)

    A client-rendered app with `remix({ server: false })`, and what the plugin still does without a server.

- [Prerendering](https://pitlane.tools/guides/prerendering.md)

    Rendering paths to static HTML during `vite build`, and where those paths come from.

- [Fetch server](https://pitlane.tools/guides/fetch-server.md)

    Serving a `fetch` handler through Vite's dev server with `fetchServer()`.

### Assets

- [Asset resolution](https://pitlane.tools/guides/assets.md)

    Script entries, stylesheets, and preloads from `createAssetResolver()`, with or without Remix.

- [Manifest integrations](https://pitlane.tools/guides/asset-build.md)

    Turning another bundler's output into an asset manifest with `createAssetManifest()`.

### Deploy

- [Cloudflare Workers](https://pitlane.tools/deploy/cloudflare.md)

    Local development with workerd and deployment through Wrangler.

- [Netlify](https://pitlane.tools/deploy/netlify.md)

    A one-file Netlify Function around the built fetch handler.

- [Vercel](https://pitlane.tools/deploy/vercel.md)

    Deploying server functions through Nitro.

- [Railway](https://pitlane.tools/deploy/railway.md)

    Container deployment with a choice of runtime.

- [Deno Deploy](https://pitlane.tools/deploy/deno-deploy.md)

    The fetch handler behind a short `Deno.serve` entrypoint.

- [GitHub Pages](https://pitlane.tools/deploy/github-pages.md)

    A single-page app or a fully prerendered site, with the base path a project site needs.

### Content and styling

- [Content](https://pitlane.tools/guides/content.md)

    Querying schema-validated collections of Markdown, MDX, JSON, or YAML.

- [Theme](https://pitlane.tools/guides/theme.md)

    Typed design tokens for styling with `css()` mixins.

### Crawling

- [Crawler](https://pitlane.tools/guides/crawler.md)

    Walking the app's router in memory for sitemaps and link checks.

### Data

- [Cloudflare D1](https://pitlane.tools/guides/cloudflare-d1.md)

    Running `remix/data-table` on a D1 binding, and the D1 limits the driver cannot hide.

Content, prerendering, and the Railway and Deno Deploy guides also cover apps that run straight from source with no build step. Their pages switch between the Vite and No Build versions.

## Start a new app

The [starter templates](https://github.com/pitlane-tools/templates) are one guest book app, wired once for each deploy target. Scaffold the Cloudflare one with [giget](https://github.com/unjs/giget):

```sh
npx giget github:pitlane-tools/templates/cloudflare my-app
```

The repository names the other targets, and the [deploy guides](#deploy) cover each one.

## Add Pitlane to a Remix app

Install the `pitlane` package. It needs `remix` 3 and `vite` 8.1 or later as peer dependencies.

```sh
npm add pitlane
```

With yarn, pnpm, bun, vp, vlt, or nub, run the same command with the manager's name in place of `npm`. With deno, put its name in place of `npm` and write each package as `npm:<package>`.

Then add the Vite plugin from `pitlane/vite-plugin-remix` to `vite.config.ts`:

```ts title="vite.config.ts"
import { remix } from "pitlane/vite-plugin-remix";
import { defineConfig } from "vite";

export default defineConfig({
    plugins: [remix()],
});
```

[Using the Vite plugin](https://pitlane.tools/guides/vite-plugin.md#the-three-file-core) shows the server and browser entry files the plugin expects, and what changes between dev, preview, and the build.

### Imports

`pitlane` installs every Pitlane package and re-exports each one under a subpath named after it: `@pitlane/vite-plugin-remix` becomes `pitlane/vite-plugin-remix`, and `@pitlane/theme/schema` becomes `pitlane/theme/schema`. Bare `pitlane` has no exports, so every import names a subpath.

Each package also installs on its own under its `@pitlane/*` name. That route suits an app that uses one package or needs a release newer than the one `pitlane` pins. [Installing Pitlane](https://pitlane.tools/guides/umbrella.md) compares the installs and explains the version pins, with a full subpath reference.

## For coding agents

`pitlane` releases after `1.0.0-alpha.1` install these guides with the package, so an agent working in an app can read the version the app depends on. [Documentation for coding agents](https://pitlane.tools/guides/umbrella.md#documentation-for-coding-agents) explains where the files are and how to point an agent at them.