Guide: Next.js + Django Monorepo (No Docker)

Use this when frontend and backend live in one repo and both run directly on your machine.

Use Case

One repo with /frontend and /backend. You want each workspace to spin up both services with isolated ports and predictable URLs per service.

Project Settings Explained

Services

frontend
api

Separate services keep frontend/backend stable per workspace and prevent collisions across branches.

Setup Script

cd frontend && npm i
cd ../backend && pip install -r requirements.txt
cp .env.example .env

Bootstraps both app layers. The setup script runs in a shell, so chained cd && ... steps are fine here. Copying .env gives per-workspace config freedom. Symlink centralizes updates but can cause cross-workspace side effects. Swap .env.example for whatever seed file your repo keeps — Spaces does not provide a built-in shared env file.

Processes

Add two processes. Process commands run as shell input, so cd plus env assignment runs naturally.

# frontend process
cd frontend && API_URL=$SPACES_API_URL PORT=$SPACES_FRONTEND_PORT npm run dev
# backend process
cd backend && python manage.py runserver 0.0.0.0:$SPACES_API_PORT

Frontend points to the workspace backend service. Both processes stay in one workspace context with shared per-service env vars.

Browser Sessions

Add two browser sessions — each URL is its own entry — so the frontend preview and Django admin are each one focus away.

# frontend browser session
$SPACES_FRONTEND_URL
# backend browser session
$SPACES_API_URL/admin
← Back to Cookbook Guides