Rapport PFA [PDF]

Zitiervorschau

République Tunisienne Ministère de l’Enseignement Supérieur et de la Recherche Scientifique Université de Carthage Institut Supérieur des Technologies de l’Information et de la Communication

Rapport de Projet de Fin d’année Présenté en vue de l’obtention de la

Licence en Ingénierie des systèmes informatiques Spécialité : IOT et Systèmes Embarqués

Site Web E-Poubelle

Par Wafa BEN MILOUD Réalisé au sein de l’Association Tunisienne de Géomatique « ATG »

Encadrant Professionel : Mr Mohammed Chebil

Période De Stage : 15/06/2021 - 15/07/2021

Année Universitaire : 2020 - 2021

Dédicaces A mes chères parents , Nulle dédicace n’est susceptible de vous exprimer mes profonds affections et mes immenses gratitudes pour les efforts que vous avez fait pour mon éducation ,pour le soutien et les encouragements que vous m’avez prodigués tout au long de mon chemin.

Wafa Ben Miloud

i

Remerciement Au terme de ce projet de fin d’année , je tiens à exprimer mes sincères remerciments au personnel de ATG et de l’Enit , le président Mr. Noamen REBAI qui ont contribué à l’élaboration de ce rapport modeste. Ainsi J’exprime mon profond respect à Mr. Mohammed CHEBIL , mon superviseur, pour son assistance, ses directives et ses conseils précieux.

ii

Table des matières Introduction générale

1

1 Contexte du projet 0.1 Introduction . . . . . . . . . . . . . . 0.2 Présentation de l’organisme d’accueil 0.2.1 Organisme d’accueil : . . . . 0.2.2 Adresse et coordonnées . . . . 0.2.3 Domaines d’activités . . . . . 0.3 Présentation du projet . . . . . . . . 0.3.1 Cadre de projet . . . . . . . . 0.3.2 Problématique . . . . . . . . . 0.3.3 Solution proposée . . . . . . . 0.4 Conclusion . . . . . . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

. . . . . . . . . .

2 2 2 2 2 3 3 3 3 3 3

2 Analyse des besoins 2.1 Identification des acteurs . . . . . . . . . . . . . . . . . 2.2 Besoins fonctionnels . . . . . . . . . . . . . . . . . . . . 2.2.1 Besoins fonctionnels associés au citoyen . . . . . 2.2.2 Besoins fonctionnels associés au administrateur 2.2.3 Diagramme de cas d’utilisation global . . . . . . 2.3 Besoins non fonctionnels . . . . . . . . . . . . . . . . . 2.4 Conclusion . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

4 4 4 4 5 8 9 9

3 Etude Conceptuelle 3.1 Introduction . . . . . . . . . . . . . . . . . . . . . 3.2 Diagramme de classes . . . . . . . . . . . . . . . . 3.3 Diagramme de séquences du système . . . . . . . 3.3.1 Diagramme de séquence "Inscription" . . . 3.3.2 Diagramme de séquence "Authentification" 3.4 Conclusion . . . . . . . . . . . . . . . . . . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

10 10 10 11 11 11 12

4 Réalisation 4.1 Introduction . . . . . . . . . . . 4.2 Environnement de travail . . . . 4.2.1 Environnement matériel 4.2.2 Environnement logiciel . 4.3 Technologies utilisées : . . . . . 4.3.1 HTML5 : . . . . . . . . 4.3.2 CSS3 : . . . . . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

. . . . . . .

13 13 13 13 13 14 14 14

. . . . . . .

. . . . . . . iii

. . . . . . .

. . . . . . . . . .

. . . . . . .

. . . . . . . . . .

. . . . . . .

. . . . . . . . . .

. . . . . . .

. . . . . . . . . .

. . . . . . .

. . . . . . . . . .

. . . . . . .

. . . . . . . . . .

. . . . . . .

. . . . . . . . . .

. . . . . . .

. . . . . . . . . .

. . . . . . . . . .

Table des matières

4.4

4.3.3 Bootstrap4 : . 4.3.4 JavaScript : . 4.3.5 Python : . . . 4.3.6 PostgreSQL : Tâches Réalisées . .

Table des matières . . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

. . . . .

15 15 15 16 17

Conclusion Générale

23

Bibliographie

24

iv

Table des figures 1 2.2 2.3 2.4 3.5 3.6 3.7 4.8 4.9 4.10 4.11 4.12 4.13 4.14 4.15 4.16 4.17 4.18 4.19 4.20 4.21 4.22 4.23 4.24 4.25

Logo Association Tunisienne de Géomatique . . . . . . . . Diagramme de cas d’utilisation associé aux citoyens . . . . Diagramme de cas d’utilisation associé aux administrateurs Diagramme de cas d’utilisation global . . . . . . . . . . . Diagramme de classe général . . . . . . . . . . . . . . . . . Séquence "inscription" . . . . . . . . . . . . . . . . . . . . Séquence "authentification" . . . . . . . . . . . . . . . . . . logo de pycharm . . . . . . . . . . . . . . . . . . . . . . . logo de visual paradigm . . . . . . . . . . . . . . . . . . . logo HTML . . . . . . . . . . . . . . . . . . . . . . . . . . logo CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . logo Bootstrap . . . . . . . . . . . . . . . . . . . . . . . . logo de JavaScript . . . . . . . . . . . . . . . . . . . . . . logo de Python . . . . . . . . . . . . . . . . . . . . . . . . logo Django . . . . . . . . . . . . . . . . . . . . . . . . . . logo de PostgreSQL . . . . . . . . . . . . . . . . . . . . . créer un compte . . . . . . . . . . . . . . . . . . . . . . . s’authentifier . . . . . . . . . . . . . . . . . . . . . . . . . ajouter une réclamation . . . . . . . . . . . . . . . . . . . consulter les reclamations . . . . . . . . . . . . . . . . . . ajouter un point de collecte . . . . . . . . . . . . . . . . . consulter la liste des citoyens . . . . . . . . . . . . . . . . créer un circuit de collecte . . . . . . . . . . . . . . . . . . ajouter une conteneure . . . . . . . . . . . . . . . . . . . . zonage . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

v

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

. . . . . . . . . . . . . . . . . . . . . . . . .

2 5 7 8 10 11 12 14 14 14 15 15 15 16 16 16 17 18 18 19 19 20 20 21 22

Liste des tableaux 2.1 2.2

Description des cas d’utilisations associés aux citoyens. . . . . . . . . . . . Description des cas d’utilisations associés aux administrateurs. . . . . . . .

vi

5 6

Introduction générale La géomatique est l’ensemble des techniques d’acquisition, d’intégration, de gestion et d’exploitation de l’information géographique. Dans ce cadre, l’association tunisienne de géomatique (ATG) accompagne ses clients dans la mise en place, l’exploitation et la maintenance d’un système d’information géographique (SIG). Au sein de cette association ,j’ai effectué mon stage du 15 juin 2021 au 15 juillet 2021 qui consiste à développer une application web qui vise l’application de la géomatique dans les organismes municipaux. Cette mission m’a permis de consolider mes connaissances relatives au fonctionnement des systèmes d’information géographique et leur contribuation dans le rapprochement entre géomatique et environnement. Pour mettre en valeur mon expérience il apparaît pertinent d’envisager le cadre de projet, l’organisme d’acceuil, un exposé de la problématique et une proposition de solution adapté dans le premier chapitre. Le deuxiéme chapitre présentera une analyse des besoins fonctionnels et non fonctionnels. Ainsi qu’une étude conceptuelle des différents fonctionnalités de notre application qu’on désignera dans le troisième chapitre. Dans le dernier chapitre nous décrirons l’environnement matériel et logiciel de l’application , les technologies adaptés , et les outils de développement utilisés. Et finalement , nous clôturerons ce rapport par une conclusion générale.

1

Chapitre 1 Contexte du projet 0.1

Introduction

Ce chapitre consiste à réaliser la mise contextuelle de notre projet, la présentation de l’organisme d’acceuil au sein du quel nous avons effectué le stage.

0.2 0.2.1

Présentation de l’organisme d’accueil Organisme d’accueil :

Figure 1 – Logo Association Tunisienne de Géomatique L’Association Tunisienne de Géomatique (ATG) créée en 2011, Jort Réf. N°4029 du 11 Octobre 2011 ayant le visa n° 2011T05596APSF1 et la matricule fiscale 1238329/W.

0.2.2

Adresse et coordonnées

Adresse : ATG, Association Tunisienne de Géomatique, ENIT / Département GC – Bâtiment F2 S 610 – B.P. 37, Le Belvédère 1002 Tunis – Tunisie. Contact : Dr REBAI Noamen président de l’association Tél : +216 23 29 19 35 Email : [email protected] 2

Chapitre 1

0.2.3

0.3. Présentation du projet

Domaines d’activités

ATG est une association qui vise la valorisation de la Géomatique en Tunisie en utilisant les Nouvelles Technologies de l’Information et de la Communication. Ceci à l’échelle nationale et internationale afin de rédiger, proposer et réaliser des programmes de recherche dans le domaine de la géomatique au niveau national. Cette organisation participe : – au développement de nouveaux produits de la géomatique interactive (Google Earth Tunisie à titre d’exemple) – à l’orientation des programmes nationaux de recherche (fondamentale ou appliquée) dans le domaine de la géomatique, – au financement d’actions ciblées de recherche ayant un intérêt scientifique ou thématique incontestable

0.3 0.3.1

Présentation du projet Cadre de projet

Le sujet «La géomatique dans les organismes municipaux » a été proposé dans le cadre de l’élaboration de notre projet de fin d’année (PFA) à l’Institut Supérieur des Technologies de l’Information et de la Communication (ISTIC). Il a été effectué durant un mois au sein de l’Association Tunisienne de Géomatique « ATG » . En effet, notre projet portera sur la conception et la réalisation d’une application web qui permet de localiser, mesurer et représenter sur des cartes et plans les divers éléments du territoire afin de faciliter les taches de la municipalité.

0.3.2

Problématique

Compte tenu des responsabilités nombreuses et diversifiées assumées par les municipalités qui doivent effectuer des taches lourdes pour collecter , filtrer et gérer les déchets. Ce contexte oblige les décideurs à trouver des moyens permettant de moderniser ce travail.

0.3.3

Solution proposée

Comme titre de solution , la proposition consiste à créer une application web qui vise l’implémentation d’un système d’informations géographique à l’aide duquel on y’aura toutes les informations nécessaires à propos les points de collecte des citoyens et les conteneurs dans le but de faciliter la gestion des déchets et alléger les taches de la municipalité.

0.4

Conclusion

Tout au long de ce chapitre, nous avons présenté l’organisme d’accceuil et envisagé le cadre de projet avec la solution adéquate adpté. Le chapitre suivant va être dédié à l’étude des besoins fonctionnels et non fonctionnels de notre application.

3

chapitre 2 Analyse et Spécification des besoins Dans ce chapitre nous allons spécifier les acteurs , les besoins fonctionnels et non fonctionnels de l’application afin de mieux clarifier notre but.

2.1

Identification des acteurs

Dans notre projet nous représentons deux acteurs : • Le citoyen : désigne les habitants de la ville d’ El Marsa. • L’administrateur : désigne la personne chargé de la gestion , la conception et la maintenance de l’application web. Il peut manipuler toutes les tâches proposées et possibles tels que Ajouter, Modifier, Supprimer et consulter.

2.2 2.2.1

Besoins fonctionnels Besoins fonctionnels associés au citoyen

Identification des cas d’utilisation : Cas d’utilisation Créer un compte S’authentifier Ajouter une réclamation Consulter ses réclamations Ajouter un point de collecte des déchets

Description chaque citoyen d’ El Marsa peut créer un compte en introduisant sa position géographique. Avant qu’un citoyen puisse accéder à son compte, il doit d’abord s’identifier. En cas d’insatisfaction , le citoyen peut ajouter une réclamation. Le citoyen peut accéder à ses réclamations et consulter leur état. Le citoyen peut ajouter un point de collecte pour ses déchets en précisant leur type (plastique, bois, ...)

4

Chapitre 2

2.2. Besoins fonctionnels

consulter l’emplacement des conteneurs

Selon sa position géographique , le citoyen peut consulter l’emplacements des conteneurs disponibles pour trouver le plus proche conteneur.

Table 2.1 – Description des cas d’utilisations associés aux citoyens.

Diagramme de cas d’utilisation associé aux citoyens

Figure 2.2 – Diagramme de cas d’utilisation associé aux citoyens

2.2.2

Besoins fonctionnels associés au administrateur

5

Chapitre 2

2.2. Besoins fonctionnels

Identification des cas d’utilisation : Cas d’utilisation S’authentifier Consulter la liste des citoyens Gestion des conteneurs

Gestion des réclamations

Gestion des circuits de collecte des déchets

Zonage

Description L’administrateur doit accéder au système via ses paramètres d’authentification L’administrateur peut consulter la liste des citoyens et leurs cordonnées personnelles. Il peut manipuler les taches suivantes : - consulter l’emplacement des conteneurs. - ajouter un conteneur. - modifier l’emplacement d’un conteneur. - supprimer un conteneur. Il peut manipuler les taches suivantes : - consulter la liste des réclamations. - modifier l’état d’une réclamation : traité ou pas encore. - supprimer une réclamation. Il peut manipuler les taches suivantes : - créer un circuit de collecte des déchets à partir des points de collecte désignés par les citoyens. - modifier un circuit de collecte. - supprimer un circuit de collecte. Chaque admin sera chargé d’une seule zone de la ville d’El Marsa.

Table 2.2 – Description des cas d’utilisations associés aux administrateurs.

6

Chapitre 2

2.2. Besoins fonctionnels

Diagramme de cas d’utilisation associé aux administrateurs.

Figure 2.3 – Diagramme de cas d’utilisation associé aux administrateurs

7

Chapitre 2

2.2.3

2.2. Besoins fonctionnels

Diagramme de cas d’utilisation global

Figure 2.4 – Diagramme de cas d’utilisation global 8

Chapitre 2

2.3

2.3. Besoins non fonctionnels

Besoins non fonctionnels

Les besoins non fonctionnels représentent les règles à respecter pour assurer la bonne qualité de l’application et le bon fonctionnement de son futur système. Les exigences non fonctionnelles de notre plateforme sont définies dans les points suivants : • Rapidité : L’application doit optimiser les traitements pour avoir un temps de génération de schéma raisonnable. • Efficacité : L’application doit être fonctionnelle indépendamment de toutes circonstances pouvant entourer l’utilisateur. • Convivialité : L’application doit être facile à utiliser. En effet, les interfaces utilisateurs doivent être conviviales c’est-à-dire simples, ergonomiques et adaptées à l’utilisateur.

2.4

Conclusion

Dans ce chapitre, nous avons précisé les besoins fonctionnels et non fonctionnels de notre système , le chapitre suivant sera consacré à la conception.

9

chapitre 3 Etude Conceptuelle 3.1

Introduction

Dans ce chapitre, je m’intéresse à la conception des cas d’utilisation que je viens d’analyser dans le chapitre précédent.

3.2

Diagramme de classes

Figure 3.5 – Diagramme de classe général 10

Chapitre 3

3.3 3.3.1

3.3. Diagramme de séquences du système

Diagramme de séquences du système Diagramme de séquence "Inscription"

La figure ci-dessous présente le scénario d’inscription pour le cas d’utilisation de «création d’un compte», donc pour créer un nouveau compte il faut d’abord saisir le nom d’utilisateur et le mot de passe dans la première interface, après la validation de ces paramètres l’utilisateur doit ajouter ses cordonnées personnels (nom,prénom,adresse,téléphone,latitude,longitude) pour accèder au système.

Figure 3.6 – Séquence "inscription"

3.3.2

Diagramme de séquence "Authentification"

La figure ci-dessous présente le scénario d’authentification pour le cas d’utilisation d’«authentification», donc pour accéder au système il faut tout d’abord saisir le nom d’utilisateur et le mot de passe dans l’interface de l’utilisateur, après la validation des paramètres d’accès, l’utilisateur accède au système.

11

Chapitre 3

3.4. Conclusion

Figure 3.7 – Séquence "authentification"

3.4

Conclusion

Dans ce chapitre, nous avons exposé les principaux diagrammes UML ‘diagramme de classe’ et ‘diagramme de séquences’ qui nous aident à présenter l’architecture de notre projet. Dans ce qui suit, on donnera dans le dernier chapitre une vision globale de la réalisation de l’application,en présentant l’environnement de développement et les interfaces graphiques.

12

chapitre 4 Réalisation 4.1

Introduction

Cette partie contient le dernier volet de ce rapport. Elle a pour objectif d’exposer le travail achevé. Dans un premier temps, nous présentons l’environnement matériel, logiciel et les différents outils de développement utilisés. Dans un second temps, nous illustrons la réalisation de notre travail par des imprimes d’écran des interfaces les plus importantes de notre application.

4.2 4.2.1

Environnement de travail Environnement matériel

L’environnement matériel sur lequel nous avons travaillé est constitué d’un ordinateur portable DELL caractérisé par : • Processeur : Intel Core I7 •Mémoire : 16Go de RAM. • Disque dur : 1 To . • Système d’exploitation : Windows 10.

4.2.2

Environnement logiciel

Pour élaborer ce projet nous avons fait recours à un certain nombre de logiciels : PyCharm : un environnement de développement intégré utilisé pour programmer en Python. Il permet l’analyse de code et contient un débogueur graphique. Il permet également la gestion des tests unitaires, l’intégration de logiciel de gestion de versions, et supporte le développement web avec Django.

13

Chapitre 4

4.3. Technologies utilisées :

Figure 4.8 – logo de pycharm Visual Paradigm : un logiciel de création de diagrammes dans le cadre d’une programmation. Tout en un, il possède plusieurs options permettant une large possibilité de modélisation en UML.

Figure 4.9 – logo de visual paradigm

4.3 4.3.1

Technologies utilisées : HTML5 :

HTML (Hypertext Markup Language) est le langage de balisage standard pour les documents conçu pour être affiché dans un navigateur Web.

Figure 4.10 – logo HTML

4.3.2

CSS3 :

CSS (Cascading Style Sheets) est utilisé pour décrire le style du contenu d’un HTML et Fichier XML 14

Chapitre 4

4.3. Technologies utilisées :

Figure 4.11 – logo CSS

4.3.3

Bootstrap4 :

Bootstrap est une collection d’outils dédiés à la création de la conception de sites Web et web applications. C’est un bundle contenant des composants HTML et CSS ainsi que JavaScript extensions.

Figure 4.12 – logo Bootstrap

4.3.4

JavaScript :

JavaScript est un langage de programmation qui permet d’implémenter des mécanismes complexes sur une page web.

Figure 4.13 – logo de JavaScript

4.3.5

Python :

Python est un langage de programmation qui peut s’utiliser dans de nombreux contextes et s’adapter à tout type d’utilisation grâce à des bibliothèques spécialisées.

15

Chapitre 4

4.3. Technologies utilisées :

Figure 4.14 – logo de Python Django : Django est un framework Python de haut niveau, permettant un développement rapide de sites internet, sécurisés, et maintenables.

Figure 4.15 – logo Django

4.3.6

PostgreSQL :

PostgreSQL est un système de gestion de base de données relationnelle orienté objet puissant et open source qui est capable de prendre en charge en toute sécurité les charges de travail de données les plus complexes.

Figure 4.16 – logo de PostgreSQL

16

Chapitre 4

4.4

4.4. Tâches Réalisées

Tâches Réalisées

Figure 4.17 – créer un compte

17

Chapitre 4

4.4. Tâches Réalisées

Figure 4.18 – s’authentifier

Figure 4.19 – ajouter une réclamation

18

Chapitre 4

4.4. Tâches Réalisées

Figure 4.20 – consulter les reclamations

Figure 4.21 – ajouter un point de collecte

19

Chapitre 4

4.4. Tâches Réalisées

Figure 4.22 – consulter la liste des citoyens

Figure 4.23 – créer un circuit de collecte

20

Chapitre 4

4.4. Tâches Réalisées

Figure 4.24 – ajouter une conteneure

21

Chapitre 4

4.4. Tâches Réalisées

Figure 4.25 – zonage

22

Conclusion Générale

23

Bibliographie

24