Université Cadi Ayyad

Ecole Supérieur de Technologie-Safi

Département : Informatique
Filière : Génie Informatique

Rapport PFE

Conception et Développement d’une Application Web du

Gestion des Factures

Réaliser par :
DAOUBARI Khadija Encadrer par :
JOUHAL Wafae Mr. Hamzane Ibrahim

ZNADI Malake
Assister par :
Azeddine Nadif

Année universitaire 2024/2025

Dédicace

À ALLAH avant tout

À nos très chers parents
Aucune dédicace ne saurait exprimer l’amour, l’estime, le dévouement et
le respect que nous avons pour vous.
Rien au monde ne vaut les efforts que vous avez fournis jour et nuit pour notre
éducation et notre bien-être.
Ce travail est le fruit des sacrifices que vous avez faits pour notre éducation
et notre formation. « Nous vous aimons très fort »

À nos chers frères et chères sœurs

Pour tout ce que vous avez fait pour nous,
Vous étiez toujours à nos côtés pour nous soutenir et nous motiver,
Nous vous souhaitons une vie pleine de bonheur et de succès.

À nos chers tantes, oncles et toute notre grande famille

Pour votre gentillesse, votre soutien, vos encouragements et votre
confiance en nous.

À nos chers amis

Pour votre gentillesse, votre compréhension, pour les beaux moments
que nous avons passés ensemble, ...bref pour votre amitié.
À notre trinôme Malak et Wafae.
À toutes les personnes qui nous sont chères.
À tous ceux qui nous aiment.
À tous les musulmans

grand merci à vous.

Khadija DAOUBARI
Malak ZNADI
Wafae JOUHAL

1
Remerciements

Au terme de ce travail, nous tenons à exprimer notre profonde gratitude et nos sincères remer-
ciements à tous ceux qui nous ont aidés de près ou de loin pendant la réalisation de notre projet.

Nous tenons également à remercier Monsieur Hamzane, professeur à l’EST Safi, pour son en-
cadrement, son enthousiasme vis-à-vis de notre projet et ses encouragements. Nos sincères re-
merciements vont également à Azeddine Nadif, qui a eu l’honneur de nous encadrer tout au long
de ce travail. Nous lui sommes très reconnaissants pour ses fructueux conseils, ses précieuses
directives, et pour le grand intérêt qu’elle porte à notre sujet.

Nous adressons des remerciements spéciaux à tout le corps professoral de l’EST Safi pour la
formation de qualité qu’ils nous ont prodiguée durant ces deux années. Que tous ceux et celles
qui ont contribué de près ou de loin à l’accomplissement de ce travail trouvent ici l’expression de
nos remerciements les plus chaleureux.

2
Table des Matières

1 Contexte Global de Projet 9

1.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
1.2 Présentation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
1.3 Problématique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
1.4 Objectifs du Projet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
1.5 Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11

Introduction 11

2 Analyse et specification des besoins 12

2.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
2.2 Besoins Fonctionnels . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
2.3 Besoins non Fonctionnels . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
2.4 Besoins techniques . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
2.4.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
2.4.2 Language utilisé : PHP . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
2.4.3 Framework PHP utilise : Laravel . . . . . . . . . . . . . . . . . . . . . . . 15
2.5 Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15

3 Organisation de projet 16
3.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16
3.2 Equipe du projet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16
3.3 Planification du projet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
3.3.1 Organisation des tâches . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
3.4 Digramme de GANTT . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
3.5 Suivi du projet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
3.5.1 Modeles de developpement . . . . . . . . . . . . . . . . . . . . . . . . . . 19
3.5.2 Modèles Agiles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
3.5.3 La méthode Scrum . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
3.5.4 Gestion de projet interactive agile . . . . . . . . . . . . . . . . . . . . . . 22
3.6 Logiciels utilisés . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
3.7 Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24

4 Etude Conceptuel 25
4.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25
4.2 Conception technique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25
4.2.1 Architecture de Site Web Dynamique - Modèle MVC . . . . . . . . . . . . 25
4.3 Conception graphique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
4.3.1 Charte graphique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27

3
 4.3.2 Charte éditoriale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28
4.4 Conception de base de donnee . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
4.4.1 Choix du langage de conception de base de donnée(UML) . . . . . . . . . 29
4.4.2 Notions UML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
4.4.3 Pourquoi une méthode objet ? . . . . . . . . . . . . . . . . . . . . . . . . 30
4.5 Conception de l’application . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31
4.5.1 Diagramme de cas d’utilisation . . . . . . . . . . . . . . . . . . . . . . . . 31
4.5.2 Diagramme de classe . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32
4.6 Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34

5 Réalisation 35
5.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35
5.2 Environnements de travail et choix techniques . . . . . . . . . . . . . . . . . . . . 35
5.2.1 Framework et Environnements de travail . . . . . . . . . . . . . . . . . . . 36
5.2.2 Langage de programmation utilisés . . . . . . . . . . . . . . . . . . . . . . 38
5.3 Principales interfaces graphiques . . . . . . . . . . . . . . . . . . . . . . . . . . . 40
5.3.1 Interface d’accueil . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40
5.3.2 Interface d’authentification . . . . . . . . . . . . . . . . . . . . . . . . . . 41
5.3.3 Tableau de Bord . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43
5.3.4 Les Produits . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43
5.3.5 Les Factures . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46
5.3.6 Interfaces Utilisateurs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51
5.3.7 Les Roles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53
5.3.8 Les Permissions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 54
5.3.9 Notifications . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55
5.3.10 Rapport Financière . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 56
5.4 Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 58

Conclusion Générale 59

Webographie 61

4
Table des figures

3.1 l’équipe du projet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17

3.2 palanning . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
3.3 Diagramme de Gantt . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
3.4 La méthode Scrum(les rôles et le processus) . . . . . . . . . . . . . . . . . . . . . 21
3.5 Tableau Kanban numérique(Trello) . . . . . . . . . . . . . . . . . . . . . . . . . . 23
3.6 Github . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
3.7 Trello . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24

4.1 Vue Statique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30

4.2 Vue dynamique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31
4.3 Diagramme de cas d’utilisation generale . . . . . . . . . . . . . . . . . . . . . . . 32
4.4 Diagramme de classe . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33

5.1 Laravel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36
5.2 Logo Visual Studio Code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36
5.3 Plateforme Overleaf . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36
5.4 Laragon . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37
5.5 XAMPP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37
5.6 StarUML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38
5.7 PHP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38
5.8 Git . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39
5.9 bootstrap . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39
5.10 CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39
5.11 javascript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40
5.12 Interface d’accueil . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42
5.13 Login de l’application . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42
5.14 Interface des Statistique de l’application . . . . . . . . . . . . . . . . . . . . . . . 43
5.15 L’ajout des produits . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44
5.16 Ajout des produit et generation automatique de TVA . . . . . . . . . . . . . . . 44
5.17 la modification des produits . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45
5.18 La suppression des produits . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45
5.19 Parametre des produits . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46
5.20 La Liste des factures . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46
5.21 Exportation de la facture en XML . . . . . . . . . . . . . . . . . . . . . . . . . . 47
5.22 Interface pour exporter une facture . . . . . . . . . . . . . . . . . . . . . . . . . . 47
5.23 Exportation d’une facture sous forme PDF . . . . . . . . . . . . . . . . . . . . . 48
5.24 Imprimer une facture sous forme PDF . . . . . . . . . . . . . . . . . . . . . . . . 49
5.25 La facture Payee . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50
5.26 La facture impayee . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50

5
5.27 La facture partiellement payee . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51
5.28 l’ajout des users selon leur roles . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
5.29 la liste des utilisateurs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
5.30 Ajouter des roles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53
5.31 la modifications des roles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53
5.32 les informations sur les roles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53
5.33 la liste des roles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 54
5.34 la liste des permissions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 54
5.35 L’Ajout de permission . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55
5.36 Notifications de l’application . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55
5.37 Rapport Financière . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 56
5.38 Chercher appartient du type de facture et la date . . . . . . . . . . . . . . . . . . 57
5.39 Chercher appartir du numero de la facture . . . . . . . . . . . . . . . . . . . . . . 57

6
Liste des Abréviations

CSS Cascading Style Sheets

HTML HyperText Markup Language
PHP Hypertext Preprocessor
PDF Portable Document Format
UML Unified Modeling Language
SQL Structured Query Language
XML Extensible Markup Language
MVC Model-View-Controller
TVA Taxe sur la Valeur Ajoutée
TIC Technologies de l’information et de la communication

7
Introduction

Ce projet de fin d’études se concentre sur la création d’une solution complète de gestion des
factures pour les entreprises, en utilisant Laravel PHP et Bootstrap pour l’application web. En
outre, l’utilisation de Git pour le contrôle de version garantit une collaboration efficace de notre
équipe et une gestion optimale du code source.

Cette introduction offre un aperçu des défis associés à la gestion des factures dans les entreprises,
ainsi qu’une justification de l’approche technologique choisie pour notre projet. Nous débuterons
par une analyse des problèmes courants rencontrés dans la gestion des factures, en mettant en
lumière les risques de sécurité potentiels liés aux processus manuels et aux systèmes obsolètes.
Ensuite, nous présenterons notre solution proposée, en mettant en avant les avantages de l’utilisa-
tion de Laravel PHP, Bootstrap et Git dans le développement d’une plateforme robuste, intuitive
et sécurisée.

Certes, le bon fonctionnement de l’application et le respect du cahier des charges sont très
importants, mais la sécurisation de cette dernière est d’une importance majeure. Pour cela, elle
a été prise en considération tout au long de la réalisation.

Ce rapport détaillera les différentes phases par lesquelles nous sommes passés afin d’aboutir
à une application fiable et satisfaisante. Le rapport définit le travail que nous avons effectué.
Il est composé de trois grandes parties. La première partie présente le contexte du projet et la
spécification des besoins, la deuxième est consacrée à la conception, et la dernière partie comporte
les résultats obtenus.[0.4cm]

8
Chapitre 1

Contexte Global de Projet

1.1 Introduction

Au cours de ce chapitre, nous introduirons la présentation de notre sujet, déterminerons ses

objectifs et étudierons la problématique qui a poussé l’administration du service financier à
demander cette application. La présentation de la solution souhaitée nous amène à bien analyser
les différentes méthodologies de travail existantes afin de dégager celle la plus adaptée à notre
projet.

1.2 Présentation

Notre présent projet de fin d’études consiste en la création et la réalisation d’une applica-
tion web pour la gestion des factures au sein d’une entreprise. Il comporte un seul adminis-
trateur(gestionnaire d’entreprise) et plusieurs utilisateurs(comptables) ayant des rôles distincts,
notamment des comptables, des financiers et des gestionnaires d’entreprise.

9
1.3 Problématique

La gestion des factures présente plusieurs défis majeurs. Les comptables et les financiers doivent
gérer efficacement les informations des factures pour éviter les conflits de disponibilité, suivre
l’état des factures, et assurer la sécurité des informations des clients. De plus, offrir une interface
utilisateur intuitive est crucial pour faciliter la gestion des comptes clients. Il est également
important de générer des factures pour optimiser les opérations . Enfin, le système doit être
évolutif pour s’adapter à la croissance de l’entreprise sans compromettre la performance.

1.4 Objectifs du Projet

L’objectif de ce projet de création d’une application de gestion des factures est de développer
une solution logicielle complète et intuitive qui permette aux entreprises de gérer efficacement
toutes les étapes liées au processus de facturation. Les principaux objectifs spécifiques sont les
suivants :

— Automatisation des Processus :

— Automatiser la création, la modification et le suivi des factures pour réduire les erreurs
humaines et augmenter l’efficacité.

— Gestion Intégrée des Données :

— Fournir une gestion centralisée des clients, des fournisseurs et des produits pour amé-
liorer l’organisation et la cohérence des informations.

— Suivi et Historique des Factures

— Permettre le suivi détaillé et l’historique des états des factures, incluant les paiements,
les modifications et les statuts.

— Rapports et Analyses :

— Offrir des outils de génération de factures et de statistiques pour permettre une analyse
approfondie des données de facturation et aider à la prise de décision.

— Gestion des Droits d’Accès

10
 — Mettre en place un système de gestion des droits d’accès pour définir et contrôler
les privilèges des différents utilisateurs (comptables, financiers, gestionnaires d’entre-
prise).

— Interface Utilisateur Intuitive :

— Développer une interface utilisateur conviviale et intuitive qui facilite la navigation,

la gestion des factures et l’accès aux informations essentielles.

En résumé, l’objectif est de fournir une solution complète et fiable pour la gestion des factures,
améliorant ainsi l’efficacité opérationnelle, la précision des données et la satisfaction des utilisa-
teurs.

1.5 Conclusion

Dans ce chapitre introductif, nous avons présenté le projet à réaliser. Nous allons entamer main-
tenant la phase d’analyse et specification des besoins qui consiste à comprendre le contexte du
systeme.

11
Chapitre 2

Analyse et specification des besoins

2.1 Introduction

La phase d’analyse et de spécification des besoins représente une étape primordiale dans le cycle
de développement d’un projet. En effet, elle permet de mieux comprendre le travail demandé en
dégageant les besoins des différents utilisateurs que le système doit accomplir.

2.2 Besoins Fonctionnels

Mise en place d’une application Web qui permet des factures et des informations de clients. Il
doit satisfaire les principaux besoins fonctionnels qui se présentent dans les points suivants :

• Authentification et Sécurité :

· L’authentification d’utilisateur est obligatoire pour chaque ouverture de session.

• Gestion des Factures :

· Chaque comptable et financier peut gérer les factures, les fournisseurs, les clients et
la liste des produits.
· Chaque comptable, financier et gestionnaire d’entreprise peut créer une nouvelle fac-
ture.
· Chaque comptable, financier et gestionnaire d’entreprise peut modifier une facture.

12
 · Chaque comptable, financier et gestionnaire d’entreprise peut modifier l’état de chaque
facture.
· Chaque comptable et financier peut consulter et lister l’historique de l’état de chaque
facture.
· Chaque comptable et financier peut exporter une facture.

• Gestion des Clients :

· Chaque comptable et financier peut ajouter un nouveau client.

· Chaque comptable et financier peut modifier les informations d’un client.
· Chaque comptable et financier peut supprimer un client.
· Chaque comptable, financier et gestionnaire d’entreprise peut consulter la liste des
clients.

• Gestion des Fournisseurs :

· Chaque comptable, financier et gestionnaire d’entreprise peut ajouter un nouveau

fournisseur.
· Chaque comptable et financier peut modifier les informations d’un fournisseur.
· Chaque comptable et financier peut supprimer un fournisseur.
· Chaque comptable, financier et gestionnaire d’entreprise peut consulter la liste des
fournisseurs.

• Statistiques et Rapports :

· Chaque comptable, financier et gestionnaire d’entreprise peut consulter les diagrammes

des statistiques générées à propos des factures.

• Gestion des Utilisateurs :

· Chaque gestionnaire d’entreprise peut accéder aux interfaces gérées par les comptables
et les financiers.
· Chaque gestionnaire d’entreprise peut ajouter de nouveaux utilisateurs (comptables/financiers).
· Chaque gestionnaire d’entreprise peut modifier les droits d’accès et les privilèges d’un
comptable/financier.

• Notifications :

· Chaque comptable, financier et gestionnaire d’entreprise reçoit des notifications.

13
2.3 Besoins non Fonctionnels

Les besoins non fonctionnels sont indispensables et permettent l’amélioration de la qualité logi-
cielle de notre système. Ils agissent comme des contraintes sur les solutions, mais leur prise en
considération évite plusieurs incohérences dans le système. Ce dernier doit répondre aux exigences
suivantes :

• Un temps de réponse minimal.

• Un contrôle d’accès aux utilisateurs.
• Une interface conviviale et facile à utiliser.
• La mise à jour instantanée de la base de données.
• La disponibilité et minimisation des blocages et plantages.

2.4 Besoins techniques

2.4.1 Introduction

Les besoins techniques permettent de créer une adaptation de conception avec une architecture
technique et d’influencer le projet et la manière dont il sera développé. Dans cette partie, nous
allons expliquer en détail les choix technologiques concernant les langages de programmation et
les frameworks que nous avons utilisés lors de notre projet.

2.4.2 Language utilisé : PHP

Pour développer notre application, nous avons choisi le langage PHP pour plusieurs raisons.
Tout d’abord, il est gratuit et ne nécessite aucune licence d’utilisation, ce qui en fait une option
économique. De plus, PHP est un langage facile à apprendre et accessible sur la plupart des
systèmes d’exploitation. Sa popularité sur le web assure un support étendu et une maintenance
aisée. Il existe également une vaste quantité de documentation et de tutoriels disponibles, ce
qui facilite notre travail et réduit notre temps d’exécution. Enfin, ces ressources permettent une
évolution rapide de notre application.

14
2.4.3 Framework PHP utilise : Laravel

L’utilisation d’un framework présente plusieurs avantages, tels que l’accélération du temps de
développement, une meilleure organisation du projet, et une structure de code plus claire. Pour
notre application web, nous avons opté pour Django pour plusieurs raisons. D’abord, il est très
populaire et réputé pour sa robustesse et sa rapidité de développement. Sa documentation riche
et sa grande communauté en font un outil respecté par les développeurs. Django est très apprécié
pour sa sécurité intégrée et sa capacité à gérer des projets de grande envergure. De plus, son
ORM (Object-Relational Mapping) facilite les interactions avec la base de données, rendant le
développement plus rapide et plus efficace.

2.5 Conclusion

Dans ce chapitre, nous avons étudié les différents besoins de notre projet. Nous avons classé ces
besoins en fonctionnels, non fonctionnels et techniques. Après l’analyse et à travers cette étude,
nous avons soulevé la problématique détectée ainsi que les objectifs définis. Spécification des
besoins utilisés, il est maintenant temps de passer à l’organisation de notre application dans le
chapitre suivant.

15
Chapitre 3

Organisation de projet

3.1 Introduction

Ce chapitre présente l’organisation du projet de développement d’une application web de gestion

de projet. Il décrit les rôles des différents intervenants, les processus de développement et les
outils utilisés.

3.2 Equipe du projet

16
 Figure 3.1 – l’équipe du projet

3.3 Planification du projet

La planification constitue l’une des étapes fondamentales des projets préliminaires. Elle englobe
la définition et la structuration des différentes tâches à réaliser, ainsi que l’estimation de leur
durée. Par ailleurs, la planification joue un rôle essentiel dans l’établissement de la portée globale
de l’effort nécessaire, la clarification et le raffinement des objectifs, ainsi que l’élaboration d’une
stratégie d’action pour les atteindre.

3.3.1 Organisation des tâches

Le tableau ci-dessous représente l’organisation des tâches à effectuer sur une période estimée,
afin de fournir une vision globale du projet et de son déroulement.

17
 Figure 3.2 – palanning

3.4 Digramme de GANTT

Pour planifier et suivre l’avancement de notre projet, nous avons opté pour l’utilisation du
diagramme de Gantt. Ce diagramme offre une méthode efficace pour planifier le projet de manière
optimale et simplifie le suivi de son avancement. Il permet également une visualisation claire et
rapide de la séquence temporelle des différentes tâches durant la réalisation du projet.

La figure ci-dessous présente le diagramme de Gantt détaillant les différentes étapes à effectuer
pour mener à bien notre projet.

18
 Figure 3.3 – Diagramme de Gantt

Ce diagramme permet donc de visualiser d’un seul coup :

• Les différentes tâches à envisager.

• La date de début et la date de fin de chaque tâche.
• La durée escomptée de chaque tâche.
• Le chevauchement éventuel des tâches, et la durée de ce chevauchement.
• La date de début et la date de fin de projet dans son ensemble.

3.5 Suivi du projet

3.5.1 Modeles de developpement

Il existe deux paradigmes de développement logiciel : les modèles traditionnels et les modèles
agiles. Les modèles traditionnels, tels que le modèle en cascade ou le modèle en V, suivent
une approche séquentielle et linéaire du développement, tandis que les modèles agiles, tels que
Scrum, RAD (Rapid Application Development) ou le modèle en spirale, privilégient la flexibilité,

19
l’adaptabilité et la livraison itérative de fonctionnalités. Le choix du modèle de développement
est crucial pour le succès du projet, c’est pourquoi nous avons opté pour la méthodologie agile,
qui correspond le mieux à nos besoins et à notre environnement de projet.

3.5.2 Modèles Agiles

Les modèles agiles sont des méthodologies de développement logiciel qui mettent l’accent sur
la flexibilité, l’adaptabilité et la livraison itérative de produits de haute qualité. Ils favorisent
la collaboration entre les membres de l’équipe et les parties prenantes du projet, ainsi que la
réponse aux changements de priorités et de besoins tout au long du cycle de vie du projet. Les
méthodes Agiles les plus populaires en usage aujourd’hui sont :

• Extreme Programming (XP)

• Scrum
• La méthode RAD (Rapid Application Development)

Nous allons adopter le modèle Agile Scrum, qui permet de structurer des projets de développe-
ment plus complexes.

3.5.3 La méthode Scrum

Scrum est une méthodologie agile de gestion de projet axée sur des itérations courtes et régulières
appelées "sprints". Elle favorise la collaboration entre les membres de l’équipe et la livraison
continue de fonctionnalités prioritaires. Scrum permet une adaptation rapide aux changements
et une focalisation sur la création de valeur pour le client.

Les rôles Scrum

Dans Scrum, il y a trois rôles principaux :

• Product Owner(Proprietaire du produit) : Le Product Owner est responsable de définir

les besoins et les priorités du produit, de maintenir le backlog produit, et de s’assurer que
l’équipe développe les fonctionnalités qui apportent le plus de valeur à l’utilisateur et au
client.

20
 • Scrum Master(Scrum master) : Le Scrum Master est responsable de veiller à ce que l’équipe
Scrum comprenne et suive les principes et les pratiques de Scrum. Il facilite les réunions
Scrum, élimine les obstacles et aide l’équipe à être aussi productive que possible.
• Team (Équipe de développement) : L’équipe de développement est responsable de trans-
former les éléments du backlog produit en fonctionnalités potentiellement livrables. Elle
est auto-organisée et multidisciplinaire, et elle est chargée de choisir la meilleure façon de
réaliser le travail assigné lors de chaque sprint.

Les processus Scrum

La méthode Scrum consiste à enchaîner de façon itérative des timeboxes (blocs de temps) qui
vont produire des artefacts (des outils, du logiciel ou des documents qui vont contribuer à orienter
et faire avancer le projet).

La figure ci-dessous représente le processus Scrum que nous avons suivi pour mettre en œuvre
notre projet :

Figure 3.4 – La méthode Scrum(les rôles et le processus)

• User story :Description d’une fonctionnalité du point de vue de l’utilisateur, détaillant

ce qu’il veut accomplir.
• Product backlog : Liste priorisée de toutes les fonctionnalités à développer dans un
projet.
• Sprint backlog : Liste des tâches à réaliser pendant un sprint, tirées du product backlog.

21
 • Planification de sprint : Réunion où l’équipe sélectionne les tâches à réaliser lors du
prochain sprint.
• Sprint : Période de temps fixe pendant laquelle l’équipe développe les fonctionnalités
sélectionnées.
• Mêlée quotidienne : Réunion courte quotidienne où l’équipe synchronise son travail et
identifie les obstacles.
• Revue de sprint : Réunion à la fin du sprint où l’équipe présente les fonctionnalités
développées au Product Owner et aux parties prenantes.
• Rétrospective de sprint : Réunion à la fin du sprint où l’équipe examine son fonction-
nement et identifie des améliorations à apporter.

3.5.4 Gestion de projet interactive agile

La méthode de gestion de projet révolutionnaire se caractérise par une approche itérative et

incrémentale. En d’autres termes, les projets agiles sont construits lentement, étape par étape.
Un tableau Kanban est un outil de gestion de projet agile conçu pour aider à visualiser le travail,
limiter le travail en cours et maximiser l’efficacité.

Tableau Kanban numerique(Trello)

Trello est un outil de gestion de projet gratuite, basé sur la méthode Kanban. Il permet aux
utilisateurs de d’organiser leurs tâches et projets grâce à une interface simple et efficace composée
de tableaux, de listes et de cartes.

La figure ci-dessous représente la méthode Kanban agile approuvée pour gérer notre projet :

22
 Figure 3.5 – Tableau Kanban numérique(Trello)

3.6 Logiciels utilisés

Github

Figure 3.6 – Github

GitHub est une plateforme de développement collaboratif et de gestion de code source utilisant
Git. Elle permet aux développeurs de stocker, de gérer et de suivre les modifications du code
source de leurs projets, tout en facilitant la collaboration et le partage de code avec d’autres
développeurs.

23
Trello

Figure 3.7 – Trello

Trello est un outil de gestion de projet intuitif et flexible, basé sur la méthode Kanban. Il permet
aux utilisateurs de visualiser et de gérer leurs tâches et projets grâce à une interface simple et
efficace composée de tableaux, de listes et de cartes.

3.7 Conclusion

L’organisation du projet a été définie en tenant compte des compétences des membres de l’équipe
et des contraintes du projet. La méthode Scrum a permis une gestion efficace du projet et une
livraison rapide de résultats. Les outils utilisés ont facilité la collaboration et la communication
entre les membres de l’équipe.

24
Chapitre 4

Etude Conceptuel

4.1 Introduction

La conception technique est une étape essentielle dans le développement d’une application web
de gestion de factures. Elle permet de définir les choix architecturaux, technologiques et organi-
sationnels qui permettront de réaliser l’application de manière efficace et performante.

4.2 Conception technique

4.2.1 Architecture de Site Web Dynamique - Modèle MVC

Le modèle MVC est une architecture logicielle qui divise une application en trois composants
principaux : le Modèle, la Vue et le Contrôleur. Chacun de ces composants a un rôle spécifique
et interagit avec les autres de manière contrôlée

25
Modèle

Le Modèle représente la logique métier de l’application ainsi que les données sous-jacentes. Il
est responsable de la gestion des données, de la logique métier et des règles de validation. Dans
le contexte d’une application de gestion de factures, le Modèle inclut les entités telles que les
factures, les clients et les fournisseurs.

• Gestion des Données :

· Le Modèle interagit avec la base de données pour récupérer, insérer, mettre à jour et
supprimer les données.

• Logique Métier :

· Il applique les règles de gestion spécifiques à l’application (par exemple, calculer le

montant total d’une facture).

• Validation :

· Il s’assure que les données sont valides avant de les sauvegarder dans la base de
données.

La Vue

La Vue est responsable de la présentation des données. Elle affiche les informations fournies par
le Modèle et permet à l’utilisateur d’interagir avec l’application. Les Vues sont généralement des
pages HTML/CSS avec du JavaScript pour l’interactivité.

• Affichage des Données :

· La Vue présente les données sous une forme compréhensible pour l’utilisateur (par
exemple, liste des factures, détails d’un client).

• Interface Utilisateur :

· Elle offre une interface graphique à travers laquelle l’utilisateur peut interagir avec le
système.

26
Le Contrôleur

Le Contrôleur agit comme un intermédiaire entre le Modèle et la Vue. Il reçoit les requêtes de
l’utilisateur, traite les données via le Modèle, et détermine quelle Vue doit être affichée.

• Gestion des Requêtes :

· Le Contrôleur capture les requêtes de l’utilisateur (par exemple, une demande pour
voir une facture spécifique).

• Interaction avec le Modèle :

· Il utilise le Modèle pour manipuler les données en conséquence.

• Mise à jour de la Vue :

· Après avoir traité les données, le Contrôleur sélectionne la Vue appropriée pour afficher
les résultats.

Cette architecture permet une séparation claire des responsabilités, ce qui facilite la maintenance
et l’évolution de l’application de gestion de factures. En utilisant des frameworks modernes tels
que Laravel, nous pouvons rapidement développer des applications robustes et évolutives. La
compréhension et l’application de ce modèle sont essentielles pour créer des applications web
efficaces et maintenables.

4.3 Conception graphique

4.3.1 Charte graphique

La charte graphique est conçue pour être esthétiquement agréable pour les utilisateurs de l’appli-
cation, qu’il s’agisse de comptables, de financiers ou de gestionnaires d’entreprise, tout en restant
ergonomique et intuitive.

La charte graphique est conforme aux standards et aux normes dictées par le W3C ainsi qu’aux
usages du graphisme et du Web. L’interface graphique web est simpliste et minimaliste, met-
tant l’accent sur la fonctionnalité et la facilité d’utilisation sans recourir à des éléments HTML

27
complexes.

L’application web de gestion des factures dispose d’une interface graphique web simpliste, ce qui
signifie que les pages sont conçues pour être très simples et épurées. En réalité, il existe deux
profils de personnes qui peuvent utiliser l’application web de gestion des factures :

• Gestionnaire d’entreprise :

· A tous les droits d’accès sur la base de données, et il peut gérer les droits d’accès des
comptable et financier.

• Comptable et Financier :

· Il bénéfice de la plupart des fonctions car il a les possibilités de gérer tous les infor-
mations sauf les droits d’accès .

4.3.2 Charte éditoriale

L’interface utilisateur utilise une palette de couleurs comprenant principalement des tons orange,
jaune, bleu et blanc. Ces couleurs ont été sélectionnées pour leur sobriété et leur professionna-
lisme, tout en offrant une esthétique visuelle agréable. De plus, certaines de ces couleurs sont
également utilisées dans notre logo, assurant ainsi une cohérence de marque à travers l’ensemble
de l’application. Cette approche garantit une expérience utilisateur homogène et reconnaissable,
renforçant ainsi l’identité visuelle de la marque.

Les typographies seront claires et lisibles, en utilisant des polices web standards, avec des tailles
de police optimales pour différents écrans et résolutions.

Les éléments interactifs tels que les boutons et les liens seront bien distincts et réactifs pour offrir
une expérience utilisateur agréable. Les formulaires seront simplifiés pour réduire le temps de
saisie et minimiser les erreurs.

En conclusion, la charte graphique et éditoriale de cette application vise à créer une interface uti-
lisateur agréable et efficace, en mettant l’accent sur la simplicité, la fonctionnalité et la conformité
aux normes actuelles du web.

28
4.4 Conception de base de donnee

4.4.1 Choix du langage de conception de base de donnée(UML)

Par rapport à toutes les méthodes orientées objets qui sont en utilisation, seule UML a la ca-
pacité de satisfaire tous les besoins de conceptions requises par les entreprises et les sociétés
informatiques.

En effet, Il unifie les notations nécessaires aux différentes activités d’un processus de développe-
ment et offre en plus de ça les moyens d’établir le suivi des décisions prises depuis les spécifications
jusqu’au codage.

4.4.2 Notions UML

UML :(Unified Modeling Language) ou « Langage de Modélisation Unifié » Standardisé par

l’OMG (Object Management Group) est une notion basée principalement sur les méthodes des
BOOCH (de BOOCH), OMT de Rumbaugh et OOSE de Jacobson.UML a été proposé afin de
standardiser les produits de développement (modèle, notation, diagramme) sans standardiser le
processus de développement qui dépend des personnes, des applications, des cultures, etc.

UML se propose de créer un langage de modélisation utilisable à la fois par les humais (forme
graphique) et les machines (syntaxe précise). L’utilisation des modèles « UML » sert à :

• Décomposer le processus de développement.

• Mettre en relation les experts des métiers et les analystes.

29
 • Coordonner les équipes d’analyse de la réalisation.
• Séparer l’analyse de la réalisation.
• Prendre en compte l’évolution de l’analyse et du développement.
• Migrer facilement vers une architecture objet d’un point de vue statique.

4.4.3 Pourquoi une méthode objet ?

Les langages orientés objet constituent chacun une manière spécifique d’implémenter le para-
digme objet. Ainsi, une méthode objet permet de définir le problème à haut niveau sans rentrer
dans les spécificités d’un langage. Il représente ainsi un outil permettant de définir un problème
de façon graphique, afin par exemple de le présenter à tous les acteurs d’un projet (n’étant pas
forcément des experts en un langage de programmation).

UML comporte 9 diagrammes standards représentant autant de "vues" d’un système d’infor-
mation. Ces diagrammes se répartissent en deux catégories : quatre représentent la structure
statique de l’application ; cinq représentent son comportement dynamique.

Figure 4.1 – Vue Statique

30
 Figure 4.2 – Vue dynamique

Ces diagrammes sont d’une utilité variable selon les cas et ils ne sont pas tous nécessairement
produits à l’occasion de la modélisation.

4.5 Conception de l’application

4.5.1 Diagramme de cas d’utilisation

Definition

Ce diagramme est destiné à représenter les besoins des utilisateurs par rapport au système. Il
constitue un de diagrammes le plus structurants dans l’analyse d’un système.

Acteur : représente un rôle joué par une personne qui interagit directement avec le système
étudié.

Cas d’utilisation (use case) : représente un ensemble des séquences d’actions qui sont réalisées
par le système et qui produisent un résultat observable intéressant pour un acteur particulier.
L’utilisation d’un diagramme de cas d’utilisation s’avère indispensables pour décrire les besoins
fonctionnels. Ces diagrammes permettent de décrire l’interaction entre l’acteur et le système.
C’est l’image d’une fonctionnalité de système déclenchée en réponse à la stimulation d’un acteur
externe.

31
Diagramme de cas d’utilisation

Ce diagramme représente les différentes activités que le gestionnaire d’entreprise et le comptables

afin de gérer et contrôler leur application et les activités qui peuvent effectuer.

Figure 4.3 – Diagramme de cas d’utilisation generale

4.5.2 Diagramme de classe

Un diagramme de classe est un type de diagramme utilisé dans l’ingénierie logicielle pour re-
présenter la structure statique d’un système logiciel orienté objet. Il met en évidence les classes
du système, ainsi que leurs attributs, leurs méthodes et les relations entre elles. Les diagrammes

32
de classe sont essentiels pour la conception et la modélisation des systèmes logiciels, car ils per-
mettent aux développeurs de visualiser et de comprendre la structure du système, ce qui facilite
la communication et la collaboration entre les membres de l’équipe de développement.

Figure 4.4 – Diagramme de classe

33
4.6 Conclusion

Au long de ce chapitre, nous avons présenté la conception de notre application ainsi que son
architecture. Le chapitre suivant, intitulé "Réalisation", nous permettra de présenter l’environ-
nement matériel et logiciel de développement, ainsi que des captures d’écran détaillées de notre
application.

34
Chapitre 5

Réalisation

5.1 Introduction

Après avoir mené l’étude et la conception de notre application, nous passons à la phase d’implé-
mentation. Ce chapitre présente les résultats du travail effectué durant ce projet de fin d’études.
Nous allons également présenter les outils de développement utilisés. Nous clôturons ce chapitre
avec des captures d’écran démontrant les différentes fonctionnalités de notre application.

5.2 Environnements de travail et choix techniques

Cette section met l’accent sur les technologies,les logiciels et les languages utilisés durant ce
travail.

35
5.2.1 Framework et Environnements de travail

Laravel

Figure 5.1 – Laravel

Laravel est un framework web open-source écrit en PHP, conçu pour le développement rapide
et la création d’applications web modernes et évolutives. Il fournit une structure robuste et des
fonctionnalités puissantes pour simplifier le processus de développement tout en maintenant la
flexibilité et la maintenabilité du code.

Visual Studio Code

Figure 5.2 – Logo Visual Studio Code

Cet un est éditeur de texte open source, gratuit et multiplateforme (Windows, Mac et Linux),
développé par Microsoft. Principalement conçu pour le développement d’application avec JavaS-
cript, Type script et Node.js, l’éditeur peut s’adapter à d’autres types de langages grâce à un
Système d’extension bien fourni.

Overleaf

Figure 5.3 – Plateforme Overleaf

36
Overleaf est une plateforme pratique pour les utilisateurs de LaTeX, offrant des fonctionnalités
de collaboration et une expérience d’édition en ligne sans tracas.

Laragon

Figure 5.4 – Laragon

Laragon est une plateforme de développement local qui facilite la création et la gestion d’en-
vironnements de développement web sur votre ordinateur. Contrairement à d’autres solutions
telles que XAMPP ou WAMP, Laragon est conçu pour être simple à installer et à utiliser, tout
en offrant des fonctionnalités avancées pour les développeurs.

XAMPP

Figure 5.5 – XAMPP

XAMPP est un logiciel gratuit et open-source qui facilite la création et la gestion de serveurs
web locaux. Il comprend des composants tels que Apache, MySQL, PHP et Perl, ce qui en fait
une solution tout-en-un pour développer des applications web sur votre propre ordinateur.

37
StarUML

Figure 5.6 – StarUML

StarUML est un outil de modélisation UML (Unified Modeling Language) largement utilisé dans
le domaine du développement logiciel. Il permet aux développeurs de créer des diagrammes UML
pour concevoir, visualiser et documenter des systèmes logiciels.

5.2.2 Langage de programmation utilisés

PHP

Figure 5.7 – PHP

PHP, acronyme de "Hypertext Preprocessor", est un langage de programmation open-source

largement utilisé pour le développement web. Il est spécialement conçu pour être intégré dans
des pages HTML et est souvent utilisé pour créer des sites web dynamiques et interactifs.

38
Git

Figure 5.8 – Git

Pour la gestion de version, étant habitué à Git. Cet outil nous a permis tout au long du PFE de
garder trace des différentes évolutions de celui-ci. L’un des avantage de Git est sa gestion aisée
des branches. Cette fonctionnalité est très utile pour tester sans crainte certaines approches et
d’en garder une trace même si en l’état ces modifications ne sont prêtes pour rejoindre le tronc
commun.

bootstrap

Figure 5.9 – bootstrap

Bootstrap est un framework front-end open-source développé par Twitter. Il fournit des outils et
des modèles pour la création d’interfaces web réactives et mobiles conviviales. Bootstrap utilise
HTML, CSS et JavaScript pour faciliter le développement de sites web responsive et attrayants.

CSS

Figure 5.10 – CSS

Les feuilles de style en cascade (CSS, Cascading Style Sheets) sont un langage de style utilisé
pour décrire la présentation des documents HTML et XML. CSS permet de contrôler l’apparence

39
visuelle des pages web, notamment la mise en page, les couleurs, les polices et d’autres aspects
stylistiques.

Javascript

Figure 5.11 – javascript

JavaScript est un langage de programmation de scripts principalement utilisé pour créer du

contenu web interactif. Il permet de rendre les pages web dynamiques et réactives en manipulant
le HTML et le CSS.

5.3 Principales interfaces graphiques

5.3.1 Interface d’accueil

Ces interfaces représentent Home de notre application web.

40
5.3.2 Interface d’authentification

La figure ci-dessous représente la page d’authentification de l’administrateur. En effet, L’au-

thentification est la première tâche qu’un administrateur doit effectuer pour accéder au menu
administrateur approprié. Dans le cas ou il saisit des informations erronées un message d’erreur
lui sera affiché à fin de corriger les informations : son nom d’utilisateur ou mot de passe.

41
 Figure 5.12 – Interface d’accueil

Figure 5.13 – Login de l’application

42
5.3.3 Tableau de Bord

L’interface ci-dessous présente les statistiques des Factures selon l’état de paiement paye ou non
paye ou partiellemnt paye.

Figure 5.14 – Interface des Statistique de l’application

5.3.4 Les Produits

Cette interface permet à l’administrateur de l’application d’ajouter,modifier ou supprimer un

nouveau produit.

43
 Figure 5.15 – L’ajout des produits

Figure 5.16 – Ajout des produit et generation automatique de TVA

Les produits que nous avons inclus ont déjà été intégrés, et en ce qui concerne la Taxe sur la
Valeur Ajoutée (TVA), elle peut être calculée de manière automatique.

44
Figure 5.17 – la modification des produits

Figure 5.18 – La suppression des produits

45
 Figure 5.19 – Parametre des produits

5.3.5 Les Factures

Figure 5.20 – La Liste des factures

Cette interface nous présente la liste des listes de facture ainsi les différents opérations que
l’admin peut faire telles que l’ajout, la modification, la suppression des factures.

46
 Figure 5.21 – Exportation de la facture en XML

Cet image represente le code en xml pour exporter une facture.

Figure 5.22 – Interface pour exporter une facture

Cette interface permet aux utilisateurs de sélectionner une facture à exporter. L’utilisateur peut
choisir le format pdf de fichiers pour l’exportation , facilitant ainsi le partage et l’archivage des
factures.

47
 Figure 5.23 – Exportation d’une facture sous forme PDF

Cette interface illustre le processus d’exportation d’une facture au format PDF. L’utilisateur
peut spécifier les paramètres d’exportation, tels que la destination du fichier et les options de
mise en page, pour générer un document PDF de la facture.

48
 Figure 5.24 – Imprimer une facture sous forme PDF

Cette interface permet aux utilisateurs d’imprimer une facture en format PDF. L’utilisateur peut
prévisualiser la facture, ajuster les paramètres d’impression et envoyer le document directement
à l’imprimante pour obtenir une copie physique de la facture.

49
 Figure 5.25 – La facture Payee

Cette interface montre une facture marquée comme payée dans le système de gestion des factures.
Elle présente les détails de la transaction, y compris les informations du client, les services
rendus, le montant total, et la confirmation de paiement. En indiquant que la facture est payée,
l’interface assure une gestion claire et transparente des paiements, facilitant le suivi financier et
la comptabilité pour l’entreprise.

Figure 5.26 – La facture impayee

Cette interface représente une facture qui n’a pas encore été payée. Le montant total de la facture

50
reste dû, comme indiqué par le statut "Impayée". Cela peut être dû à diverses raisons, telles que
le retard de paiement du client ou des problèmes financiers de l’entreprise cliente.

Figure 5.27 – La facture partiellement payee

Cette Interface la facture est partiellement payée, ce qui signifie qu’une partie du montant total
a été réglée, mais qu’il reste encore un solde impayé. Le statut "Partiellement Payée" indique
que le paiement partiel a été effectué, et le montant restant dû est spécifié sur la facture.

5.3.6 Interfaces Utilisateurs

51
 Figure 5.28 – l’ajout des users selon leur roles

Cette interface l’administrateur est présenté avec un formulaire permettant d’ajouter de nou-
veaux utilisateurs à l’application. Le formulaire inclut des champs pour saisir le nom, l’adresse
e-mail et le rôle de l’utilisateur. Il offre également la possibilité de définir les autorisations spéci-
fiques associées à chaque rôle, ce qui permet à l’administrateur de contrôler l’accès des utilisateurs
à différentes fonctionnalités de l’application.

Figure 5.29 – la liste des utilisateurs

Cette interface affiche une liste des utilisateurs du système de gestion des factutres, avec des
informations comme le nom, l’adresse e-mail, le rôle (administrateur ou client), et le statut du
compte (actif ou inactif). Elle permet aux administrateurs de gérer les utilisateurs, d’ajouter de
nouveaux comptes, de modifier des informations, ou de supprimer des utilisateurs, centralisant
ainsi toutes les données pour une gestion efficace et sécurisée.

52
5.3.7 Les Roles

Figure 5.30 – Ajouter des roles

Figure 5.31 – la modifications des roles

Figure 5.32 – les informations sur les roles

53
 Figure 5.33 – la liste des roles

Cette liste permet à l’administrateur de visualiser rapidement tous les utilisateurs et de filtrer les
résultats par rôle ou par d’autres critères pertinents. De plus, il offre des options pour modifier ou
supprimer les utilisateurs existants, offrant ainsi un contrôle total sur la gestion des utilisateurs
de l’application.

5.3.8 Les Permissions

Figure 5.34 – la liste des permissions

A partir de cet interfaces les différentes permissions disponibles dans l’application sont affichées,

54
permettant aux administrateurs de voir rapidement les autorisations accordées à chaque rôle
d’utilisateur.

Figure 5.35 – L’Ajout de permission

Cette inteface les administrateurs peuvent ajouter de nouvelles permissions en spécifiant un nom
de permission et une brève description, offrant ainsi un moyen simple de personnaliser les auto-
risations pour répondre aux besoins spécifiques de l’application.

5.3.9 Notifications

Figure 5.36 – Notifications de l’application

Dans cette interface des notifications de l’application, les utilisateurs peuvent voir une liste claire

55
et organisée des différentes notifications qu’ils ont reçues. Chaque notification peut être accom-
pagnée d’un message informatif ou d’une action à prendre, offrant ainsi une vue d’ensemble
pratique des événements importants ou des mises à jour dans l’application.

5.3.10 Rapport Financière

Figure 5.37 – Rapport Financière

Dans cette interface les utilisateurs peuvent visualiser un rapport financier détaillé présentant
diverses données telles que les revenus, les dépenses, les bénéfices et d’autres indicateurs finan-
ciers clés, permettant ainsi une analyse approfondie de la santé financière de l’entreprise.

56
 Figure 5.38 – Chercher appartient du type de facture et la date

Cette interface les utilisateurs ont la possibilité de rechercher des données spécifiques dans le
rapport financier en fonction du type de facture et de la date, offrant ainsi une fonctionnalité de
filtrage précise pour cibler les informations pertinentes.

Figure 5.39 – Chercher appartir du numero de la facture

Cette interface les utilisateurs peuvent également effectuer une recherche dans le rapport financier
en saisissant simplement le numéro de la facture, ce qui leur permet de trouver rapidement des
informations spécifiques sur une transaction particulière.

57
5.4 Conclusion

Dans ce chapitre final, nous avons abordé l’environnement matériel et logiciel de l’application,
mettant en lumière l’utilisation du framework Laravel version 10. Nous avons compilé dans la
section de démonstration plusieurs captures d’écran de l’application développée, offrant ainsi une
perspective visuelle de son fonctionnement.

58
Conclusion Générale

Le projet de gestion des factures offre de nouvelles perspectives pour les entreprises en termes
d’organisation du travail et de qualité de service. Cette étude met en évidence que la transition
vers la gestion électronique des documents, notamment des factures papier, nécessite des ajuste-
ments dans les processus et procédures des entreprises. Il est ainsi primordial de pouvoir gérer
efficacement ces documents pour garantir une nouvelle manière de travailler et d’atteindre des
rendements améliorés.

Les résultats de cette étude sont bénéfiques tant pour les entreprises que pour les professionnels
des technologies de l’information et de la communication (TIC). Ces derniers disposent désormais
d’un outil pour répondre à l’une de leurs principales préoccupations, à savoir la question du scan
dans un environnement web.

En conclusion, il apparaît que la gestion des scanners reste d’actualité et que plusieurs solutions
ont été proposées pour sa mise en œuvre. Malgré quelques défis rencontrés, le thème de cette
étude offre l’avantage d’apporter aux entreprises une solution de gestion des documents axée
sur la réduction de l’utilisation du papier et capable de s’intégrer aisément dans des solutions
existantes, telles que l’utilisation d’un service web.

59
Webographie

1. Installation et configuration de Tesseract logiciel de reconnaissance de caractère

URL :https://packagist.org/packages/thiagoalessio/tesseracto cr
2. Installation et configuration de composer
URL :https://getcomposer.org/download/
3. Installation et Documentation de laravel :
URL :https://laravel.com/docs/11.x/installation
4. configuration de laravel :
URL :https://laravel.com
5. Installation et utilisation pour construire les diagramme :
URL :https://astah.net/downloads/
6. Instalation et configuration des diagramme :
URL :https://staruml.io/download/
7. Installation et configuration de git
URL :https://git-scm.com/book/en/v2/Getting-Started-Installing-Git
8. Installation et configuration de la base de donnees
URL :https://www.apachefriends.org/fr/index.html
9. installation et configuration par bootstrap
URL :https://getbootstrap.com
10. Installation des icons
URL :https://www.flaticon.com
11. le soutien de le projet
URL :https://chatgpt.com/?temporary-chat=true

60
12. Installation et configuration de flutter pour application mobile
URL :https://docs.flutter.dev/get-started/install
13. Organisation de le projet
URL :github.com
14. lucid app pour creer diagrame
URL :https://lucid.app

61