Ministère de l’Enseignement Supérieur

et de la Recherche Scientifique
  
Université de Carthage
  
Institut National des Sciences
Appliquées et de Technologie

Rapport de Stage Obligatoire d’Eté

Filière : Génie Logiciel

Niveau : 3ième Année

Sujet :

Application Web de Suivi des factures

Réalisé par : Mohamed Karem JOUINI

Entreprise d’accueil :

Siège de la Banque de Tunisie et des Emirats(BTE)

Année Universitaire : 2018/2019

Direction de la Vie Universitaire et des Relations avec l’Environnement / Sept. 2014

 Ministère de l’Enseignement Supérieur
et de la Recherche Scientifique
  
Université de Carthage
  
Institut National des Sciences
Appliquées et de Technologie

Rapport de Stage Obligatoire d’Eté

Filière : Génie Logiciel

Niveau : 3ième Année

Sujet :

Application Web de Suivi des factures

Réalisé par : Mohamed Karem JOUINI

Entreprise d’accueil :

Siège de la Banque de Tunisie et des Emirats(BTE)

Responsable à l’entreprise: Avis de la commission des stages

M.Sami Mhamdi

Année Universitaire : 2018/2019

Direction de la Vie Universitaire et des Relations avec l’Environnement / Sept. 2014

 1- Introduction

Dans le cadre de mes études à l’INSAT, j'ai souhaité réalisé mon stage dans une entreprise qui
soit en adéquation avec mon projet professionnel. J’ai choisi une banque parce que la mission qui
m’a été proposée correspondait avec mon projet de poursuite d’étude.

Etant moins à l’aise en développement d’applications, je me suis orienté vers une mission proposant
du développement Web. Cette mission m’a permis de mettre en avant mes compétences dans ce
domaine que j’affectionne, en contribuant à l’évolution d’un projet comme celui-ci.

Du 01/07/2019 au 31/07/2019, j’ai effectué un stage d’été au sein de l’entreprise Banque de la

Tunisie et des Emirats (Siège situé Rue Mohamed BADRA, 1002 Tunis). Au cours, j’ai pu
m’intéresser au fonctionnement de l’application logistique déjà mise en place dans l’entreprise qui
permet la gestion des factures, fournisseurs, bons de commande, dépenses et alimentation de la
caisse.
A cette occasion, le besoin de l’entreprise était de contrôler le flux monétaire des factures,
chèques… le comptabiliser (calculer les dépenses) et de réaliser une inspection globale pour fournir
l’état global actuel.

À partir de ce besoin, l’objectif était de développer une application Web autonome et conviviale
qui permet d’automatiser la réalisation ces tâches.

Plus largement, ce stage a été l’opportunité pour moi d’obtenir l’expérience nécessaire, développer
mes connaissances sur le domaine du développement Web et d’améliorer mes compétences.

Au-delà d’enrichir mes connaissances professionnelles, ce stage m’a permis de comprendre dans
quelle mesure il m’a beaucoup apporté dans mon futur parcours professionnel.
En vue de rendre compte de manière fidèle et analytique le mois passé au sein de l’entreprise BTE,
il apparaît logique de présenter à titre préalable l’entreprise (2), puis d’envisager les objectifs visés
et le cahier de charges (3), Le journal du stage (4). Ensuite, il sera précisé les différentes missions
et tâches que j’ai pu effectuer au sein du l’entreprise (5). Enfin, la consolidation des acquis (6) et la
conclusion (7).

Direction de la Vie Universitaire et des Relations avec l’Environnement / Sept. 2014

 2- Présentation de l’entreprise d’accueil

2.1- Définition:

La Banque de Tunisie et des Emirats (BTE), anciennement Banque de Tunisie et des Emirats
d`Investissement (BTEI) a été crée en 1982 par une convention signée entre Abou Dhabi
Investment Authority (ADIA) et le gouvernement Tunisien.

La BTE est une société anonyme au capital de 90.000.000 dinars et dont le numéro de la
matricule fiscale est 015094B/A/M/000.

Immatriculée au registre de commerce ouvert au tribunal de première instance de Tunis sous le

N° B140831996 et dont le siège est au 5bis, Rue Mohamed BADRA, 1002 Tunis.

Au fil des années, elle a acquis un excellent positionnement parmi les banques de développement
et un portefeuille d’entreprises de premier plan.

2.2- Dates et chiffres clés:

 1982
Naissance de la BTE signature de la convention entre Abou Dhabi Investment Authority (ADIA)
et le gouvernement Tunisien.
 2004
Obtention de l’autorisation d’exercer en tant que banque universelle.
 2005
Inauguration des premières agences de la BTE.

2.3- Descriptif de l’activité de l’entreprise:

Depuis 2004 date d’obtention de l’autorisation d’exercer en tant que banque universelle, la BTE
a engagé un processus d’universalité.

A ce titre, son activité, limitée initialement au financement des entreprises, s’est étendue pour
toucher toutes les autres sphères du métier de la banque et notamment :

 La collecte des dépôts auprès de la clientèle quelque soient la forme et la durée. (Dépôt à
vue, Epargne, Dépôt à terme)

 L’octroi de toutes les formes de crédits (particuliers et entreprises).

 L’exercice des activités de change et de trading.
 La gestion de toutes les formes de moyens de paiement.

Direction de la Vie Universitaire et des Relations avec l’Environnement / Sept. 2014

2.4- Organigramme:

2.5- Le Taux d’encadrement:

Le projet réalisé a été sous la direction du directeur informatique : Mme Nozha Chennoufi et
sous l’encadrement des ingénieurs informatiques : Mr Sami Mhamdi et Mr Mohamed Ali Belhssine.

Au début, la présentation du sujet du stage a été réalisé par le directeur informatique.

Ensuite, la présentation et l’explication du cahier de charges a été effectué par Mr Mohamed Ali
Belhassine.
Puis, les détails de fonctionnement des services bancaires et l’abstraction des besoins réels a été
fait par Mr Sami Mhamdi.

Durant toute la durée du stage, l’encadrement et le suivi journalier de la réalisation des tâches
demandées a été assuré par Mr Sami Mhamdi.

3- Objectifs visés et cahier de charges

3.1 Objectifs visées :

La Banque de la Tunisie et des Emirats avait un système déjà existant pour la gestion des factures,
des fournisseurs, bons de commande, alimentation et dépenses de la caisse mais aucune structure
présente pour le suivi, la traçabilité, la journalisation et le calcul des statistiques et la
comptabilisation.

Direction de la Vie Universitaire et des Relations avec l’Environnement / Sept. 2014

Cette lacune a engendré la naissance d’un besoin de réalisation d’une application Web qui permet
d’ajouter le suivi au système bancaire.

Objectifs Visées par l’application Web :

- Le suivi des factures (réglées, validées et non validées), factures par fournisseurs
- Estimation des fournisseurs les plus sollicités
- Calcul de statistiques globales tels que : factures par fournisseur et modes de paiement
- Calcul de dépenses trimestrielles par fournisseur
- Calcul de dépenses totales d’une année choisie, Dépenses totales de 3 ans

3.2- Cahier de charges :

3.2.1- Description de l’existant :

La Banque de la Tunisie et des Emirats possède une application déjà fonctionnelle qui s’occupe
de toute la logistique de l’entreprise.

L’application logistique contient les modules suivants :

 Gestion des factures (Figure 1)

 Gestion des fournisseurs
 Bon de commande
 Règlement des factures (Figure 2)
 Alimentation des caisses (Figure 3)
 Dépenses des caisses (Figure 4)

Figure 1 : Interface de gestion de factures Figure 2 : Interface de règlement de factures

Direction de la Vie Universitaire et des Relations avec l’Environnement / Sept. 2014

 Figure 3 : Interface d’alimentation de la caisse Figure 4 : Interface de dépenses de la caisse

3.2.1- Besoins :

Le besoin est : La création d’une application Web pour analyser les statistiques de l’application
logistique.

L’application doit contenir les fonctionnalités suivantes :

 Tableau de bord pour faciliter la compréhension (par mois pendant une période d’une
année) qui contient des camemberts, courbes et histogrammes détaillés.
 Des graphiques plus détaillées par rubrique :
o Factures réglées et comptabilisées
o Factures validées et non réglées
o Facture réglées par virement, chèque ou prélèvement
o Facture par fournisseur
o Dépenses totales d’une année choisie
o Dépenses totales de 3 ans
o Dépenses par fournisseur
o Calcul de l’amortissement à une date donnée
o Statistiques modes de paiement

4- Journal de Stage :

Direction de la Vie Universitaire et des Relations avec l’Environnement / Sept. 2014

 Figure 5 : Diagramme de Gantt (Journal de Stage)

5- Travail Réalisé :

5.1- Technologies utilisées et outils utilisés:

5.1.1 : Technologies utilisées :

o Back-end: Spring Boot 2.1.5 -JEE.

o Bases de données: Oracle PL/SQL - MySQL.

o Front-end: Angular 2 (7.3.5)-JavaScript - TypeScript - HTML 5 – CSS 3 – BootStrap 4.

Direction de la Vie Universitaire et des Relations avec l’Environnement / Sept. 2014

5.1.2- Outils utilisés:

o JetBrains Intellij IDEA Ultimate 2019 (Spring Boot –JEE)

o Oracle 10g Express Edition (PL/SQL-MySQL)

o JetBrains WebStorm 2019(Angular – JavaScript …)

5.2- Déroulement du travail:

5.2.1- Conception du Back End:

5.2.1.1- Extraction de données :

Après avoir compris les besoins du cahier de charges, j’ai eu un accès à la base de données de

l’entreprise. La Base de données de l’entreprise est une base de données SQL énormément

volumineuse (de l’ordre de 20 000 enregistrements dans plusieurs tables chacune contient plus de

20 champs) et mise à jour plusieurs fois par jour.

Alors l’application Web, doit être conçue pour faire une connexion directe et synchrone pour

obtenir les données ou faire le calcul (sur le serveur de la banque) et retourner le résultat au front

end. Tout le calcul est fait avec le langage SQL et le résultat va être retourner dans le format

souhaité en utilisant le langage Java-JEE.

5.2.1.2- Description de la structure :

Le Back End de l’application contient trois contrôleurs ainsi que 3 services Web qui vont

effectuer les calculs. (Voir Figure 6).

-Service Web FactureService : s’occupe du calcul relatif aux factures.

-Service Web AmortissementService : s’occupe du calcul relatif aux amortissements.

-Service Web AuthentificationService : s’occupe de l’authentification et de l’enregistrement des

utilisateurs de l’application.

5.2.1.3- Diagramme de classes UML :

Direction de la Vie Universitaire et des Relations avec l’Environnement / Sept. 2014

 Figure 6 : Diagramme de classes UML du Back End

5.2.2- Conception du Front-End :

5.2.2.1- Description :

Le site web de l’application réalisé contient une interface simple contient une barre de

navigation pour faciliter la tâche des utilisateurs inexpérimentés dans l’entreprise.

Le principal problème rencontré est que les ordinateurs des membres de l’entreprise sont non

performants. Alors, la solution est de faire absolument tout le calcul dans le serveur de la banque

contenant les données puis le Back end retourne les données dans le format souhaité. Ces derniers

sont bien sûr beaucoup plus performants que les PC clients.

A la fin, le Front End se limite à l’affichage des résultats fournis par le Serveur(Back-End).

Direction de la Vie Universitaire et des Relations avec l’Environnement / Sept. 2014

 5.2.2.2- Fonctionnement de l’application :

5.2.2.2.1- Enregistrement/Authentification :

- L’utilisateur doit s’authentifier s’il a un compte ou s’enregistrer pour obtenir un.

Ceci se fait par le biais d’écrans d’authentification (Figure 7) ou d’enregistrement (Figure 8).

Figure 7 : Authentification à l’application

Figure 8 : Enregistrement à l’application

-Après l’authentification, l’utilisateur peut utiliser toutes les fonctionnalités de l’application.

5.2.2.2.2- Fonctionnalités :

- L’application comprend plusieurs fonctionnalités tels que :

 Tableau de bord (Figure 9)

Direction de la Vie Universitaire et des Relations avec l’Environnement / Sept. 2014

  Statistiques de factures immobilisables (Figure 10)

 Statistiques de factures non immobilisables (Figure 11)

 Statistiques de factures par fournisseurs (Figure 12)

 Amortissement des factures à une date donnée (Figure 13)

Figure 9 : Tableau de bord de l’application

Figure 10 : Exemple d’écran de détails des factures

Direction de la Vie Universitaire et des Relations avec l’Environnement / Sept. 2014

 Figure 11 : Statistiques de factures immobilisables

Figure 12 : Statistiques de facture non immobilisables

Direction de la Vie Universitaire et des Relations avec l’Environnement / Sept. 2014

 Figure 12 : Calcul des amortissements à une date donnée

5.3- Mise en production :

L’application réalisée est désormais en production dans la banque.

L’application est déployée sur un serveur local et accessible par les personnels de l’entreprise.

5.4- Valeur ajoutée :

L’application permet de faciliter les taches de suivi des factures, les calculs des statistiques

annuels et mensuels ainsi que d’assurer ma traçabilité pendant une période donnée.

Ceci facilite énormément les taches comptables ainsi que permettre de gagner beaucoup de temps

de calculs gaspillés.

Direction de la Vie Universitaire et des Relations avec l’Environnement / Sept. 2014

 6- Consolidation des acquis

Matière Cours enseignés Apport dans le stage

Bases de données -Le langage SQL - Ecriture des requêtes SQL

-Bases de données Oracle -Utilisation d’oracle.

JAVA - Connexion aux -Connexion à la base de

sources de données données de la banque.

Développement JEE - Spring JEE - Utilisation du langage

- Le modèle MVC Spring JEE pour le

développement du

Back End.

- Utilisation du modèle

MVC dans le Back

End et le Front End.

7- Conclusion :

Ce stage a été une expérience supplémentaire dans le métier du développement.

Il a été très formateur, il m'a permis d'élargir mon expérience en entreprise.
Les nombreuses personnes que j'ai rencontrées m'ont permis de confirmer la
vision que je m'étais faite les années précédentes, qui est le travail en équipe. J'ai
pu mettre en pratique mes connaissances en développement mais aussi
relationnelles.
Ce Stage m’a permis d’améliorer mes compétences dans le développement Web.
Ce stage d’été de la 1ere année est donc une très bonne occasion de confirmer
son projet professionnel et de cerner toutes les facettes du métier du
développement. Même si le stage a une durée d’un mois, je pense que c'est une
bonne expérience et un bon complément à cette année.

Direction de la Vie Universitaire et des Relations avec l’Environnement / Sept. 2014