- Add Spring Boot 3.4 backend with health API, CORS, and dev/prod profiles - Add React 18 + Vite frontend with typed health client - Configure NX workspace, pnpm, and Docker Compose stacks - Document stack, commands, and layout in README - Add .gitignore for Node, Java, Docker, and IDE artifacts
4.6 KiB
4.6 KiB
🏙️ CityGame — Fullstack Template
NX Monorepo · Spring Boot 3 · React 18 · TypeScript · Vite · Docker Compose
Stack
| Layer | Technology |
|---|---|
| Backend | Spring Boot 3.4, Java 21, Maven, Lombok, JPA, Actuator |
| Frontend | React 18, TypeScript, Vite 5, Vitest |
| Database | H2 (dev) / PostgreSQL 16 (prod) |
| Infra | Docker Compose, nginx, multi-stage builds |
| Monorepo | NX 21 — caching, task graph, affected builds |
Quickstart
Prérequis
- Node.js ≥ 20
- pnpm ≥ 10 (
npm install -g pnpmoucorepack enable) - Java 21
- Docker + Docker Compose
Installation
git clone <repo-url> citygame
cd citygame
pnpm install
Commandes
🔥 Mode Développement (hot reload)
# Lance frontend (Vite HMR :5173) + backend (Spring DevTools :8080) en parallèle
pnpm dev
# Ou individuellement :
pnpm dev:frontend # Vite dev server → http://localhost:5173
pnpm dev:backend # Spring Boot → http://localhost:8080
Le backend utilise H2 en mémoire en mode dev. Pas besoin de Docker. Pour utiliser PostgreSQL en dev :
docker compose -f docker-compose.dev.yml up -d
🏗️ Build
# Build tout (frontend Vite + backend Maven JAR)
pnpm build
# Build individuellement :
pnpm build:frontend # → dist/apps/frontend/
pnpm build:backend # → apps/backend/target/*.jar
# Build les images Docker
pnpm docker:build
pnpm docker:build:frontend
pnpm docker:build:backend
🚀 Production (Docker Compose)
# Copier et configurer les variables d'environnement
cp .env.example .env
# Démarrer la stack prod (après docker:build)
pnpm start # docker compose up (foreground)
pnpm start:detach # docker compose up -d (background)
pnpm stop # docker compose down
pnpm logs # docker compose logs -f
🧪 Tests
pnpm test # Tous les tests
pnpm test:frontend # Vitest
pnpm test:backend # Maven Surefire (JUnit 5)
📊 NX Tools
npx nx graph # Visualise le graphe de dépendances
npx nx affected -t test # Tests des projets affectés par les changements
npx nx affected -t build # Build uniquement ce qui a changé
npx nx reset # Nettoie le cache NX
Structure
CityGame/
├── apps/
│ ├── backend/ # Spring Boot (Maven)
│ │ ├── src/main/java/com/citygame/
│ │ │ ├── CityGameApplication.java
│ │ │ ├── api/HealthController.java
│ │ │ └── config/CorsConfig.java
│ │ ├── src/main/resources/
│ │ │ ├── application.yml # Base config
│ │ │ ├── application-dev.yml # H2 + DevTools
│ │ │ └── application-prod.yml # PostgreSQL
│ │ ├── pom.xml
│ │ ├── project.json # NX targets
│ │ └── Dockerfile # Multi-stage
│ │
│ └── frontend/ # Vite + React + TypeScript
│ ├── src/
│ │ ├── api/health.ts # Client API typé
│ │ ├── App.tsx
│ │ └── main.tsx
│ ├── vite.config.ts # Proxy /api → backend
│ ├── project.json # NX targets
│ └── Dockerfile # Multi-stage (nginx)
│
├── docker-compose.yml # Prod stack
├── docker-compose.dev.yml # Dev (DB seulement)
├── nx.json # Config NX + caching
├── package.json # Scripts & workspace
└── .env.example # Variables template
API Endpoints
| Méthode | URL | Description |
|---|---|---|
GET |
/api/hello |
Demo endpoint (message + timestamp) |
GET |
/actuator/health |
Health check Spring Boot |
GET |
/actuator/info |
Infos application |
GET |
/h2-console |
Console H2 (dev seulement) |
Ajouter une fonctionnalité
Nouveau endpoint backend
- Créer un controller dans
apps/backend/src/main/java/com/citygame/api/ - Redémarrage automatique via Spring DevTools
Nouveau composant frontend
- Créer dans
apps/backend/src/ - HMR Vite — mise à jour sans rechargement
Nouvelle app dans le monorepo
# Nouvelle app React
npx nx g @nx/react:app apps/my-new-app --bundler=vite
# Nouvelle lib partagée TypeScript
npx nx g @nx/js:lib libs/shared-types
Configuration Docker (prod)
Copier .env.example → .env et configurer :
DB_PASSWORD=un_mot_de_passe_fort
CORS_ALLOWED_ORIGINS=https://votredomaine.com
License
MIT