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 2
0.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2
0.2 Présentation de l’organisme d’accueil . . . . . . . . . . . . . . . . . . . . . 2
0.2.1 Organisme d’accueil : . . . . . . . . . . . . . . . . . . . . . . . . . 2
0.2.2 Adresse et coordonnées . . . . . . . . . . . . . . . . . . . . . . . . . 2
0.2.3 Domaines d’activités . . . . . . . . . . . . . . . . . . . . . . . . . . 3
0.3 Présentation du projet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
0.3.1 Cadre de projet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
0.3.2 Problématique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
0.3.3 Solution proposée . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
0.4 Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3

2 Analyse des besoins 4

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

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

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

iii
Table des matières Table des matières

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

Conclusion Générale 23

Bibliographie 24

iv
Table des figures

1 Logo Association Tunisienne de Géomatique . . . . . . . . . . . . . . . . . 2

2.2 Diagramme de cas d’utilisation associé aux citoyens . . . . . . . . . . . . . 5
2.3 Diagramme de cas d’utilisation associé aux administrateurs . . . . . . . . 7
2.4 Diagramme de cas d’utilisation global . . . . . . . . . . . . . . . . . . . . 8
3.5 Diagramme de classe général . . . . . . . . . . . . . . . . . . . . . . . . . . 10
3.6 Séquence "inscription" . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
3.7 Séquence "authentification" . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
4.8 logo de pycharm . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
4.9 logo de visual paradigm . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
4.10 logo HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
4.11 logo CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
4.12 logo Bootstrap . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
4.13 logo de JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
4.14 logo de Python . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16
4.15 logo Django . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16
4.16 logo de PostgreSQL . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16
4.17 créer un compte . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
4.18 s’authentifier . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
4.19 ajouter une réclamation . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
4.20 consulter les reclamations . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
4.21 ajouter un point de collecte . . . . . . . . . . . . . . . . . . . . . . . . . . 19
4.22 consulter la liste des citoyens . . . . . . . . . . . . . . . . . . . . . . . . . 20
4.23 créer un circuit de collecte . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
4.24 ajouter une conteneure . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
4.25 zonage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22

v
Liste des tableaux

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

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

vi
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 solu-
tion 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’appli-

cation , 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 Présentation de l’organisme d’accueil

0.2.1 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 : atg.geomatique@gmail.com

2
Chapitre 1 0.3. Présentation du projet

0.2.3 Domaines d’activités

ATG est une association qui vise la valorisation de la Géomatique en Tunisie en utili-
sant 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 re-
cherche 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 Présentation du projet

0.3.1 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 municipa-
lité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 conte-
neurs 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 Besoins fonctionnels

2.2.1 Besoins fonctionnels associés au citoyen
Identification des cas d’utilisation :

Cas d’utilisation Description

Créer un compte
S’authentifier
Ajouter une réclamation
Consulter ses réclamations
Ajouter un point de collecte des déchets
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
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
Table 2.2 – Description des cas d’utilisations associés aux administrateurs.
2.2. Besoins fonctionnels
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.
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. Besoins fonctionnels

2.2.3 Diagramme de cas d’utilisation global

Figure 2.4 – Diagramme de cas d’utilisation global

8
Chapitre 2 2.3. Besoins non fonctionnels

2.3 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 circons-
tances 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. Diagramme de séquences du système

3.3 Diagramme de séquences du système

3.3.1 Diagramme de séquence "Inscription"
La figure ci-dessous présente le scénario d’inscription pour le cas d’utilisation de «créa-
tion d’un compte», donc pour créer un nouveau compte il faut d’abord saisir le nom d’uti-
lisateur 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éa-
lisation 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 Environnement de travail

4.2.1 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 Technologies utilisées :

4.3.1 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éca-
nismes 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. Tâches Réalisées

4.4 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