README.en.md

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

🚀 Project Goals

• ✅ Complete frontend / backend stack
• ✅ CI/CD and Docker compatibility
• ✅ Simple deployment (Docker optional)
• ✅ Isolated and testable components

---

👉 Version française disponible ici :

---

Component	Description
Frontend	Angular 20 — SPA with Routing, SSR, PWA, SEO
Backend JavaScript (ESM)	Node.js 22 + Express — REST API with mocked data or database
Backend JavaScript (CJS)	CJS variant, same structure as ESM version
Backend TypeScript	Node.js 22 + TypeScript — Typed REST API with data or database
Backend Java Spring Boot	Java 21 + Spring Boot — Simple and modern REST API

---

🔧 Continuous Integration (CI)

Project	CI Badge
Frontend Angular
Backend JavaScript (ESM)
Backend JavaScript (CJS)
Backend TypeScript
Backend Java Spring Boot

---

📦 Docker Images

Component	Docker Badge
Backend JavaScript (ESM)
Backend JavaScript (CJS)
Backend TypeScript
Frontend Angular

📦 Tech Stack

---

📚 Table of Contents

• Continuous Integration (CI)
• Docker Images
• Tech Stack
• Live Demo
• Project Structure
• Frontend Configuration (Angular)
• Backend Configuration
• Exposed APIs
• Quick Start
• Deployment with Docker
• Author
• Documentation

---

🌐 Live Demo

🔗 Check out the Angular demo

---

📁 Project Structure

🧩 Frontend

• frontend-angular
  Angular 19 app (with Routing, Lazy loading, SSR, PWA, SEO)

🚀 Backends

• backend-javascript ESM
  Express.js API in JavaScript (ESM) with PostgreSQL, MySQL or mock data

• backend-javascript commonjs
  Express.js API in JavaScript (CJS) with PostgreSQL, MySQL or mock data

• backend-typescript
  Express.js API in TypeScript with PostgreSQL, MySQL or mock data

---

🔧 Frontend Configuration (Angular)

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

useDatabase: false,
backend: 'http://localhost:3000',

useDatabase	Mode
false	Mocked data handled in frontend
true	Real data fetched from backend

---

🛠 Backend Configuration

In .env file:

PORT=3000
DB_CLIENT=mock # mock | pg | mysql

DB_CLIENT	Data Source
mock	Mocked data
pg	PostgreSQL
mysql	MySQL

---

🔗 Exposed APIs

Resource	URL
Continents	http://localhost:3000/continents
Cities	http://localhost:3000/cities
Countries	http://localhost:3000/countries
Persons	http://localhost:3000/persons
Professions	http://localhost:3000/professions

---

⚙️ Quick Start

▶️ Clone the project

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 ESM

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

▶️ Backend JavaScript CJS

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

▶️ Backend TypeScript

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

---

🐳 Deployment with Docker

▶️ Prerequisites

• Docker must be installed on your machine: Install Docker

▶️ Launch the Angular frontend with Docker

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

▶️ Launch the JavaScript ESM backend with Docker

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

▶️ Launch the JavaScript CJS backend with Docker

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

▶️ Launch the Typescript backend with Docker

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

---

👤 Author

• Danny – www.ganatan.com

---

📚 Documentation

• 🇫🇷 French tutorials
• 🇬🇧 English tutorials