Application Fullstack : Angular 20, Node.js et Java 21

September 13, 2025 · View on GitHub

logo ganatan

🚀 Objectifs du projet

  • ✅ Stack frontend / backend complète
  • ✅ Compatibilité CI/CD et Docker
  • ✅ Déploiement simple (Docker optionnel)
  • ✅ Composants isolés et testables

👉 Looking for the English version? : English

ComposantDescription
FrontendAngular 20 — SPA avec Routing, SSR, PWA, SEO
Backend JavascriptNode.js 22 + Express — API REST avec données mockées ou BDD
Backend TypeScriptNode.js 22 + TypeScript — API typée avec données ou BDD
Backend Spring BootJava 21 + Spring Boot — API REST simple et moderne

🔧 Intégration Continue (CI)

ProjetBadge CI
Frontend AngularFrontend Angular CI
Backend JavaScriptBackend JavaScript CI
Backend TypeScriptBackend TypeScript CI
Backend Spring BootBackend Spring Boot CI

📦 Images Docker

ComposantBadge Docker
Backend JavaScriptDocker Image Version - Backend JavaScript
Backend TypeScriptDocker Image Version - Backend TypeScript
Backend Spring BootDocker Image Version - Backend Spring Boot
Frontend AngularDocker Image Version - Frontend Angular

📦 Stack technologique

Angular Node Java Docker License: MIT

📚 Table des matières

🌐 Démo en ligne

🔗 Voir la démo Angular

Angular 20 Example Application

📁 Structure du projet

🧩 Frontend

  • frontend-angular
    Application Angular 19 (Incluant Routing, Lazy loading, SSR, PWA, SEO)

🚀 Backends

  • backend-javascript
    API Express.js en JavaScript avec PostgreSQL, MySQL ou données mockées

  • backend-typescript
    API Express.js en TypeScript avec PostgreSQL, MySQL ou données mockées

🔧 Configuration du frontend (Angular)

Dans frontend-angular/src/environments/environment.ts :

useDatabase: false,
backend: 'http://localhost:3000',
useDatabaseMode
falseDonnées mockées côté frontend
trueDonnées réelles via le backend

🛠 Configuration des backends

Dans le fichier .env :

PORT=3000
DB_CLIENT=mock # mock | pg | mysql
DB_CLIENTSource de données
mockDonnées simulées
pgPostgreSQL
mysqlMySQL

🔗 APIs exposées

RessourceURL
Continentshttp://localhost:3000/continents
Citieshttp://localhost:3000/cities
Countrieshttp://localhost:3000/countries
Personshttp://localhost:3000/persons
Professionshttp://localhost:3000/professions

⚙️ Démarrage rapide

▶️ Cloner le projet

git clone https://github.com/ganatan/angular-app.git
cd angular-app

▶️ Frontend Angular

cd frontend-angular
npm install
npm start
# http://localhost:4200

▶️ Backend JavaScript

cd backend-javascript
npm install
npm start
# http://localhost:3000

▶️ Backend TypeScript

cd backend-typescript
npm install
npm start
# http://localhost:3000

🐳 Déploiement avec Docker

▶️ Prérequis

▶️ Lancer le frontend Angular via Docker

docker pull ganatan/frontend-angular
docker run -d -p 4200:4200 ganatan/frontend-angular
# http://localhost:4200

▶️ Lancer le backend Javascript via Docker

docker pull ganatan/backend-javascript
docker run -d -p 8080:8080 ganatan/backend-javascript
# http://localhost:8080

▶️ Lancer le backend Typescript via Docker

docker pull ganatan/backend-typescript
docker run -d -p 8080:8080 ganatan/backend-typescript
# http://localhost:8080

👤 Author

📚 Documentation