Spaces
Download

Next.js + Django Monorepo (Docker)

Use this when both frontend and backend are in one repo and run through Docker Compose.

Use case

You need reproducible containerized frontend and backend environments per workspace, with host ports isolated by Spaces.

Project settings explained

Services

frontend
api

Spaces allocates a host port per service per workspace; Compose maps them to container ports.

docker-compose.yml example

services:
  frontend:
    build: ./frontend
    ports:
      - "${SPACES_FRONTEND_PORT}:3000"
    environment:
      - API_URL=http://backend:8000

  backend:
    build: ./backend
    ports:
      - "${SPACES_API_PORT}:8000"

Setup script

cp .env.example .env

Keeps workspace configuration predictable; the same isolation-versus-centralized-updates tradeoff applies between copy and symlink. Point cp at whatever seed file your repo keeps, Spaces has no built-in shared env file.

Process

SPACES_FRONTEND_PORT=$SPACES_FRONTEND_PORT SPACES_API_PORT=$SPACES_API_PORT docker compose up --build

One Compose process starts both services and streams their logs in a single terminal.

Browser sessions

Add two browser sessions, one URL per entry, so each opens as a Chrome tab when you focus it.

# frontend browser session
$SPACES_FRONTEND_URL
# backend browser session
$SPACES_API_URL/admin

Named-service URLs keep each browser target tied to the correct workspace instance.

Stop command strategy

# normal pause
docker compose stop

# full cleanup reset
docker compose down

Prefer stop for faster day-to-day iteration; use down when you need to tear down the network and container state.

← All recipes