Rull ut demo-decoupled: frontend og backend hver for seg

API, nginx-frontend og PostgreSQL som egne tjenester: hvordan de finner hverandre og hvilken som får domenet.

demo-decoupled er den samme applikasjonen delt i tre tjenester: et Spring Boot-API, et Angular-grensesnitt servert av nginx, og PostgreSQL. Den viser hvordan frontend og backend lever side om side i ett prosjekt.

Rull ut med ett klikk

  1. Åpne Prosjekter og trykk Rull ut demo på kortet demo-decoupled.
  2. Jambotron oppretter prosjektet, laster opp kildene, velger docker-compose.yml og starter utrullingen. Følg loggene på siden Utrullinger.
  3. To images bygges — backend (Gradle) og frontend (Angular-bygg + nginx) — så første utrulling tar litt lengre tid.

Hva er inni

services:
  demo-decoupled-postgres:  # PostgreSQL 16
    image: postgres:16-alpine
  backend:                  # Spring Boot-API, port 8080
    build: .
    depends_on:
      demo-decoupled-postgres:
        condition: service_healthy
  frontend:                 # Angular + nginx, port 80
    build: ./spring-angular-ui
    depends_on:
      backend:
        condition: service_healthy
  • nginx i frontend serverer grensesnittet og sender /api videre til http://backend:8080 — tjenestene finner hverandre via navn;
  • nettleseren snakker bare med frontend, så API-et trenger ikke eget domene;

Åpne appen

  1. Åpne prosjektet → Domener → Legg til domene.
  2. Velg tjenesten frontend, skriv inn et underdomene og containerport 80.
  3. Åpne HTTPS-adressen — grensesnittet lastes og kaller API-et via nginx.

Vil du også nå API-et utenfra (for eksempel fra en mobilapp), legg til et domene til for backend med port 8080.

Din egen frontend og backend

Følg samme mønster: én offentlig tjeneste med domene (nginx eller frontend-serveren) som sender API-et videre via tjenestenavn, og minnegrenser for tunge tjenester. Se guidene om kvoter og om apper bak en proxy.