Centre national d’informatique

RAPPORT DE STAGE D’ETE

Préparé Par:

Fatma al Jabri

TITRE :

Conception et Gestion d'un Système

d'Évaluation des Formations
 REMERCIEMENT

Je tiens à remercier chaleureusement Monsieur Mohamed Ali Saadaoui pour son supervision et
ses conseils précieux tout au long de mon stage au Centre National d'Informatique (CNI). Son
soutien a été déterminant dans la réalisation de la conception du système d'inscription des
stagiaires et du portail de gestion de projets.

Un grand merci à toute l’équipe de CNI pour leur accueil et leur collaboration, qui ont
grandement facilité mon intégration et mon apprentissage.

Cette expérience a été extrêmement enrichissante et m’a permis de développer des compétences
importantes en développement web, gestion de bases de données, et optimisation des processus

RÉSUMÉ
Ce rapport présente le stage effectué au Centre National d'Informatique (CNI) de Tunis, sous la
supervision de Monsieur Mohamed Ali Saadaoui, du [1 juillet] au [31juillet].

Le stage avait pour objectifs principaux de participer au développement et à l'amélioration des

projets en cours, avec un focus sur la création d'un système d'inscription en ligne pour les
stagiaires et la gestion de projets. Les objectifs spécifiques incluaient la conception d'une
application interne pour le suivi des projets d'investissement, l'analyse et l'optimisation des
processus de gestion des données, ainsi que la mise en place d'un tableau de bord pour les
indicateurs clés de performance.

Au cours de ce stage, deux missions principales ont été réalisées :

1. Conception d'un Système d'Inscription des Stagiaires : Conception et développement

d'un système complet d'inscription en ligne, incluant la création de formulaires, la gestion
des données avec MySQL, et l'intégration de la logique avec PHP.
2. Développement de la Partie Web et Base de Données : Développement des pages web
du système d'inscription, gestion de la base de données, et ajout de fonctionnalités
JavaScript pour améliorer l'interactivité et la validation des formulaires.

2|Page
Les outils utilisés incluaient StarUML pour les diagrammes UML, HTML/CSS pour la
conception des pages web, JavaScript pour les fonctionnalités côté client, PHP pour la logique
serveur, et MySQL pour la gestion des données.

Le stage a permis de développer des compétences importantes en développement web, gestion de

bases de données, et optimisation des processus. Les principales difficultés rencontrées
concernaient l'intégration des différentes technologies et la gestion des erreurs. Cependant, ces
défis ont été des opportunités d'apprentissage significatives.

En conclusion, ce stage a été une expérience enrichissante, offrant une compréhension

approfondie des processus de développement et des meilleures pratiques en développement web
et gestion de projets.

1. ABSTRACT

This report summarizes the internship undertaken at the Centre National d'Informatique (CNI) in
Tunis under the supervision of Mr. Mohamed Ali Saadaoui from [Start Date] to [End Date]. The
internship focused on developing and improving ongoing projects, with a primary objective of
designing an online registration system for trainees and enhancing project management
processes.

Key tasks included:

1. Design and Development of a Trainee Registration System: This involved creating an

online registration platform, managing data with MySQL, and integrating backend logic
with PHP.
2. Web Development and Database Management: Development of web pages for the
registration system, database management, and adding client-side functionality with
JavaScript.

Tools used during the internship included StarUML for UML diagrams, HTML/CSS for web
design, JavaScript for client-side interactions, PHP for server-side logic, and MySQL for data
management.

The internship provided valuable experience in web development, database management, and
process optimization. Challenges such as integrating different technologies and debugging were
addressed, contributing to a deeper understanding of development processes and best practices.

Overall, the internship was a rewarding experience that enhanced both technical skills and
practical knowledge in web development and project management.

3|Page
Table des matieres

 TABLES DES MATIERE

 TABLES DES FIGURES
 INTRODUCTION GENERAL
 CADRE GENERALE
 TRAVAIL DEMANDE
 PLAN DE RAPPORT
 CHAPITRE I : ETUDE, SPECIFICATION ET ANALYSE DES BESOINS
 INTRODUCTION
 ETUDE DE L’EXISTANT
 CRITIQUE DE L’EXISTANT
 SPÉCIFICATION DES BESOINS
 INTRODUCTION
 SPÉCIFICATION DES BESOINS
 LES ACTEURS
 LES BESOINS FONCTIONNELS
 LE DIAGRAMME DE CAS D’UTILISATION : ADMIN
 LE DIAGRAMME DE CAS D’UTILISATION : PARTICIPANT
 LE DIAGRAMME DE CAS D’UTILISATION : FORMATEURS
 ANALYSE DE VUE DYNAMIQUE
 DIAGRAMME DE SÉQUENCE « INSCRIPTION »
 DIAGRAMME DE SÉQUENCE « MODIFICATION »
 DIAGRAMME DE SÉQUENCE « SUPPRESSION »
 CHAPITRE II : CONCEPTION
 INTRODUCTION
 DIAGRAMME DE CLASSE
 CHAPITRE III : REALISATION
 INTRODUCTION
 COCNLUSION

Table des figures

4|Page
FIGURE 1.1:DIGRAMME DE CAS D’UTILISATION GÉNÉRAL
FIGURE 1.2 : DIGRAMME DE CAS D’UTILISATION POUR
L’AUTHENTIFICATION
FIGURE 1.3 : DIAGRAMME DE CAS D’UTILISATION POUR ADMIN
FIGURE 1.4: DIAGRAMME DE CAS D’UTILISATION POUR PARTICIPANT
FIGURE 1.5 : DIAGRAMME DE CAS D’UTILISATION POUR FORMATEUR
FIGURE 1.6 : DIAGRAMME DE SÉQUENCE DE L’INSCRIPTION
FIGURE 1.7 : DIAGRAMME DE SÉQUENCE DE MODIFICATION
FIGURE 1.8: DIAGRAMME DE SÉQUENCE DE SUPPRESSION
FIGURE 1.9 : MODÈLE CONCEPTUEL DE DONNÉES
FIGURE 1.10: DIAGRAMME DE CLASSE
FIGURE 1.11: PAGE D’ACCUEIL
FIGURE 1.12: PAGE CONNEXION
FIGURE 1.13 : PAGE D’INSCRIPTION
FIGURE 1.14 : TABLEAU DE BORD DE L’ADMINSTRATEUR
FIGURE 1.15 : TABLEAU DE BORD DE FORMATEUR

5|Page
INTRODUCTION GENERAL

1. CADRE GENERAL

Dans le cadre de ma formation en [développement web], j'ai eu l'opportunité d'effectuer un stage

au sein au Centre National d'Informatique (CNI) en Tunisie. Ce stage, supervisé par Mohamed
Ali Saadaoui, s'est déroulé sur une période de [30jours], du [1juillet] au [31juillet]. L'objectif
principal de ce stage était de me familiariser avec le développement de systèmes d'information et
d'acquérir une expérience pratique en travaillant sur des projets concrets.

2. TRAVAIL DEMANDÉ

Le travail qui m'a été confié consistait en la conception et la mise en œuvre d'un système
d'inscription en ligne pour les stagiaires. Ce projet comprenait plusieurs étapes clés:

 Analyse des besoins et rédaction des spécifications fonctionnelles et techniques.

 Conception des diagrammes UML pour modéliser le système.
 Développement de l'application web utilisant HTML, CSS, JavaScript pour le frontend, et
PHP, MySQL pour le backend.
 Tests et validation du système développé.
 Rédaction de la documentation technique et des guides d'utilisation.

3. PLAN DU RAPPORT

Ce rapport est structuré de la manière suivante :

1. Présentation du Projet

 Contexte et objectifs du projet.

 Travail à realizer.
 Solution envisagée pour réaliser ce travail.

2. Étude, Spécification, et Analyse des Besoins

 Étude préalable et analyse des besoins.

 Specifications fonctionelles et techniques.

3. Interfaces Homme-Machine Développées

 Description des différentes interfaces utilisateur.

 Illustrations des interfaces et explications des fonctionnalités clés.

4. Développement

 Extraits et explications du code source.

6|Page
  Défis rencontrés et solutions apportées.

5. Documentation Technique

 Specifications du system.
 Instructions installation.
 Guides pour les utilisateurs et les administrateurs.

6. Captures d'Écran

 Illustrations des interfaces utilisateur et des fonctionnalités clés.

7. Conclusion

 Bilan du stage, compétences acquises, et perspectives futures.

8. Annexes

Annexes fournissant des documents complémentaires, incluant les diagrammes UML, le code
source, la documentation technique, et les captures d'écran.

7|Page
 Chapitre 1 :
ETUDE,
SPECIFICATION ET ANALYSE
DES BESOINS

8|Page
 1.1 INTRODUCTION

Dans ce chapitre, nous allons examiner les besoins et les exigences du système d'inscription en
ligne pour les formations. Nous commencerons par étudier les systèmes existants pour
comprendre leurs points forts et leurs faiblesses. Ensuite, nous définirons les besoins du nouveau
système, en tenant compte des différents utilisateurs comme l'administrateur, le formateur et le
participant.

1.2 ÉTUDE DE L'EXISTANT ET CRITIQUE DE L'EXISTANT

1.2.1 ÉTUDE DE L'EXISTANT

Actuellement, il existe plusieurs systèmes d'inscription en ligne pour les formations. Ces
systèmes varient en termes de fonctionnalités et de facilité d'utilisation. Certains sont simples et
efficaces, tandis que d'autres manquent de certaines fonctionnalités importantes, comme la
gestion des sessions ou la personnalisation des profils des utilisateurs.
1.2.2 CRITIQUE DE L'EXISTANT

Malgré les avancées, les systèmes actuels ont plusieurs limites :

 Interfaces Complexes : Beaucoup de systèmes sont difficiles à utiliser pour les

personnes peu à l'aise avec la technologie, ce qui peut entraîner une mauvaise expérience
utilisateur.
 Manque de Flexibilité : Les options de personnalisation des sessions de formation et des
profils utilisateurs sont souvent limitées, ce qui réduit la capacité du système à s'adapter
aux besoins spécifiques des utilisateurs.
 Fonctionnalités Manquantes : Certains systèmes ne proposent pas de fonctionnalités
avancées comme la gestion des périodes de formation avec des calendriers interactifs, ou
des outils de recherche pour trouver les sessions disponibles.

9|Page
 1.3 SPÉCIFICATION DES BESOINS

1) 1.3.1 INTRODUCTION

La spécification des besoins permet de définir ce que le système doit faire pour répondre aux
attentes des utilisateurs. Cette section décrit les besoins fonctionnels et non fonctionnels du
système d'inscription en ligne, en se basant sur les besoins des administrateurs, des formateurs et
des participants.
2) 1.3.2 SPECIFICATION DES BESOINS

A) 1.3.2.1 AUTEURS ET LEURS BESOINS

 Administrateur :
o Gestion des Sessions : L'administrateur doit pouvoir créer, modifier et supprimer
des sessions de formation, et consulter des rapports sur les inscriptions et la
participation.
o Gestion des Utilisateurs : L'administrateur doit pouvoir gérer les comptes des
formateurs et des participants, y compris l'ajout, la modification et la suppression
des utilisateurs.
o Paramétrage du Système : L'administrateur doit configurer les paramètres
généraux du système, comme les types de formation disponibles et les critères
d'inscription.
 Formateur :
o Gestion des Sessions : Les formateurs doivent pouvoir voir et mettre à jour les
détails des sessions auxquelles ils sont associés.
o Suivi des Participants : Les formateurs doivent pouvoir accéder aux informations
des participants inscrits à leurs sessions et suivre leur progression.
o Accès aux Rapports : Les formateurs doivent pouvoir générer des rapports sur
les performances des participants et les sessions de formation.
 Participant :
o Inscription aux Sessions : Les participants doivent pouvoir s'inscrire facilement
aux sessions de formation disponibles en utilisant un formulaire en ligne simple.
o Gestion de Profil : Les participants doivent pouvoir mettre à jour leurs
informations personnelles et consulter l'historique de leurs inscriptions.
o Consultation des Sessions : Les participants doivent pouvoir rechercher et filtrer
les sessions de formation selon différents critères (date, type de formation, etc.).

B) 1.3.2.2 BESOINS FONCTIONNELS

 Formulaire d'Inscription : Un formulaire en ligne pour s'inscrire aux sessions de

formation, incluant des champs pour les informations personnelles et un calendrier pour
choisir les dates de début et de fin.

10 | P a g e
 Gestion des Utilisateurs : Interfaces pour l'ajout, la modification, et la suppression des
utilisateurs (administrateurs, formateurs, participants).
 Tableau de Bord : Des tableaux de bord pour les administrateurs et formateurs,
permettant de visualiser les statistiques de participation, les rapports de sessions, et les
informations des utilisateurs.
 Notifications : Système de notifications par email pour informer les participants des
confirmations d'inscription, des rappels de sessions, et des mises à jour importantes.

11 | P a g e
Figure 1.1 :diagramme de cas d’utilisation Générale

Les diagrammes de cas d’utilisation :

Le diagramme de cas d'utilisation est un outil qui montre comment les utilisateurs interagissent
avec un système. Il aide à comprendre ce que chaque utilisateur, comme l'administrateur, le
formateur et le participant, peut faire dans le système.

Pour notre projet d'inscription en ligne aux formations, ce diagramme montre les principales
fonctions du système, comme :

 La gestion des sessions de formation.

 L'inscription des participants.
 La consultation des informations sur les formations.

En visualisant ces interactions, nous pouvons nous assurer que le système répondra bien aux
besoins de tous ses utilisateurs. Le diagramme de cas d'utilisation nous aide donc à planifier et à
organiser le développement du système de manière claire et efficace.

Figure 1.2 : diagramme de cas d’utilisation pour l’authentification

12 | P a g e
Voici un scénario simplifié pour un diagramme de cas d'utilisation d'authentification :

Action de l'acteur Réaction du système

1. Ouvrir la page de connexion Affiche le formulaire de connexion.

2. Saisir le nom d'utilisateur Enregistre le nom d'utilisateur.

3. Saisir le mot de passe Enregistre le mot de passe.

4. Cliquer sur "Se connecter" Valide les informations et authentifie l'utilisateur.

5. (Informations correctes) Redirige vers la page d'accueil.

6. (Informations incorrectes) Affiche un message d'erreur.

Figure 1.3: diagramme de cas d’utilisation pour l’admin :

Voici un tableau décrivant le scénario d'authentification pour le cas d'utilisation de gestion des
stagiaires, comme montré dans le diagramme :

13 | P a g e
 Action de l'acteur Réaction du système

1. Ouvrir la page de connexion Affiche le formulaire de connexion.

2. Saisir le nom d'utilisateur Enregistre le nom d'utilisateur.

3. Saisir le mot de passe Enregistre le mot de passe.

4. Cliquer sur "Se connecter" Valide les informations et authentifie l'utilisateur.

5. (Informations correctes) Redirige vers la page d'accueil ou le tableau de bord de l'administrateur.

Affiche un message d'erreur.

6. (Informations incorrectes)

(B) POUR LES AUTRES CAS D'UTILISATION IMPLIQUANT

L'AUTHENTIFICATION :

1. Gérer les cycles

o Action de l'acteur: Après authentification, l'administrateur navigue vers la
section "Gérer les cycles".
o Réaction du système: Affiche les options pour ajouter, modifier ou supprimer des
cycles de formation.
2. Ajouter formateurs
o Action de l'acteur: Après authentification, l'administrateur navigue vers la
section "Ajouter formateurs".
o Réaction du système: Affiche un formulaire pour ajouter les informations des
formateurs.
3. Ajouter participants
o Action de l'acteur: Après authentification, l'administrateur navigue vers la
section "Ajouter participants".
o Réaction du système: Affiche un formulaire pour ajouter les informations des
participants.

Figure 1.4: diagramme de cas d’utilisation pour participant :

14 | P a g e
Le scénario pour les cas d'utilisation "Enregistrer présence" et "Assigner notes" pour un
participant :

(C) ENREGISTRER PRÉSENCE

Action de l'acteur Réaction du système

1. Ouvrir la page de
Affiche le formulaire de connexion.
connexion

2. Saisir le nom d'utilisateur Enregistre le nom d'utilisateur.

3. Saisir le mot de passe Enregistre le mot de passe.

4. Cliquer sur "Se connecter" Valide les informations et authentifie l'utilisateur.

5. (Informations correctes) Redirige vers la page d'accueil ou tableau de bord.

6. Naviguer vers la section

Affiche le formulaire d'enregistrement de présence.
"Enregistrer présence"

7. Saisir les informations de

Enregistre les informations saisies.
présence

Enregistre la présence dans la base de données et affiche

8. Cliquer sur "Enregistrer"
un message de confirmation.

(D) ASSIGNER NOTES

15 | P a g e
 Action de l'acteur Réaction du système

1. Ouvrir la page de
Affiche le formulaire de connexion.
connexion

2. Saisir le nom d'utilisateur Enregistre le nom d'utilisateur.

3. Saisir le mot de passe Enregistre le mot de passe.

4. Cliquer sur "Se

Valide les informations et authentifie l'utilisateur.
connecter"

5. (Informations correctes) Redirige vers la page d'accueil ou tableau de bord.

6. Naviguer vers la section

Affiche le formulaire pour l'assignation des notes.
"Assigner notes"

7. Saisir les notes des

Enregistre les notes saisies.
participants

Enregistre les notes dans la base de données et affiche un

8. Cliquer sur "Enregistrer"
message de confirmation.

Figure 1.5 : diagramme de cas d’utilisation pour formateur :

Le scénario pour les cas d'utilisation "Consulter cycle", "Afficher participants", et "S'inscrire aux
cycles disponibles" pour un formateur :

(E) CONSULTER CYCLE

Action de l'acteur Réaction du système

1. Ouvrir la page de connexion Affiche le formulaire de connexion.

2. Saisir le nom d'utilisateur Enregistre le nom d'utilisateur.

16 | P a g e
 Action de l'acteur Réaction du système

3. Saisir le mot de passe Enregistre le mot de passe.

4. Cliquer sur "Se connecter" Valide les informations et authentifie l'utilisateur.

Redirige vers la page d'accueil ou tableau de

5. (Informations correctes)
bord.

6. Naviguer vers la section

Affiche la liste des cycles disponibles.
"Consulter cycle"

7. Sélectionner un cycle Affiche les détails du cycle sélectionné.

(F) AFFICHER PARTICIPANTS

Action de l'acteur Réaction du système

1. Ouvrir la page de connexion Affiche le formulaire de connexion.

2. Saisir le nom d'utilisateur Enregistre le nom d'utilisateur.

3. Saisir le mot de passe Enregistre le mot de passe.

Valide les informations et authentifie

4. Cliquer sur "Se connecter"
l'utilisateur.

Redirige vers la page d'accueil ou tableau de

5. (Informations correctes)
bord.

6. Naviguer vers la section "Afficher Affiche la liste des participants inscrits aux
participants" cycles.

7. Sélectionner un participant Affiche les détails du participant sélectionné.

(G) S'INSCRIRE AUX CYCLES DISPONIBLES

Action de l'acteur Réaction du système

1. Ouvrir la page de connexion Affiche le formulaire de connexion.

2. Saisir le nom d'utilisateur Enregistre le nom d'utilisateur.

17 | P a g e
 Action de l'acteur Réaction du système

3. Saisir le mot de passe Enregistre le mot de passe.

4. Cliquer sur "Se connecter" Valide les informations et authentifie l'utilisateur.

5. (Informations correctes) Redirige vers la page d'accueil ou tableau de bord.

6. Naviguer vers la section

Affiche la liste des cycles disponibles.
"S'inscrire aux cycles disponibles"

Enregistre l'inscription au cycle sélectionné et

7. Sélectionner un cycle
affiche un message de confirmation.

1) analyse de la vue dynamique :

Le diagramme de séquence est un outil UML (Unified Modeling Language) qui montre comment
les différents acteurs et objets d'un système interagissent au fil du temps. Il met en évidence

18 | P a g e
l'ordre des interactions et le flux de messages échangés pour accomplir une tâche spécifique. Ce
type de diagramme est essentiel pour visualiser et comprendre la dynamique des processus dans
un système.

1.6 Diagramme de séquence inscription :

1.7 Diagramme de séquence de modification:

19 | P a g e
1.8 Diagramme de séquence de suppression:

20 | P a g e
CHAPITRE II :

CONCEPTION

21 | P a g e
 La conception d'une base de données est une étape clé dans le développement d'un système
d'information. Elle implique la structuration des données afin de répondre aux besoins de
l'application tout en assurant l'efficacité, l'intégrité, et la sécurité des données. Voici les
principales étapes de la conception d'une base de données :

1. ANALYSE DES BESOINS

 Collecte des Exigences : Identifiez les besoins des utilisateurs et les exigences du
système. Quelles informations doivent être stockées! Comment seront-elles utilisées!
 Modèle Conceptuel : Créez un modèle conceptuel des données, généralement sous forme
de diagramme entité-association (ERD), pour représenter les entités (tables), les attributs
(champs), et les relations entre-elle.

2. MODÉLISATION DES DONNÉES

 Modèle Logique : Transformez le modèle conceptuel en un modèle logique en

définissant les tables, les colonnes, les types de données, et les clés primaires et
étrangères. Le modèle logique est indépendant du SGBD (Système de Gestion de Base de
Données).
 Modèle Physique : Adaptez le modèle logique pour le SGBD spécifique que vous
utilisez, en prenant en compte les particularités du système, telles que l'indexation, les
partitions, et les optimisations spécifiques.

3. CONCEPTION DES TABLES

 Définition des Tables : Créez des tables pour représenter les entités identifiées dans le
modèle conceptuel.
 Définition des Colonnes : Spécifiez les colonnes de chaque table, en définissant les types
de données appropriés (VARCHAR, INT, DATE, etc.).
 Clés Primaires : Définissez des clés primaires pour chaque table pour identifier de
manière unique chaque enregistrement.
 Clés Étrangères : Définissez des clés étrangères pour établir des relations entre les tables
et assurer l'intégrité référentielle.

4. NORMALISATION

 Objectifs de Normalisation : Réduire la redondance des données et améliorer l'intégrité

des données en structurant les tables selon les formes normales (1NF, 2NF, 3NF, etc.).
 Processus : Identifiez les dépendances fonctionnelles et refacturez les tables pour
éliminer les anomalies de mise à jour, d'insertion et de suppression.

5. OPTIMISATION

22 | P a g e
  Indexation : Créez des index sur les colonnes souvent utilisées dans les requêtes pour
améliorer les performances de recherche.
 Partitionnement : Divisez les grandes tables en partitions plus petites pour améliorer les
performances et la gestion des données.
 Dénormalisation : Dans certains cas, dénormaliser certaines parties de la base de
données peut améliorer les performances en réduisant le nombre de jointures nécessaires.

6. SÉCURITÉ DES DONNÉES

 Contrôles d'Accès : Définissez des rôles et des permissions pour contrôler l'accès aux
données sensibles et assurer la sécurité.
 Sauvegardes : Mettre en place des stratégies de sauvegarde régulières pour protéger les
données contre la perte ou la corruption.
 Audits : Configurez des mécanismes d'audit pour suivre les accès et les modifications des
données.

7. VALIDATION ET TESTS

 Vérification : Assurez-vous que la conception répond aux exigences fonctionnelles et

non fonctionnelles.
 Tests : Testez la base de données avec des scénarios réalistes pour vérifier la
performance, l'intégrité, et la sécurité.

8. DOCUMENTATION

 Documentation Technique : Documentez la structure de la base de données, les

relations, les contraintes, et les procédures de gestion.
 Guide Utilisateur : Créez des guides pour les utilisateurs finaux et les administrateurs de
base de données pour faciliter l'utilisation et la maintenance.

La conception d'une base de données est un processus critique qui affecte la performance et la
fiabilité du système d'information. Une bonne conception nécessite une compréhension
approfondie des besoins et une attention aux détails tout au long du processus.

1.9 figure le modelé conceptuel de données:

23 | P a g e
1 DIAGRAMME DE CLASSE :

Un diagramme de classe est un outil qui illustre la structure d'un système logiciel en montrant les
classes, leurs attributs et méthodes, ainsi que leurs relations.

(I) ÉLÉMENTS CLÉS

 Classe :
o Nom : Identifie la classe (ex. : Utilisateur).
o Attributs : Caractéristiques ou propriétés de la classe (ex. : nom, email).
o Méthodes : Fonctions ou opérations que la classe peut réaliser (ex. : seConnecter
(), s'inscrire()).
 Relations :
o Association : Lien entre les classes (ex. : un Utilisateur ayant plusieurs
Commandes).
o Héritage : Relation où une classe dérive d'une autre (ex. : Admin dérivant de
Utilisateur).

24 | P a g e
 o Composition : Une classe contient d'autres classes de manière forte (ex. : un
Panier contenant des Articles).

OBJECTIFS DU DIAGRAMME DE CLASSE

 Planification : Organise et planifie la structure du code avant la programmation.

 Clarté : Facilite la compréhension de la structure du système.
 Documentation : Sert de référence pour le développement et la maintenance du logiciel.

Figure 1.10: diagramme de classe

25 | P a g e
Chapitre III

REALISATION

26 | P a g e
 1) INTRODUCTION

Ce rapport détaille les étapes de la réalisation d'un système de gestion de cycles de formation
développé durant mon stage au Centre National d'Informatique (CNI). Le projet avait pour
objectif de concevoir et de mettre en œuvre un système en ligne permettant la gestion efficace
des cycles de formation, incluant les inscriptions des participants et la gestion des formations par
les administrateurs et formateurs.

ENVIRONNEMENT MATÉRIEL

SERVEUR :

- Processeur : Intel Xeon E5-2620 v4

- Mémoires: 64 GB DDR4

- Stockage: 2 TB SSD

- Connexion Internet : Fibre optique 1 Gbps

STATIONS DE TRAVAIL :

- Processeur : Intel Core i7-9700K

- Mémoire : 32 GB DDR4

- Stockage : 512 GB SSD

- Écrans : Double écran 24 pouces

ENVIRONNEMENT LOGICIEL

SYSTÈME D'EXPLOITATION :

- Serveur : Ubuntu Server 20.04 LTS

- Stations de travail : Windows 10

LOGICIELS ET FRAMEWORKS :

- Serveur web : Apache 2.4

27 | P a g e
 - Langage de programmation : PHP 7.4

- Base de données : MySQL 8.0

- Outils de développement : Visual Studio Code, PHPMyAdmin

- Bibliothèques front-end : HTML5, CSS3, JavaScript

- Framework CSS : Bootstrap 4

CHOIX DES TECHNOLOGIES DE DÉVELOPPEMENT

PHP ET MYSQL : PHP a été choisi pour sa simplicité et sa forte intégration avec MySQL,
facilitant ainsi la gestion des bases de données. MySQL a été sélectionné pour sa robustesse et sa
capacité à gérer un grand nombre de requêtes simultanées.

HTML5, CSS3, ET JAVASCRIPT : Ces technologies ont été utilisées pour créer une interface
utilisateur réactive et interactive, offrant une expérience utilisateur optimale.

BOOTSTRAP :Le framework CSS Bootstrap a été utilisé pour accélérer le développement de
l'interface utilisateur, en fournissant des composants pré-construits et un système de grille
flexible.

OUTILS DE DÉVELOPPEMENT

VISUAL STUDIO CODE :Cet éditeur de code a été choisi pour sa légèreté, ses nombreuses
extensions et son intégration facile avec les systèmes de contrôle de version comme Git.

PHP MYADMIN : Cet outil a été utilisé pour la gestion de la base de données MySQL, offrant
une interface graphique conviviale pour la création et la gestion des tables et des requêtes SQL.

STARUML : Utilisé pour la création des diagrammes UML, facilitant la modélisation des
différentes fonctionnalités et l'architecture du système.

28 | P a g e
ÉTAPES DE DÉVELOPPEMENT DE L'APPLICATION WEB

1. ANALYSE DES BESOINS : Identification des besoins fonctionnels et non fonctionnels du

système.

2. MODÉLISATION UML : Création des diagrammes de cas d'utilisation, de classes, de

séquences et d'activités pour représenter les différents aspects du système.

3. CONCEPTION DE LA BASE DE DONNÉES : Définition du schéma de la base de données

MySQL, incluant les tables, les relations et les contraintes.

4. DÉVELOPPEMENT DU BACK-END : Implémentation des scripts PHP pour gérer les

opérations côté serveur, y compris la gestion des utilisateurs, des formations et des inscriptions.

5. DÉVELOPPEMENT DU FRONT-END : Création des pages HTML/CSS pour l'interface

utilisateur, intégration de JavaScript pour les interactions dynamiques.

6. TESTS ET DÉBOGAGE : Réalisation de tests unitaires et fonctionnels pour identifier et

corriger les erreurs.

7. DÉPLOIEMENT : Mise en ligne du système sur le serveur de production et configuration du

domaine et des certificats SSL.

INTERFACES DE L'APPLICATION

Les interfaces de l'application incluent les pages suivantes :

1. PAGE D'ACCUEIL : Présente les informations générales sur les cycles de

formation disponibles.
Figure 1.11: page d’accueil

29 | P a g e
PAGE D'INSCRIPTION : Permet aux participants de s'inscrire aux formations en fournissant
leurs informations personnelles.

Figure 1.12 : page d’inscription

30 | P a g e
PAGE DE CONNEXION : Permet aux utilisateurs de se connecter pour accéder à leur espace
personnel.

Figure 1.13: page connexion

31 | P a g e
 4. TABLEAU DE BORD DE L'ADMINISTRATEUR : Interface pour gérer les cycles de
formation, les utilisateurs et les inscriptions.

Figure 1.14 : tableau de bord de l’administrateur

5. TABLEAU DE BORD DU FORMATEUR : Interface pour consulter et gérer les

formations attribuées.

Figure 1.15 : tableau de bord du formateur

Ces interfaces ont été conçues pour être intuitives et faciles à utiliser, garantissant une expérience
utilisateur fluide et efficace.

32 | P a g e
 Conclusion
Mon stage au Centre National d'Informatique (CNI) a été une expérience enrichissante et
formative. Travaillant sur le développement d'un système de gestion des cycles de formation en
ligne, j'ai eu l'opportunité de mettre en pratique et d'élargir mes compétences en développement
web, gestion de bases de données et conception de systèmes.

Au cours de ce stage, j'ai conçu et mis en œuvre un système complet intégrant des fonctionnalités
telles que l'inscription des participants, la gestion des formations et le suivi des inscriptions. La
réalisation des UML diagrammes, l'utilisation de PHP pour le backend et de MySQL pour la
gestion des données ont été des aspects clés du projet. J'ai également travaillé avec phpMyAdmin
pour administrer les bases de données, ce qui a renforcé mes compétences en gestion de bases de
données relationnelles.

Le projet m'a permis de développer une compréhension approfondie des processus de gestion des
formations et de créer des interfaces utilisateur intuitives pour différents types d'utilisateurs, tels
que les administrateurs et les formateurs. La conception des interfaces a été axée sur la simplicité
et l'efficacité, visant à offrir une expérience utilisateur fluide et agréable.

Ce stage m'a non seulement permis d'acquérir une expérience pratique précieuse, mais aussi
d'approfondir ma connaissance des technologies web et de la gestion de projets informatiques.
Les compétences et les connaissances acquises seront un atout précieux dans ma future carrière
professionnelle.

Je tiens à remercier mon superviseur, MOHAMED ALI SAADAOUI , ainsi que toute l'équipe du
CNI pour leur soutien et leur encadrement tout au long de cette période. Cette expérience a été
extrêmement bénéfique pour mon développement professionnel et personnel.

33 | P a g e
 Bibliographie
1. Livres :
o Welling, Luke, et Laura Thomson. PHP and MySQL Web Development. Addison-
Wesley, 2016.
 Un guide complet sur le développement avec PHP et MySQL, couvrant les
aspects fondamentaux ainsi que des techniques avancées.
o Robbins, Jennifer. Learning Web Design: A Beginner's Guide to HTML, CSS,
JavaScript, and Web Graphics. O'Reilly Media, 2022.
 Ce livre offre une introduction approfondie à la conception web, incluant
HTML, CSS, JavaScript, et les graphiques web.
2. Sites Web :
o W3Schools. W3Schools Online Web Tutorials. https://www.w3schools.com.
 Une plateforme d'apprentissage en ligne qui fournit des tutoriels et des
références sur HTML, CSS, JavaScript, PHP, et plus encore.
o Stack Overflow. Stack Overflow Community. https://stackoverflow.com.
 Une communauté de développeurs où vous pouvez poser des questions,
trouver des réponses et discuter de divers problèmes techniques.
o phpMyAdmin. Documentation phpMyAdmin. https://www.phpmyadmin.net/docs/
o
 La documentation officielle de phpMyAdmin, utile pour comprendre
l'administration des bases de données et la gestion des tables.

34 | P a g e