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

# Starter projects

> Clone a starter repo to bootstrap a ButterCMS integration.

Use a starter when you want a working project structure, sample content types, and API wiring out of the box.

## Why use our starter projects?

Each starter project includes:

<AccordionGroup>
  <Accordion title="Full ButterCMS Integration">
    Pre-configured API client, environment variable setup, and data-fetching helpers — clone, add your token, and run.
  </Accordion>

  <Accordion title="Working Page Routes">
    Landing page routes pre-wired to Page Types, so you can see fetch-and-render working end-to-end without writing any plumbing.
  </Accordion>

  <Accordion title="Collections in Context">
    Sample collections (navigation, testimonials, features) fetched and rendered within pages, showing the reusable content pattern.
  </Accordion>

  <Accordion title="Blog Engine">
    Fully functional blog with posts, categories, tags, authors, and search — all routes pre-built.
  </Accordion>

  <Accordion title="One-Click Deploy">
    Deploy to Vercel with a single click. Heroku also supported on most starters.
  </Accordion>
</AccordionGroup>

## Pick a starter

Start with a framework you already use, then customize the content model as needed.

<CardGroup cols={4}>
  <Card title="Angular" icon="angular" href="./angular" />

  <Card title="Astro" icon="star" href="./astro" />

  <Card title="Django" icon="python" href="./django" />

  <Card title=".NET" icon="microsoft" href="./dotnet" />

  <Card title="Express.js" icon="node-js" href="./expressjs" />

  <Card title="Go" icon="golang" href="./go" />

  <Card title="Hugo" icon="code" href="./hugo" />

  <Card title="Java" icon="java" href="./java" />

  <Card title="JavaScript" icon="js" href="./javascript" />

  <Card title="Laravel" icon="php" href="./laravel" />

  <Card title="Next.js" icon="react" href="./nextjs" />

  <Card title="Node.js" icon="node-js" href="./nodejs" />

  <Card title="Nuxt" icon="vuejs" href="./nuxt" />

  <Card title="PHP" icon="php" href="./php" />

  <Card title="Python" icon="python" href="./python" />

  <Card title="Rails" icon="gem" href="./rails" />

  <Card title="React" icon="react" href="./react" />

  <Card title="Ruby" icon="gem" href="./ruby" />

  <Card title="Spring" icon="java" href="./spring" />

  <Card title="Vue.js" icon="vuejs" href="./vue" />
</CardGroup>

## Next steps

* Use the framework guide for end-to-end setup and deployment.
* Use the SDK guide if you want a lighter integration.