Containerisation d'une application Full Stack Spring Boot et Angular avec Docker

Dans l'écosystème du développement logiciel moderne, la capacité à déployer et gérer des applications de manière cohérente et efficace est primordiale. Pour les développeurs Full Stack, jonglant avec des technologies front-end et back-end, la complexité peut rapidement augmenter. C'est ici que Docker, la plateforme de conteneurisation leader, apporte une solution puissante, simplifiant grandement le cycle de vie des applications.

Cet article explore les étapes clés de la containerisation d'une application Full Stack typique, composée d'un backend en Spring Boot et d'un frontend en Angular. La maîtrise de cette approche est essentielle pour assurer la portabilité, la reproductibilité et l'évolutivité des projets. Laty Gueye Samba, Développeur Full Stack Java Spring Boot + Angular basé à Dakar, met en lumière l'importance de Docker pour optimiser les flux de développement et de déploiement, une compétence particulièrement valorisée dans le paysage technologique actuel.

Pourquoi Docker pour une application Full Stack ?

La containerisation offre une multitude d'avantages, particulièrement pertinents pour les applications Full Stack. Chaque composant (backend Spring Boot, frontend Angular) peut être isolé dans son propre conteneur, garantissant ainsi que chaque service fonctionne dans un environnement prévisible et défini. Cela élimine les problèmes de "ça marche sur ma machine" et standardise l'environnement d'exécution, du développement à la production.

Pour une application Spring Boot, Docker simplifie la gestion des dépendances Java et de la JVM, assurant une exécution stable quel que soit le serveur hôte. Côté Angular, la containerisation permet de construire le projet dans un environnement contrôlé, puis de servir les fichiers statiques résultants via un serveur web léger comme Nginx, le tout au sein d'un conteneur dédié. Cette approche modulaire facilite également la scalabilité et la maintenance, permettant de mettre à jour ou de remplacer un composant sans affecter l'autre.

Containerisation du Backend Spring Boot

La création d'une image Docker pour une application Spring Boot implique généralement l'utilisation d'un Dockerfile qui va compiler l'application et l'empaqueter dans un environnement d'exécution léger. Il est recommandé d'utiliser une approche de build multi-étapes pour réduire la taille finale de l'image.

Voici un exemple de Dockerfile pour une application Spring Boot générique :

# Étape de build
FROM openjdk:17-jdk-slim AS build
WORKDIR /app
COPY mvnw .
COPY .mvn .mvn
COPY pom.xml .
COPY src src
RUN ./mvnw package -Dmaven.test.skip=true

# Étape d'exécution
FROM openjdk:17-jre-slim
WORKDIR /app
COPY --from=build /app/target/*.jar app.jar
EXPOSE 8080
ENTRYPOINT ["java", "-jar", "app.jar"]

Ce Dockerfile commence par compiler l'application avec Maven (étape build) et génère un fichier JAR. Ensuite, une image JRE plus légère est utilisée (étape d'exécution) pour ne copier que le JAR compilé, réduisant ainsi considérablement la taille de l'image finale. Le port 8080 est exposé, correspondant généralement au port par défaut des applications Spring Boot.

Containerisation du Frontend Angular

Pour le frontend Angular, le processus est similaire mais adapté aux spécificités du développement web. Il s'agit de construire l'application Angular (générant des fichiers statiques HTML, CSS, JS) puis de les servir via un serveur web léger et performant comme Nginx, le tout dans un conteneur Docker séparé.

Voici un exemple de Dockerfile pour une application Angular :

# Étape de build
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 d'exécution (avec Nginx)
FROM nginx:alpine
COPY --from=build /app/dist/<nom-de-votre-app-angular> /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

Dans cet exemple, l'application Angular est d'abord construite à l'aide d'une image Node.js (étape build). Ensuite, les fichiers statiques résultants du build sont copiés dans une image Nginx Alpine, qui servira ces fichiers. Le port 80 est exposé, le port standard pour le trafic HTTP.

Orchestration des Services avec Docker Compose

Pour faire fonctionner l'ensemble de l'application Full Stack, il est nécessaire d'orchestrer les conteneurs Spring Boot et Angular. Docker Compose est l'outil idéal pour définir et exécuter des applications Docker multi-conteneurs. Il permet de configurer tous les services (backend, frontend, base de données si nécessaire) dans un seul fichier docker-compose.yml.

Un exemple de docker-compose.yml pour l'application décrite :

version: '3.8'
services:
  backend:
    build:
      context: ./backend # Chemin vers le dossier de votre 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

  frontend:
    build:
      context: ./frontend # Chemin vers le dossier de votre application Angular
      dockerfile: Dockerfile
    ports:
      - "4200:80" # Accès au frontend via le port 4200, Nginx expose le port 80
    depends_on:
      - backend

  db:
    image: postgres:13-alpine
    environment:
      POSTGRES_DB: mydatabase
      POSTGRES_USER: user
      POSTGRES_PASSWORD: password
    volumes:
      - db_data:/var/lib/postgresql/data

volumes:
  db_data:

Ce fichier docker-compose.yml définit trois services : backend (Spring Boot), frontend (Angular) et db (PostgreSQL). Les dépendances sont gérées (le frontend dépend du backend, qui dépend de la base de données), et les ports sont mappés pour l'accès externe. Les variables d'environnement sont utilisées pour configurer la connexion à la base de données pour le backend. Pour démarrer l'ensemble, une simple commande docker-compose up --build suffit.

Conclusion

La containerisation d'applications Full Stack Spring Boot et Angular avec Docker est une pratique qui s'impose comme un standard de l'industrie. Elle apporte une solution robuste aux défis de la gestion des environnements, de la reproductibilité des builds et de la simplification des déploiements.

Laty Gueye Samba, Développeur Full Stack à Dakar, expert en Java Spring Boot et Angular, souligne l'importance stratégique de ces compétences pour les professionnels du développement logiciel. Adopter Docker, c'est investir dans l'efficacité et la pérennité de ses projets, assurant une livraison de valeur continue pour les clients et utilisateurs.

Pour approfondir vos connaissances, il est recommandé de consulter les documentations officielles :

• Documentation Docker officielle
• Site officiel Spring Boot
• Documentation Angular officielle