> ## Documentation Index
> Fetch the complete documentation index at: https://docs.frontic.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Overview

The developer surfaces around a Frontic project — the CLI you install once, the typed clients your frontend code calls, the MCP server your editor agents connect to, and the public APIs that move data in and out.

## Build the experience

<CardGroup cols={2}>
  <Card title="Frontic CLI" icon="terminal" href="/reference/frontic-cli">
    Generate the typed Client SDK, sync your Context Base, and manage project state from the command line.
  </Card>

  <Card title="Client SDK" icon="code" href="/reference/client-sdk">
    Typed JavaScript client for calling your project's blocks, listings, pages, and trees. Generated by **frontic generate**.
  </Card>

  <Card title="Nuxt Module" icon="cube" href="/reference/nuxt-module">
    Drop-in composables, search and filter helpers, dynamic page routing with redirect and 404 handling, automatic caching, and SSR.
  </Card>

  <Card title="Frontic UI" icon="swatchbook" href="/reference/frontic-ui">
    Vue component library scaffolded into your repo for product cards, search, listings, and more. **Preview**.
  </Card>
</CardGroup>

## Connect AI tools

<CardGroup cols={2}>
  <Card title="Frontic Tools (MCP)" icon="microchip-ai" href="/reference/mcp/frontic-tools">
    Read and write your project's stack from any MCP-capable editor — blocks, listings, pages, storages, and syncs.
  </Card>

  <Card title="Frontic Docs (MCP)" icon="book-open" href="/reference/mcp/frontic-docs">
    Read-only access to the Frontic documentation from your editor agent — search docs and pull pages on demand.
  </Card>
</CardGroup>

## HTTP APIs

<CardGroup cols={2}>
  <Card title="Ingest API" icon="upload" href="/reference/ingest-api">
    Push data into Frontic — upsert and patch records, trigger feed runs, delete by source ID. The endpoint your sources call.
  </Card>

  <Card title="Fetch API" icon="download" href="/reference/fetch-api">
    Read blocks, listings, pages, and trees from any HTTP client. The base layer the Client SDK and Nuxt module call under the hood.
  </Card>
</CardGroup>

## Data model

<CardGroup cols={2}>
  <Card title="Storage Field Types" icon="gif" href="/reference/storage-field-types">
    Primitives, built-in composites (Price, Media, Availability, SEO, …), and enums on every storage. The minimum guaranteed contract.
  </Card>

  <Card title="Value Composer" icon="wand-magic-sparkles" href="/reference/value-composer">
    Operations and slot modes for shaping feed records into storage records during a Data Sync — the per-field configuration.
  </Card>
</CardGroup>