Conteneurisation complète d'une application Full Stack Java/Angular avec Docker Compose

Dans l'écosystème du développement logiciel moderne, la capacité à déployer des applications de manière rapide, fiable et reproductible est devenue primordiale. Les applications Full Stack, combinant un backend robuste comme Spring Boot et un frontend dynamique tel qu'Angular, présentent des défis particuliers en matière de déploiement et d'intégration. La gestion des dépendances, des environnements et des services interconnectés peut rapidement devenir complexe sans les outils adéquats.

C'est dans ce contexte que la conteneurisation, et plus spécifiquement l'orchestration avec Docker Compose, s'impose comme une solution incontournable. Elle permet aux développeurs de regrouper une application et toutes ses dépendances dans un conteneur standardisé, assurant ainsi une cohérence parfaite entre les environnements de développement, de test et de production. Pour un développeur Full Stack expert en Java Spring Boot et Angular, comme Laty Gueye Samba basé à Dakar, Sénégal, la maîtrise de Docker Compose est un atout stratégique pour rationaliser les pipelines DevOps et optimiser la livraison de projets.

Cet article détaillera les étapes pour conteneuriser complètement une application Full Stack Java/Angular en utilisant Docker Compose. Il couvrira la création des Dockerfiles pour chaque composant et l'assemblage de l'ensemble via un fichier docker-compose.yml, offrant ainsi une approche robuste pour le déploiement d'applications complexes comme celles rencontrées dans des applications de gestion des risques ou des systèmes ERP.

Les Dockerfiles : Bâtir les images pour Spring Boot et Angular

La première étape de la conteneurisation consiste à définir comment chaque composant de l'application (backend, frontend) sera construit et exécuté au sein d'un conteneur Docker. Cela se fait via un Dockerfile, un fichier texte contenant toutes les instructions nécessaires à la création d'une image Docker. Pour les applications Full Stack, il est crucial d'avoir un Dockerfile distinct et optimisé pour chaque service.

Dockerfile pour l'application Spring Boot (Backend)

Pour le backend Spring Boot, il est souvent recommandé d'utiliser une construction en plusieurs étapes (multi-stage build) afin de réduire la taille de l'image finale. La première étape compile le projet Java, tandis que la seconde ne copie que l'artefact exécutable (JAR) et ses dépendances nécessaires.

# Étape 1: Construction du projet
FROM maven:3.8.7-openjdk-17 AS build
WORKDIR /app
COPY pom.xml .
COPY src ./src
RUN mvn clean package -DskipTests

# Étape 2: Création de l'image finale
FROM openjdk:17-jdk-slim
WORKDIR /app
COPY --from=build /app/target/*.jar app.jar
EXPOSE 8080
ENTRYPOINT ["java", "-jar", "app.jar"]

Ce Dockerfile compile l'application Spring Boot et crée une image légère basée sur openjdk:17-jdk-slim, exposant le port 8080 qui est le port par défaut des applications Spring Boot.

Dockerfile pour l'application Angular (Frontend)

L'application Angular nécessite une approche similaire. Le code source Angular est d'abord compilé en un ensemble de fichiers statiques, puis ces fichiers sont servis par un serveur web léger comme Nginx dans l'image finale.

# Étape 1: Construction de l'application Angular
FROM node:18-alpine AS build
WORKDIR /app
COPY package.json package-lock.json ./
RUN npm install
COPY . .
RUN npm run build -- --configuration production

# Étape 2: Servir l'application avec Nginx
FROM nginx:alpine
COPY --from=build /app/dist/<nom-de-votre-projet-angular> /usr/share/nginx/html
COPY ./nginx/nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

Un fichier nginx.conf personnalisé (situé dans un sous-dossier nginx/) est essentiel pour configurer Nginx afin qu'il serve correctement l'application Angular et gère les routages (par exemple, pour les single-page applications).

Orchestration des services avec Docker Compose

Une fois les Dockerfiles définis, l'étape suivante consiste à orchestrer ces différents services – backend, frontend et potentiellement une base de données – pour qu'ils fonctionnent ensemble de manière cohérente. C'est le rôle de docker-compose.yml.

Le fichier docker-compose.yml est le cœur de la conteneurisation complète. Il décrit tous les services, leurs images, leurs ports exposés, leurs volumes, leurs réseaux et leurs dépendances. Cela permet de démarrer l'ensemble de l'application avec une seule commande.

version: '3.8'
services:
  backend:
    build:
      context: ./backend # Chemin vers le dossier de l'application Spring Boot
      dockerfile: Dockerfile
    ports:
      - "8080:8080"
    environment:
      SPRING_DATASOURCE_URL: jdbc:postgresql://db:5432/mydatabase
      SPRING_DATASOURCE_USERNAME: user
      SPRING_DATASOURCE_PASSWORD: password
    depends_on:
      - db
    networks:
      - app-network

  frontend:
    build:
      context: ./frontend # Chemin vers le dossier de l'application Angular
      dockerfile: Dockerfile
    ports:
      - "4200:80" # Accès frontend via le port 4200 local, mappé au port 80 du conteneur Nginx
    depends_on:
      - backend
    networks:
      - app-network

  db:
    image: postgres:14-alpine
    environment:
      POSTGRES_DB: mydatabase
      POSTGRES_USER: user
      POSTGRES_PASSWORD: password
    volumes:
      - db-data:/var/lib/postgresql/data # Volume pour persister les données de la base de données
    networks:
      - app-network

volumes:
  db-data:

networks:
  app-network:
    driver: bridge

Dans cet exemple, trois services sont définis : backend (Spring Boot), frontend (Angular + Nginx) et db (PostgreSQL). Les dépendances (depends_on) assurent un démarrage ordonné des services, et un réseau partagé (app-network) leur permet de communiquer entre eux via leurs noms de service (par exemple, le backend se connecte à db).

Déploiement et gestion de l'application conteneurisée

Avec le fichier docker-compose.yml en place, le déploiement et la gestion de l'application deviennent grandement simplifiés. Depuis le répertoire contenant le fichier docker-compose.yml, une seule commande suffit pour démarrer l'ensemble des services :

docker compose up -d

L'option -d (détaché) exécute les conteneurs en arrière-plan. Pour arrêter et supprimer les conteneurs, les réseaux et les volumes définis par Compose, il suffit d'utiliser :

docker compose down

Cette approche facilite non seulement le déploiement initial mais aussi les mises à jour et les rollbacks. Un développeur expert comme Laty Gueye Samba peut ainsi maintenir des environnements de développement locaux qui reflètent fidèlement les environnements de production, réduisant les "ça marche sur ma machine" et accélérant le cycle de développement pour des projets de gestion hospitalière ou des applications métier complexes.

Conclusion

La conteneurisation complète d'une application Full Stack Java Spring Boot et Angular avec Docker Compose est une pratique essentielle pour tout développeur moderne. Elle offre une portabilité inégalée, une simplification du déploiement et une cohérence environnementale, des atouts majeurs pour la livraison de projets de haute qualité. Laty Gueye Samba, Développeur Full Stack à Dakar, Sénégal, expert en Java Spring Boot et Angular, utilise ces technologies pour construire des solutions résilientes et performantes.

En adoptant Docker Compose, les équipes de développement peuvent se concentrer davantage sur la logique métier et moins sur les problématiques d'infrastructure, accélérant ainsi l'innovation et la mise sur le marché. Cette compétence est indispensable pour tout Expert Java Spring Boot Angular souhaitant optimiser ses pratiques DevOps et répondre aux exigences des projets les plus ambitieux.

Ressources officielles :

• Documentation Docker Compose
• Références Dockerfile
• Site officiel Spring Boot
• Site officiel Angular