Copyright © 2023 Dr.

Mohamed LACHGAR

P UBLISHED BY P UBLISHER

BOOK - WEBSITE . COM

Licensed under the Creative Commons Attribution-NonCommercial 3.0 Unported License (the
“License”). You may not use this file except in compliance with the License. You may obtain a
copy of the License at http://creativecommons.org/licenses/by-nc/3.0. Unless required
by applicable law or agreed to in writing, software distributed under the License is distributed on an
“AS IS ” BASIS , WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and limitations under the License.

First printing, September 2023

 Table des Matières

1 Conteneurisation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
1.1 Introduction 7
1.2 Docker 7
1.2.1 Principales caractéristiques de Docker . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
1.2.2 Images vs Containers vs Volumes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
1.2.3 Commandes Docker . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
1.2.4 Docker Compose . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
1.3 Conclusion 8
1.4 Travaux pratiques 9
1.4.1 Conteneurisation d’une application Spring boot Angular . . . . . . . . . . . . . . . . . 9

Pr. Mohamed LACHGAR (lachgar.m@gmail.com)

Développement JEE
 Préambule

Bienvenue au cours de programmation web JavaScript, jQuery et ReactJS ! Ce cours est conçu
pour vous initier aux merveilles de la programmation web moderne. À une époque où l’Internet est
au cœur de notre vie quotidienne, la maîtrise des technologies web est devenue une compétence
cruciale pour tout développeur. Que vous soyez un débutant curieux ou un développeur chevronné
en quête d’expansion, ce cours a été conçu pour vous.

OBJECTIFS PÉDAGOGIQUES :
Avant de plonger dans les détails de chaque chapitre, permettez-moi de souligner nos objectifs
pédagogiques. À travers ce manuel, nous visons à vous offrir une expérience d’apprentissage
enrichissante en vous guidant vers une maîtrise complète des technologies Java Enterprise Edition
(JEE). Nos objectifs incluent :
• Compréhension des Fondamentaux : Acquérir une compréhension approfondie des fonda-
mentaux de la programmation JEE, y compris les principes de persistance avec Hibernate,
les JavaServer Pages (JSP), et les Enterprise JavaBeans (EJB).
• Maîtrise des Technologies Clés : Maîtriser les technologies clés du développement JEE, telles
que Hibernate pour la persistance des données, JSP et JSTL pour la création d’interfaces
utilisateur dynamiques, et EJB pour le développement d’entreprises Java Beans.
• Utilisation des Serveurs d’Applications : Comprendre le rôle des serveurs d’application dans
le déploiement et la gestion d’applications JEE, en explorant des serveurs populaires tels que
WildFly et GlassFish.
• Application des Concepts Spring : Appliquer les concepts fondamentaux de Spring, y compris
l’Inversion de Contrôle (IoC) avec Spring IoC, la gestion des dépendances, et l’utilisation de
Spring Boot pour simplifier le développement d’applications Java.
• Exploration de Thymeleaf et Spring MVC : Découvrir Thymeleaf en tant que moteur de
modèles pour Spring MVC, comprendre les principes du modèle MVC, et réaliser des
exercices pratiques pour renforcer ces connaissances.
• Introduction à GraphQL et gRPC : Familiarisation avec les technologies modernes telles
que GraphQL pour une gestion flexible des requêtes, et gRPC pour des communications
performantes et interopérables entre services.

Pr. Mohamed LACHGAR (lachgar.m@gmail.com)

Développement JEE
6

• Développement de Microservices avec Spring Cloud : Apprendre à développer des microser-

vices avec Spring Cloud, en mettant en œuvre des fonctionnalités telles que la découverte de
services, la gestion de la configuration, la résilience et l’utilisation d’une API Gateway.
• Objectif Spring Boot : Comprendre les avantages de Spring Boot, en mettant l’accent sur la
facilité de démarrage, la préparation pour la production, et le développement de microservices
dans un environnement cloud.
En suivant ce manuel, vous serez guidé à travers des exercices pratiques qui vous permettront de
consolider vos compétences et d’appliquer ces concepts dans des scénarios concrets, vous préparant
ainsi à relever les défis du développement JEE moderne.

PUBLIC VISÉ :
Ce manuel s’adresse principalement aux étudiants, développeurs, et professionnels du domaine de
l’informatique intéressés par l’apprentissage et la mise en pratique des technologies Java Enterprise
Edition (JEE). Que vous soyez débutant dans le développement JEE ou que vous souhaitiez
approfondir vos compétences, ce guide pratique vous accompagnera à travers des exercices concrets,
offrant une approche progressive pour mieux comprendre et maîtriser les différentes facettes du
développement JEE.

Pr. Mohamed LACHGAR (lachgar.m@gmail.com)

Développement JEE
 1. Conteneurisation

1.1 Introduction

La conteneurisation a émergé comme une révolution dans le monde du développement logiciel et

du déploiement d’applications. Contrairement à la virtualisation traditionnelle, la conteneurisation
offre une approche plus légère et efficace pour isoler les applications et leurs dépendances. Elle re-
pose sur le principe de regrouper une application, ainsi que ses bibliothèques et autres dépendances,
dans un conteneur autonome.
Les conteneurs partagent le même noyau d’OS, ce qui les rend plus légers et plus rapides à
déployer que les machines virtuelles. Ils offrent une portabilité totale, garantissant que l’application
fonctionnera de la même manière indépendamment de l’environnement dans lequel le conteneur est
exécuté. De plus, la gestion des conteneurs est simplifiée, permettant un déploiement plus rapide et
une utilisation plus efficace des ressources système.

1.2 Docker

Docker, créé par Solomon Hykes, est devenu le leader incontesté dans le domaine de la conteneuri-
sation. Il fournit une plateforme complète pour créer, déployer et exécuter des conteneurs de
manière cohérente. L’essor de Docker a considérablement simplifié le cycle de vie des applications,
de la phase de développement à la production.

1.2.1 Principales caractéristiques de Docker

Docker utilise des images pour encapsuler des applications et des services, assurant une repro-
ductibilité et une cohérence tout au long du processus de déploiement. Les images peuvent être
partagées via Docker Hub, une bibliothèque en ligne de conteneurs prêts à l’emploi. De plus,
Docker offre des fonctionnalités avancées telles que la gestion des réseaux, la gestion des volumes,
et Docker Compose pour orchestrer des applications multi-conteneurs.

Pr. Mohamed LACHGAR (lachgar.m@gmail.com)

Développement JEE
 8 Chapter 1. Conteneurisation

1.2.2 Images vs Containers vs Volumes

Images
Des images sont des instantanés statiques qui contiennent un système de fichiers et les paramètres
d’exécution nécessaires pour exécuter une application.
Conteneurs
Les conteneurs sont des instances en cours d’exécution d’une image. Ils sont légers, portables et
exécutent des processus isolés.
Volumes
Les volumes sont des mécanismes de stockage persistant pour les données générées par les con-
teneurs. Ils permettent de partager des données entre le système hôte et les conteneurs.

1.2.3 Commandes Docker

• docker pull <image> : Télécharge une image depuis le Docker Hub.
• docker build -t <tag> . : Construit une image à partir d’un Dockerfile.
• docker run <options> <image> : Lance un conteneur à partir d’une image.
• docker ps : Affiche les conteneurs en cours d’exécution.
• docker exec -it <container> <command> : Exécute une commande à l’intérieur d’un
conteneur en cours d’exécution.
• docker stop <container> : Arrête un conteneur.
• docker rm <container> : Supprime un conteneur.
• docker rmi <image> : Supprime une image.

1.2.4 Docker Compose

Docker Compose permet de définir et gérer des applications multi-conteneurs. Il utilise un fichier
YAML pour décrire la configuration de l’application, les services, les réseaux, et les volumes.
• docker-compose up : Lance les conteneurs définis dans le fichier docker-compose.yml.
• docker-compose down : Arrête et supprime les conteneurs spécifiés dans le fichier docker-
compose.yml.
• docker-compose ps : Affiche l’état des services.
• docker-compose logs : Affiche les journaux des services.
Docker simplifie le déploiement d’applications en encapsulant des dépendances dans des
conteneurs, rendant le processus plus efficace, portable et reproductible.

1.3 Conclusion
En conclusion, la conteneurisation, avec Docker en tant que leader incontesté, a considérablement
transformé la manière dont nous concevons, développons, et déployons des applications. La
transition de la virtualisation traditionnelle à la conteneurisation a apporté des avantages significatifs
en termes d’efficacité, de portabilité et de gestion des ressources.
Les conteneurs offrent une isolation légère, partageant le même noyau d’OS et permettant
un déploiement rapide et cohérent des applications. Docker, avec ses fonctionnalités avancées
telles que les images, les conteneurs, les volumes et Docker Compose, a grandement simplifié le
processus de création, de distribution et de gestion d’applications dans des environnements variés.
L’utilisation de Docker et de la conteneurisation en général a marqué un tournant majeur dans
le développement logiciel moderne. Les développeurs bénéficient de cycles de développement plus
rapides, d’une gestion efficace des dépendances, et d’une flexibilité accrue dans le déploiement.
Les équipes opérationnelles profitent d’une meilleure utilisation des ressources, de déploiements
plus stables et de la possibilité d’orchestrer des applications complexes.

Pr. Mohamed LACHGAR (lachgar.m@gmail.com)

Développement JEE
 1.4 Travaux pratiques 9

1.4 Travaux pratiques

1.4.1 Conteneurisation d’une application Spring boot Angular
Pour containeriser une application Smart Home composée d’une application backend Spring Boot
avec MySQL et d’une application frontend Angular, vous avez déjà créé des Dockerfiles pour
chaque partie (backend et frontend) ainsi qu’un fichier docker-compose pour orchestrer ces services.
Voici les étapes à suivre pour containeriser et exécuter l’application :

Etape 1 : Organiser la structure du projet

Cloner les projets depuis https://github.com/lachgar/smarthouse.git.
Assurer que le projet est organisé correctement, en deux dossiers principaux, un pour le backend
(Smart_Home_back) et un pour le frontend (smartHome-front). Assurer que tous les fichiers
nécessaires pour construire chaque partie de l’application sont présents dans ces dossiers.

Ensuite, lancer et tester les projets en local.

Etape 2 : Créer les Dockerfiles

Créer les fichiers Dockerfiles pour le backend et le frontend.

Backend :

1 # Stage 1: Build with Maven

2 FROM maven:3.8.4-openjdk-17 AS builder

Pr. Mohamed LACHGAR (lachgar.m@gmail.com)

Développement JEE
 10 Chapter 1. Conteneurisation

3 WORKDIR /app
4 COPY ./src ./src
5 COPY ./pom.xml .
6 RUN mvn clean package
7
8 # Stage 2: Create the final image
9
10 FROM openjdk:17-jdk-alpine
11 VOLUME /tmp
12 ARG JAR_FILE=target/*.jar
13 COPY ${JAR_FILE} app.jar
14 ENTRYPOINT ["java","-jar","/app.jar"]

Explication :
Étape 1: Build with Maven
• FROM maven:3.8.4-openjdk-17 AS builder: Utilise l’image Maven 3.8.4 avec Open-
JDK 17 comme base pour la première étape de construction et la nomme "builder".
• WORKDIR /app: Définit le répertoire de travail à l’intérieur du conteneur comme /app.
• COPY ./src ./src: Copie le répertoire source de l’application dans le répertoire de travail
du conteneur.
• COPY ./pom.xml .: Copie le fichier pom.xml à la racine du répertoire de travail du con-
teneur.
• RUN mvn clean package: Exécute la commande Maven pour nettoyer le projet et constru-
ire le package JAR.
Étape 2: Create the final image
• FROM openjdk:17-jdk-alpine: Utilise l’image Alpine Linux avec OpenJDK 17 comme
base pour la deuxième étape de construction.
• VOLUME /tmp: Définit un volume /tmp qui peut être utilisé pour stocker des fichiers tempo-
raires ou des données persistantes.
• ARG JAR_FILE=target/*.jar: Définit un argument pour le fichier JAR généré lors de la
construction de l’application.
• COPY $JAR_FILE app.jar: Copie le fichier JAR construit depuis l’étape précédente dans
le répertoire / du conteneur et le renomme en app.jar.
• ENTRYPOINT ["java","-jar","/app.jar"]: Définit la commande d’entrée pour exé-
cuter l’application Java en utilisant le fichier JAR.

Frontend :

1 FROM node:14.15.0-alpine as builder

2 WORKDIR /app
3 COPY . .
4 RUN npm install
5 RUN npm run build
6
7 FROM nginx:alpine
8 COPY --from=builder /app/dist/smart-home /usr/share/nginx/html

Explication :
Étape 1 (Construction avec Node.js) :
• FROM node:14.15.0-alpine as builder : Utilise l’image Node.js 14.15.0 avec Alpine
Linux comme base pour la première étape et la nomme "builder".

Pr. Mohamed LACHGAR (lachgar.m@gmail.com)

Développement JEE
 1.4 Travaux pratiques 11

• WORKDIR /app : Définit le répertoire de travail à l’intérieur du conteneur sur /app.

• COPY . . : Copie tous les fichiers du répertoire actuel (machine hôte) vers le répertoire de
travail à l’intérieur du conteneur.
• RUN npm install : Installe les dépendances du projet à l’aide du gestionnaire de paquets npm.
• RUN npm run build : Construit l’application selon le script de construction défini dans le
projet.
Étape 2 (Création de l’image finale avec Nginx) :
• FROM nginx:alpine : Utilise l’image Nginx avec Alpine Linux comme base pour la deuxième
étape.
• COPY –from=builder /app/dist/smart-home /usr/share/nginx/html : Copie l’application
construite depuis l’étape "builder" (/app/dist/smart-home) vers le répertoire HTML par défaut du
serveur Nginx (/usr/share/nginx/html). Cela configure Nginx pour servir les fichiers statiques de
l’application construite.

Etape 3 : Construire les images Docker

Créer le fichier docker-compose.yml dans le dossier racine.

1 version: ’3’
2 services:
3 mysql:
4 image: mysql:latest
5 environment:
6 MYSQL_ROOT_PASSWORD: root
7 MYSQL_DATABASE: smart-house
8 ports:
9 - "3306:3306"
10
11 backend:
12 build:
13 context: ./Smart_Home_back
14 ports:
15 - "8085:8085"
16 depends_on:
17 mysql:
18 condition: service_started
19 environment:
20 SPRING_DATASOURCE_URL: jdbc:mysql://mysql:3306/smart-house
21 SPRING_DATASOURCE_USERNAME: root
22 SPRING_DATASOURCE_PASSWORD: root
23 healthcheck:
24 test: "/usr/bin/mysql --user=root --password=root --execute \"SHOW
DATABASES;\""

Pr. Mohamed LACHGAR (lachgar.m@gmail.com)

Développement JEE
 12 Chapter 1. Conteneurisation

25 interval: 5s
26 timeout: 2s
27 retries: 100
28
29 frontend:
30 build:
31 context: ./smartHome-front
32 ports:
33 - "80:80"
34 depends_on:
35 backend:
36 condition: service_started
37
38 phpmyadmin:
39 image: phpmyadmin/phpmyadmin
40 environment:
41 PMA_HOST: mysql
42 PMA_PORT: 3306
43 MYSQL_ROOT_PASSWORD: root
44 ports:
45 - "8081:80"

Explication
mysql:
• Utilise l’image MySQL la plus récente disponible.
• Configure l’environnement MySQL avec un mot de passe root et une base de données
nommée "smart-house".
• Expose le port 3306 pour permettre l’accès à la base de données depuis l’extérieur.
backend:
• Construit le service backend à partir du contexte du dossier ./Smart_Home_back.
• Expose le port 8085 pour permettre l’accès au backend.
• Dépend du service MySQL et attend que celui-ci soit démarré avant de lancer le backend.
• Configure l’environnement du backend avec l’URL de la base de données MySQL, le nom
d’utilisateur et le mot de passe.
• Utilise une vérification de santé (healthcheck) pour s’assurer que le backend peut accéder à
la base de données MySQL.
frontend:
• Construit le service frontend à partir du contexte du dossier ./smartHome-front.
• Expose le port 80 pour permettre l’accès au frontend.
• Dépend du service backend et attend que celui-ci soit démarré avant de lancer le frontend.
phpmyadmin:
• Utilise l’image phpMyAdmin pour fournir une interface web pour la gestion de la base de
données.
• Configure l’environnement phpMyAdmin avec l’hôte MySQL, le port, et les informations
d’identification.
• Expose le port 8081 pour permettre l’accès à phpMyAdmin depuis l’extérieur.
Assurer d’être dans le répertoire où se trouve le fichier docker-compose.yml, ensuite exécuter
la commande suivante pour construire les images Docker pour le backend et le frontend.
1 docker-compose build

Pr. Mohamed LACHGAR (lachgar.m@gmail.com)

Développement JEE
 1.4 Travaux pratiques 13

Etape 4 : Lancer les conteneurs

Une fois que les images sont construites avec succès, lancer les conteneurs en utilisant la commande
suivante :
1 docker-compose up

Ajouter l’option -d si vous souhaitez exécuter les conteneurs en arrière-plan.

Etape 5 : Vérifier l’état des conteneurs

Utiliser la commande suivante pour vérifier l’état des conteneurs :
1 docker-compose ps

Assurer que tous les conteneurs sont en cours d’exécution.

Etape 6 : Accéder à l’application

Une fois les conteneurs en cours d’exécution, vous pouvez accéder à votre application frontend
à l’adresse http://localhost. Si vous avez configuré PHPMyAdmin, vous pouvez accéder à
l’interface à l’adresse http://localhost:8081.
Ces étapes devraient vous permettre de containeriser et de lancer votre application Smart Home.
Assurez-vous que vos fichiers de configuration (par exemple, les fichiers de propriétés Spring Boot)
sont correctement configurés pour fonctionner avec les services Docker.

Pr. Mohamed LACHGAR (lachgar.m@gmail.com)

Développement JEE