---
title: "Build with code"
description: "Configure runtime delivery, dynamic messages, exclusions, and server rendering."
canonical_url: "https://docs.linguana.dev/docs/build-with-code"
markdown_url: "https://docs.linguana.dev/docs/build-with-code.md"
x_farming_labs_generated_preamble: true
---

# Build with code
URL: /docs/build-with-code
LLM index: /llms.txt
Description: Configure runtime delivery, dynamic messages, exclusions, and server rendering.

# Build with code

Keep static user-facing text in your components. The build plugin extracts it, and the framework runtime renders translations with the original source as fallback.

## Choose the integration task

- [Show translated content](/docs/build-with-code/show-translated-content): provider setup, hosted catalogs, and language switching.
- [Dynamic text and links](/docs/build-with-code/dynamic-text-and-links): values, ICU plurals, rich slots, and custom label props.
- [Keep product text and code separate](/docs/build-with-code/text-and-code): exclusions and the compiler's extraction boundaries.
- [Server rendering](/docs/build-with-code/server-rendering): resolve the language per request and share hydration state.

These guides use React examples. For Vue, Svelte, or Solid, start with [framework setup](/docs/getting-started/frameworks) and the [matching runtime reference](/docs/reference). TanStack Start uses the [request-aware React setup](/docs/getting-started/tanstack-start).

## Keep the scopes aligned

The build plugin, runtime provider, and published catalog must agree on project, environment, and locale. Build and translation APIs use a secret project token. Browser catalog delivery uses a publishable key.

<ExpectedResult>
Static text appears in the manifest without new translation keys. Dynamic messages preserve their variables and rich slots. A missing catalog leaves the source text readable.
</ExpectedResult>

<NextStep>
[Show translated content](/docs/build-with-code/show-translated-content), or [install the SDK](/docs/getting-started/install) if you have not connected the build yet.
</NextStep>

## Sitemap

See the full [sitemap](/sitemap.md) for all pages.
Docs-scoped sitemap: [/docs/sitemap.md](/docs/sitemap.md).
Well-known sitemap: [/.well-known/sitemap.md](/.well-known/sitemap.md).