---
title: "Next.js + FastAPI + Bindings Starter"
description: "A monorepo with a Next.js frontend and a private FastAPI backend."
url: "https://vercel.com/templates/next.js/next-js-fastapi-bindings-starter"
links:
  repository: "https://github.com/vercel/examples/tree/main/python/nextjs-fastapi-bindings"
  demo: "https://nextjs-fastapi-services-bindings.vercel.app/"
  deploy: "https://vercel.com/new/clone?demo-title=Next.js+%2B+FastAPI+%2B+Bindings+Starter&demo-description=A+monorepo+with+a+Next.js+frontend+and+a+private+FastAPI+backend.&demo-url=https%3A%2F%2Fnextjs-fastapi-services-bindings.vercel.app%2F&demo-image=%2F%2Fimages.ctfassets.net%2Fe5382hct74si%2F1W0yRqenrUoqtVqAvV5nub%2F33be074bc6b488b5cef42c38b7c19b8d%2Fnextjs-fastapi-services-bindings.png&project-name=Next.js+%2B+FastAPI+%2B+Bindings+Starter&repository-name=next-js-fastapi-bindings-starter&repository-url=https%3A%2F%2Fgithub.com%2Fvercel%2Fexamples%2Ftree%2Fmain%2Fpython%2Fnextjs-fastapi-bindings&from=templates&skippable-integrations=1"
---

# Next.js + FastAPI + Bindings Starter

A monorepo with a Next.js frontend and a private FastAPI backend.

# Next.js + FastAPI + Bindings

This example shows a monorepo using [Vercel Services](https://vercel.com/docs/services) with a Next.js frontend and a private FastAPI backend.

## Demo

https://nextjs-fastapi-services-bindings.vercel.app/

### How it works

The project is structured as a monorepo:
```
nextjs-fastapi-bindings/
├── backend/
├── frontend/
└── vercel.json
```

Services are configured in `vercel.json`:
```json
{
  "services": {
    "frontend": {
      "root": "frontend/",
      "framework": "nextjs",
      "bindings": [
        {
          "type": "service",
          "service": "backend",
          "format": "url",
          "env": "BACKEND_URL"
        }
      ]
    },
    "backend": { "root": "backend/", "entrypoint": "main:app" }
  },
  "rewrites": [
    {
      "source": "/(.*)",
      "destination": { "service": "frontend" }
    }
  ]
}
```

Vercel will route all requests to the frontend. Next.js API routes will be able to access the backend at `BACKEND_URL`.

## Running Locally

```bash
vercel dev
```

Open `http://localhost:3000` and try:

- `/api/hello` (Next.js API route)
- `/svc/api/status` (FastAPI via Next.js API route)

## Learn More

- [Vercel Services](https://vercel.com/docs/services) - learn how services work on Vercel.
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
- [FastAPI Documentation](https://fastapi.tiangolo.com/) - learn about FastAPI features and API.

---

## Additional documentation

The [Vercel Knowledge Base](https://vercel.com/kb) contains guides and answers to common questions about Vercel, including deployment, framework configuration, domains, caching, and troubleshooting.
