← AppsAI

Multi-Repo Projects

AppsAI projects can contain multiple frontends and backends. This enables building complex applications with admin dashboards, worker services, and microservices architectures.

Overview

By default, projects start with one frontend and one backend. You can add additional frontends and backends as your project grows:

Multiple Frontends

Each frontend is a completely independent Next.js App Router codebase. Use cases include: main customer app, admin dashboard, marketing site.

Multiple Backends

All backends in a project share the same MongoDB database. Use cases include: main API server, background worker, webhook handler.

Architecture

project/
├── frontend-main/      # Primary frontend (customer app)
├── frontend-admin/     # Admin dashboard
├── backend-main/       # Primary API server
├── backend-worker/     # Background job processor
└── agents/             # Shared AI agents
Frontends are Independent

Each frontend has its own codebase, dependencies, and deployment.

Backends Share Database

All backends connect to the same MongoDB, enabling shared data access.

Each Has Its Own Deployment

Frontends deploy to Vercel/CloudFront, backends to EC2/CloudFormation independently.

Managing Frontends & Backends

1

Adding a Frontend

Use the repo selector dropdown in the editor and click "Add Frontend". Choose a template or start from scratch.

2

Adding a Backend

Use the repo selector dropdown and click "Add Backend". The new backend will connect to your existing MongoDB.

3

Switching Between Repos

Use the repo selector in the editor to switch between frontends or backends. The editor context updates accordingly.

4

Setting Primary Repo

Mark one frontend and one backend as "primary". These are used when no specific repo is specified.

MCP Tool Parameters

When using MCP tools with multi-repo projects, you can specify which frontend or backend to target:

frontendId

Pass to canvas tools to target a specific frontend. Example: "main", "admin". Pass null to use the primary frontend.

backendId

Pass to backend tools to target a specific backend. Example: "main", "worker". Pass null to use the primary backend.

Example: Reading from admin frontend

canvas_READ_RAW_FILE({
  projectId: "abc123",
  frontendId: "admin",
  filePath: "app/page.tsx"
})

Repo Management Functions

listProjectRepos

List all frontends and backends in a project with their IDs and primary status.

addFrontend

Add a new frontend to the project with a unique ID and display name.

addBackend

Add a new backend to the project. It will connect to the shared MongoDB.

removeRepo

Remove a frontend or backend. Cannot remove primary repos or the last repo of its type.

setPrimaryRepo

Change which frontend or backend is the primary (default) for its type.

Common Use Cases

Customer + Admin Apps

Main customer-facing app with a separate admin dashboard for content management.

API + Worker Services

Main API backend with separate workers for background jobs, webhooks, or scheduled tasks.

Multi-Tenant Setup

Different frontends for different tenant configurations or white-label deployments.

Marketing + Product

Marketing/landing pages separate from the main product application.

Multi-Repo vs App Connections

Use multi-repo for frontends/backends that are part of the same logical application (shared database, same team). Use app connections to link completely separate projects that need cross-app AI communication.

Related

App Connections→Canvas Tools Reference→Backend Tools Reference→Deployment→