20-- / 20--

Stage d’été immersion en entreprise

Plateforme d'éducation en ligne

Réalisé par : Mohamed Chedli Khangui

Encadrant Entreprise : Youssef Naoui

 Remerciements

C’est avec plaisir qu’on réserve ces quelques lignes en signe de gratitude et
de profonde reconnaissance à tous ceux qui, de près ou de loin, ont contribué à
l’aboutissement de ce travail.

Je tiens à exprimer mes vifs remerciements et ma profonde gratitude à Mr

Youssef Naoui, Maître de stage et encadrant dans l’entreprise accueillante, qui
s'est toujours montré à l'écoute malgré ses charges professionnelles.

Je n'oublie pas non plus tout le personnel de NowWeProg qui m'ont

toujours soutenu avec beaucoup de gentillesse dans la réalisation de ce projet,
on nomme particulièrement Mr Oussema Bribech pour son support et son
écoute.
 Table des matières
Introduction .................................................................................................................................... 6

Chapitre 1 : Contexte du travail....................................................................................................... 7

Introduction .................................................................................................................................... 8

1. Présentation de l’entreprise d’accueil ..................................................................................... 8

2. Problématique ......................................................................................................................... 8

3. Étude de l’existant ................................................................................................................... 9

3.1 Description ...................................................................................................................... 9

3.1.1 Rosetta Stone............................................................................................................... 9

3.1.2 Preply ......................................................................................................................... 10

3.1.3 Taki Academy ............................................................................................................. 10

3.2 Forces et faiblesses ........................................................................................................ 11

4 Solution proposée ................................................................................................................. 11

5 Choix de la méthodologie...................................................................................................... 12

Conclusion ..................................................................................................................................... 12

Chapitre 2 : Analyse préliminaire .................................................................................................. 13

Introduction .................................................................................................................................. 14

1. Spécification des besoins....................................................................................................... 14

1.1 Identification des acteurs .............................................................................................. 14

1.2 Besoins fonctionnels...................................................................................................... 14

1.3 Besoins non fonctionnels .............................................................................................. 15

1.3.1 Diagramme de cas d’utilisation général ................................................................ 15

1.3.2 Diagramme de classes général .............................................................................. 15

2. Environnement de travail ...................................................................................................... 16

2.1 Environnement matériel................................................................................................ 16

2.2 Environnement logiciel .................................................................................................. 16

 2.2.1 Outils utilisés ......................................................................................................... 16

2.2.2 Technologies utilisées ............................................................................................ 17

Chapitre 3 : Déroulement de sprint .............................................................................................. 18

Introduction .................................................................................................................................. 19

1. Backlog Sprint ........................................................................................................................ 19

2. Conception ............................................................................................................................ 20

2.1. Diagramme de cas d’utilisation ..................................................................................... 20

2.2. Diagrammes de séquence ............................................................................................. 20

2.2.1. Diagramme de séquence pour Inscription ............................................................ 20

2.2.2. Diagramme de séquence pour Authentification ................................................... 21

3. Réalisation ............................................................................................................................. 22

3.1. Inscription ...................................................................................................................... 22

3.2. Authentification ............................................................................................................. 22

3.3. Gestion des utilisateurs ................................................................................................. 23

Conclusion ..................................................................................................................................... 24

Conclusion générale ...................................................................................................................... 25

 Liste des figures
Figure 1: Logo de l'entreprise.......................................................................................................... 8

Figure 2: interface Rosetta Stone .................................................................................................... 9

Figure 3:Interface Perply ............................................................................................................... 10

Figure 4:Interface Taki Academy ................................................................................................... 10

Figure 5:Scrum .............................................................................................................................. 12

Figure 6:Diagramme de cas d'utilisation ....................................................................................... 15

Figure 7:Diagramme de classe ...................................................................................................... 15

Figure 8: logo visual studio ............................................................................................................ 16

Figure 9:logo StarUml.................................................................................................................... 16

Figure 10: Logo SSMS .................................................................................................................... 17

Figure 11: Logo ASP.NET ................................................................................................................ 17

Figure 12: Logo SQL Server............................................................................................................ 17

Figure 13: Logo Bootstrap ............................................................................................................. 17

Figure 14:Diagramme de cas d'utilisation gestion user ................................................................ 20

Figure 15:Diagramme de séquence ajouter utilisateur................................................................. 21

Figure 16:diagramme de séquence authentification .................................................................... 21

Figure 17: interface inscription ..................................................................................................... 22

Figure 18:interface de connexion.................................................................................................. 23

Figure 19:interface ajouter utilisateur .......................................................................................... 23

Figure 20:interface liste utilisateur ............................................................................................... 24

Liste des tableaux

Tableau 1:les forces et les faiblesses des plateformes .................................................................. 11

Tableau 2: Caractéristique ordinateur ........................................................................................... 16

Tableau 3:Backlog Sprint1 ............................................................................................................. 19

 Introduction
Dans le monde de la numérisation, la plupart des entreprises s’intéressent de plus en plus
à la possession d’une application Web sur laquelle elles peuvent promouvoir leurs activités et
leurs services afin d’attirer plus de clients et de maximiser leur cible.

Il existe de nombreuses catégories d’applications web qui peuvent être mises en place :
application web e-commerce, application web vitrine, réseaux sociaux, forums, application
web e-learning... Le public virtuel est devenu plus grand et plus large, en tenant compte du
fait que la demande sur les ingénieurs développeurs est en croissance.

Afin de faire face aux nouvelles technologies et innovations à venir, ESPRIT s’assure,
pendant la période estivale, d’intégrer ses étudiants dans le monde professionnel réel.

En fait, c’est en effet l’une des opportunités les plus appropriées pour un étudiant
ingénieur de faire face aux difficultés de la vie professionnelle. Nous avons été amenés à
effectuer un stage, du 01 juillet 2023 au 15 août 2023, au sein de NowWeProg

Ce rapport contient dans la première partie un chapitre introductif, présentant

l’organisation hôte. Le deuxième chapitre « analyse des besoins », qui présente les détails du
projet. Troisièmement, la conception et enfin la réalisation du projet.

6
Chapitre 1 : Contexte du travail

7
 Introduction

Dans ce premier chapitre, nous présentons l’entreprise d’accueil « NowWeProg ». Par

la suite, nous décrivons la problématique. Puis, on va présenter une étude de l’existant et la
solution proposée. Enfin, nous présentons la méthodologie de conception choisie pour la
réalisation et le développement de notre solution.

1. Présentation de l’entreprise d’accueil

L’entreprise NowWeProg, fondée en 2017 et situé à Tunis, est une petite entreprise de
services informatiques, d’ingénierie et de développement web et mobile qui associe bien le
savoir-faire technique et fonctionnel pour répondre aux besoins de ses clients.

NowWeProg offre plusieurs services :

• Conception et développement de solutions informatiques web et mobile.

• La gestion de projets et le suivi de leur exécution pour le compte de leurs partenaires.

• Support technique, Suivi, Assistance.

La figure 1 montre le logo de l’entreprise.

Figure 1: Logo de l'entreprise

2. Problématique

Aujourd'hui, lors du processus de recrutement, l'une des compétences les plus

recherchées sur le marché du travail est la maîtrise de la langue.

8
 Cependant, les nouvellement diplômés Tunisiens se retrouvent sous-performant à ce
niveau et ont besoin d'une formation complémentaire, en particulier en anglais, la langue la
plus utilisée dans le monde.

Cela est dû, d'une part, au fait que l'Anglais est la troisième langue à apprendre en Tunisie
les étudiants ont moins d'heures de formation que d’autres langues. D'autre part, l’Anglais est
enseigné sans lien et sans intégration dans le reste du cursus. Il faut donc un outil qui offre une
formation complémentaire en anglais pour tous les niveaux, scolaires, académiques,
professionnels ou autres, et qui prend en considération les capacités techniques et financières
de l’apprenant Tunisien aujourd’hui.

3. Étude de l’existant

Une étude de l’existant est essentielle car elle fournit une base de référence pour la suite
du projet comme elle sert à approfondir l’analyse des dimensions innovantes de notre travail.

3.1 Description

3.1.1 Rosetta Stone

Rosetta Stone est une gamme de logiciels d'apprentissage des langues étrangères.

La figure 2 montre l’interface de Rosetta Stone.

Figure 2: interface Rosetta Stone

9
 3.1.2 Preply

Preply est une plateforme d’apprentissage de langues en ligne. Le produit de Preply est
basé sur un tutorat humain individuel. Avec Preply l’utilisateur trouve un tuteur natif d’une
langue étrangère pour des séances personnelles.

La figure 3 montre l’interface de preply.

Figure 3:Interface Perply

3.1.3 Taki Academy

Taki Academy est une plateforme Tunisienne d’enseignement en ligne qui offre tous les
cours, y compris l’anglais, de la 4éme primaire jusqu’au bac suivant le programme d’étude
Tunisien officiel.

La figure 4 montre l’interface de Taki Academy.

Figure 4:Interface Taki Academy

10
 3.2 Forces et faiblesses

La tableau 1 présente les forces et les faiblesses des plateformes Rosetta Stone, Preply et
Taki Academy.

Plateforme Forces Faiblesses

• 25 langues disponibles • Prix chers pour plupart des Tunisiens.

Rosetta Stone • Interactif • Contenu répétitif

• Vocabulaire large • Options de paiement limités aux

tunisiens.

Preply •Grand nombre de tuteurs • Prix chers pour tunisiens (par heure)

•Formation personnalisée • Options de paiement limités

•Interaction tuteur/apprenant • Qualité de formation dépend de

tuteur

Taki • Tuteurs Tunisiens • Limité au programme d’étude officiel

Academy • Conforme à la pédagogie de la (limité de 4éme jusqu’au bac).
Tunisie. •Cours d’Anglais sont marginalisés vue
leur coefficient dans le cursus Tunisien
• Cours simplifiés
• Cours et ressources limités en
• Facile à utiliser.
Anglais.

• Absence de Pack pour langues.

Tableau 1:les forces et les faiblesses des plateformes

4 Solution proposée

Après avoir étudié l’existant, nous proposons au sein de la société de développer une
application web pour l’éducation en ligne « MAKTABTI.TN » qui permet la gestion des cours,
des tests et des ressources pédagogiques.

Cette application doit favoriser la clarté et la simplicité afin d'offrir à ses utilisateurs ciblés,
qui vont des élèves du primaire aux étudiants universitaires et autres apprenants, une
expérience d'apprentissage intéressante pour tous.

11
5 Choix de la méthodologie

Afin de bien gérer notre projet et assurer le bon déroulement des différentes phases,
Nous avons choisi Scrum comme méthode de gestion de notre projet.

Scrum a été choisi en fonction de ses points forts. Résumé comme suit :

• Flexibilité au changement : on peut modifier ou ajouter des fonctionnalités selon le

besoin.

• Scrum permet la réalisation du projet par une équipe focalisée, responsabilisée et

engagée qui s’appuie sur les règles de la démarche pour collaborer.

• La grande capacité d’adaptation au changement grâce à des itérations courtes.

Figure 5:Scrum

Conclusion

Dans ce chapitre, nous avons présenté l’organisme d’accueil NowWeProg et nous avons
décrit la problématique ainsi qu’une étude de l’existant. Puis, nous avons proposé une
solution. Et finalement, nous avons défini le langage de modélisation utilisé. Alors, le chapitre
qui suit va être consacré à l’analyse préliminaire.

12
Chapitre 2 : Analyse préliminaire

13
 Introduction

Dans ce chapitre, nous commençons par l’identification des besoins fonctionnels et non
fonctionnels. Ensuite, nous présentons l’environnement de travail matériel et logiciel ainsi que
les technologies utilisées. Finalement, nous fournissons l’architecture de la solution.

1. Spécification des besoins

Dans cette partie, nous déterminons, d’abord, les acteurs les plus pertinents. Ensuite,
nous présentons les besoins des utilisateurs. Enfin, nous montrons les diagrammes.

1.1 Identification des acteurs

Les acteurs sont les entités externes qui interagissent avec le système.

Nos acteurs sont :

• Administrateur : le superviseur de la plateforme. Il possède tous les droits du

système. Il ajoute, affiche, modifie et supprime le contenu et les outils d’apprentissage.
• Apprenant : la personne qui a comme intérêt d’acquérir des connaissances

1.2 Besoins fonctionnels

Un besoin fonctionnel définit les fonctions du système à développer, c’est-à-dire ce

que le système doit être capable de faire.
Acteur Besoins
- Authentification
Administrateur
- Consultation de tableau de bord
- Gestion des utilisateurs
- Gestion des offres
- Gestion des rôles
- Gestion des ressources
- Gestion des cours
- Gestion des tests
- Inscription
Apprenant
- Authentification
- Tableau de bord
- Gestion de profil
- Consultation ressources
- Consultation cours
- Prise de test/ réception note

14
 1.3 Besoins non fonctionnels

1.3.1 Diagramme de cas d’utilisation général

Le diagramme de cas d'utilisation modélise le comportement d'un système et

permettent de capturer les exigences du système. Il décrit les fonctions générales et la
portée d'un système.
La figure montre le diagramme de cas d’utilisation général.

Figure 6:Diagramme de cas d'utilisation

1.3.2 Diagramme de classes général

Les diagrammes de classes sont fondamentaux pour le processus de modélisation des

objets et modélisent la structure statique d'un système.
La figure montre le diagramme de classes général.

15

Figure 7:Diagramme de classe

 2. Environnement de travail

Dans cette section, nous allons présenter l’environnement matériel de notre projet et
notre environnement logiciel adopté durant l’implémentation.

2.1 Environnement matériel

Pour réaliser notre application, nous avons disposé d’un ordinateur caractérisé par :

Machine Ordinateur portable

Marque HP 15-DW3015NK
Processeur 11th Gen Intel(R) Core(TM) i5-1135G7
Fréquence 2.40GHz à 4.2 GHz
RAM 8 GO
ROM 256 GO (SSD)
Tableau 2: Caractéristique ordinateur

2.2 Environnement logiciel

Dans cette partie nous décrivons les outils et les technologies pour la mise en place de
l'application.

2.2.1 Outils utilisés

Visual studio

Visual Studio est un outil de développement permettant de

générer des applications Web ASP.NET, des Services Web XML,
des applications bureautiques et des applications mobiles (2).
Figure 8: logo visual studio

StarUML

StarUML est un logiciel de modélisation UML (Unified Modeling

Language) open source.
Figure 9:logo StarUml

16
 SQL Server Management Studio

SQL Server Management Studio (SSMS) est un logiciel

pour la gestion des infrastructures SQL. Utilisez SSMS pour
configurer, gérer, accéder, administrer et développer tous
les composants de SQL Server, Azure SQL Database, Azure
SQL Managed Instance, et Azure Synapse Analytics. (4)
Figure 10: Logo SSMS

2.2.2 Technologies utilisées

Framework ASP.NET (CORE MVC)

ASP.NET, l’évolution d’ASP, est une

Figure 11: Logo ASP.NET
technologie apparue en 2002 permettant de
développer des applications web basées sur les
standards HTML, CSS et JavaScript avec trois
approches différentes. Dans notre cas on a utilisé
ASP.NET MVC. (5)

SQL Server

Concrètement, un SQL server est un outil qui possède toutes

les caractéristiques pour pouvoir accompagner l'utilisateur dans
le contrôle, la manipulation, la mise à jour, le tri, et bien d'autres
actions encore, de bases de données grâce au langage SQL.

Figure 12: Logo SQL Server

Bootstrap 5.0

Bootstrap est une collection d'outils utile à la création

d'applications web et de sites. Il facilite surtout la réalisation des
sites web responsives et modernes. C'est un ensemble des codes
HTML, CSS, JS, des boutons, formulaires.
Figure 13: Logo Bootstrap

17
Chapitre 3 : Déroulement de sprint

18
 Introduction

Dans ce chapitre, nous présentons le déroulement de Sprint 1 en illustrant le Backlog

du sprint, la conception avec des diagrammes UML et la réalisation.

1. Backlog Sprint

Ce sprint se concentre sur l’administration de l’application. Nous parlons des

fonctionnalités de base de l’application tels que l’inscription, l’authentification et la gestion des
utilisateurs

Le tableau présente le backlog de Sprint 1

ID User Story Estimation/jours Priorité

T1 Formation avec la technologie 5 Élevé

ASP.NET (Core MVC)
T2 Familiarisation avec la base de 5 Élevé
données SQL SERVER et l’outil
SSMS
T3 Développement de contrôleur 3 Élevé
authentification et faire la liaison
entre l’application et la base de
données
T4 Développement de contrôleur 7 Élevé
CRUD des utilisateurs et la création
de table “USER”
T5 Création des interfaces 8 Élevé
authentification (utilisateur et
administrateur), menu
administrateur.
Mettre l’autorisation d’accès aux
interfaces
Création de l’interface gestion des
utilisateurs
T6 Test 2 Élevé
Tableau 3:Backlog Sprint1

19
2. Conception

La conception est la première activité dans notre sprint. Elle se traduit par le
diagramme de séquence et le diagramme de cas d’utilisation.

2.1. Diagramme de cas d’utilisation

La figure 14 présente le diagramme de cas d’utilisation de Sprint 1.

Figure 14:Diagramme de cas d'utilisation gestion user

2.2. Diagrammes de séquence

Nous passons aux diagrammes de séquence pour le Sprint 1.

2.2.1. Diagramme de séquence pour Inscription

Dans la figure se présente le diagramme de séquence pour la fonctionnalité Inscription

dans le Sprint 1.

20
 Figure 15:Diagramme de séquence ajouter utilisateur

2.2.2. Diagramme de séquence pour Authentification

La figure 16 montre le diagramme de séquence pour la fonctionnalité Authentification

dans le Sprint 1.

Figure 16:diagramme de séquence authentification

21
3. Réalisation

Maintenant, nous montrons les interfaces de Sprint 1.

3.1. Inscription

Un simple utilisateur peut s’inscrire. Pour cela, il doit remplir :

• son nom complet

• son adresse email
• son mot de passe

La figure 17 nous illustre la page d’inscription.

Figure 17: interface inscription

3.2. Authentification

Après avoir fait l’inscription avec succès, l’utilisateur peut se connecter à son compte
auprès de cette interface. Il doit remplir correctement :

• son adresse email

• son mot de passe

22
 Cela est illustré dans la figure 18.

Figure 18:interface de connexion

3.3. Gestion des utilisateurs

L’administrateur, après avoir authentifié, peut ajouter des nouveaux utilisateurs dans
l’interface d’ajout utilisateurs en remplissant les informations de l’utilisateur comme le montre
la figure 19.

Figure 19:interface ajouter utilisateur

L’administrateur peut aussi voir la liste des utilisateurs en accédant à l’interface d’affichage
des utilisateurs. Dans cette interface il peut aussi activer ou désactiver les inscriptions des
utilisateurs ou bien supprimer leurs comptes.

23
 La figure 20 montre l’interface d’affichage utilisatrues.

Figure 20:interface liste utilisateur

Conclusion

Dans ce chapitre, nous avons présenté le déroulement de sprint 1 de notre projet.

Le chapitre a été divisé en 2 parties, nous avons élaboré le backlog produit du sprint. Puis,
nous avons illustré la conception avec des diagrammes de cas d’utilisation et des diagrammes
de séquence pour des opérations différents. Enfin, nous avons présenté les interfaces dans
chaque sprint.

24
 Conclusion générale
Au terme de ce rapport, nous pouvons conclure que ce Stage d’été immersion en
entreprise nous a donné une occasion favorable qui nous a permis de confronter l’acquis
théorique à l’environnement pratique. Dans ce cadre. Le présent manuscrit détaille toutes les
étapes par lesquelles nous sommes passées pour arriver au résultat attendu. Nous avons
essayé tout au long de notre travail de construire une partie de l’application incrément par
incrément en utilisant la méthodologie Scrum.

Nous avons commencé dans un premier lieu par le cadre général du projet qui présente
la société et l’objectif de projet. Après nous avons fait l’étude préalable pour mieux
comprendre et étudier l’existant. Nous avons préparé par la suite notre planning de travail en
respectant les priorités de nos besoins à la suite d’une discussion entre le Scrum master
(l’encadrant) et le Product Owner (le chef de projet).

Au cours de l’analyses préliminaires, nous avons posé des questions d’ordre technique
destinées à explorer les besoins de l’utilisateur afin de dégager les cas d’utilisations permettant
de modéliser les interactions entre le système à développer et notre utilisateur. La phase
conception est celle que nous pouvons juger la plus importante puisque c’est à son niveau que
nous commençons à voir la forme réelle de l’application.

Finalement, nous avons clôturé le travail de conception par la phase de réalisation visant
à observer l’application dans son environnement en faisant les dernières modifications et
corrections nécessaires. Il ne faudrait pas oublier de rappeler qu’à un certain stade nous avons
commencé à travailler la conception et l’implémentation en parallèle c'est-à-dire nous nous
sommes approfondis dans la conception d’une part et l’implémentation d’autre part.

La solution que nous avons proposée est une première version qui peut subir des
améliorations évolutives. Notre application reste évolutive et extensive. Elle va subir des
améliorations qui concernent l’ajout d’autres fonctionnalités.

25
 Bibliographie

1] [En ligne]. Available: https://hubvisory.com/blog/les-differents-roles-d-une-equipe-

produit-sous-scrum/.

2] [En ligne]. Available: https://hubvisory.com/blog/les-differents-roles-d-une-equipe-

produit-sous-scrum/.

3] [En ligne]. Available: https://www.lucidchart.com/pages/fr/langage-uml/.

4] [En ligne]. Available: https://www.ibm.com/docs/fr/rational-soft-

arch/9.5?topic=diagrams-use-case/.

5] [En ligne]. Available: https://www.ibm.com/docs/fr/rsar/9.5?topic=diagrams-class.

6] [En ligne]. Available:

https://inf1410.teluq.ca/teluqDownload.php?file=2014/01/INF1410-
PresentationStarUML.pdf.

7] [En ligne]. Available: https ://www.postman.com/.

8] [En ligne]. Available: https ://framalibre.org/content/visual-studio-code.

9] [En ligne]. Available: https://www.oracle.com/fr/database/definition-postgresql.html.

10] [En ligne]. Available: https://www.journaldunet.com/web-tech/developpeur/1159810-

bootstrapdefinition-.

11] [En ligne]. Available: https

://www.tutorialspoint.com/angular2/angular2_overview.htm.

12] [En ligne]. Available: https://spring.io.

26
13] [En ligne]. Available: https://www.lemagit.fr/definition/GitHub.

14] [En ligne]. Available: https://developer.mozilla.org/fr/docs/Glossary/MVC.

27
28