Vous êtes sur la page 1sur 29

Sommaire

Introduction générale...............................................................................................................1

Chapitre1 : présentation de l’organisme d’accueil et étude préalable.................................2

Introduction...........................................................................................................................3

1. Présentation générale.....................................................................................................3

1.1 Présentation de l’aéroport international Habib Bourguiba..............................3

1.2 Présentation de la société TAV..............................................................................4

1.3 TAV Information Technologies.............................................................................5

2. Contexte du stage...........................................................................................................6

3. Notions théoriques.........................................................................................................6

3.1 Ionic 4.......................................................................................................................6

3.2 Firebase....................................................................................................................7

3.3 HTML......................................................................................................................8

3.4 Css............................................................................................................................8

Conclusion..............................................................................................................................8

Chapitre2 : Spécification des besoins et modélisation de la solution...................................9

Introduction.........................................................................................................................10

1. Présentation du projet.................................................................................................10

2. Les différentes tâches effectuées.................................................................................10

2.1 Besoins fonctionnels..............................................................................................10

2.2 Besoins non fonctionnels......................................................................................10

2.3 Modélisation de la solution..................................................................................10

2.3.1 Extractions des différentes entités...............................................................11

2.3.2 Extractions des attributs des différentes entités.........................................11

2.3.3 Présentation du modèle entité association de la base de données.............12


2.3.4 Diagramme de cas d’utilisation....................................................................13

Conclusion............................................................................................................................13

Chapitre 3 : Réalisation et tests.............................................................................................14

Introduction.........................................................................................................................15

1. Environnement logiciel................................................................................................15

2. Environnement matériel..............................................................................................15

3. Interfaces réalisées.......................................................................................................16

4. Tests et validation........................................................................................................19

Conclusion............................................................................................................................22

Conclusion générale................................................................................................................23

Webographie...........................................................................................................................24
Liste des figures

Figure 1: Modèle entité association de la base de données..................................................12


Figure 2:Diagramme de cas d’utilisation..............................................................................13
Figure 3:Page login.................................................................................................................16
Figure 4:Page d'accueil...........................................................................................................17
Figure 5:Page d'ajout.............................................................................................................17
Figure 6:Type de stage............................................................................................................18
Figure 7:L'etablissement........................................................................................................18
Figure 8:Exemple de coordonnées de stagiaire....................................................................19
Figure 9:La recherche............................................................................................................20
Figure 10:La suppression.......................................................................................................20
Figure 11:Tableau de la liste des stagiaires..........................................................................21
Figure 12:Tableau des Types de stage..................................................................................21
Figure 13:Tableau des Etablissements d’étude des stagiaires............................................22
Introduction
générale

Introduction générale

Durant cette deuxième année de Licence Informatique, effectuée à l’institut


supérieur des études technologiques de Mahdia, il nous a été demandé de nous
intégrer à l’entreprise de notre choix, afin de compléter notre formation par une mise
en pratique de nos acquis. J’ai pour ma part, après de multiples recherches, choisi de
réaliser mon stage au « TAV aéroport ». Il s'est déroulé du 14 janvier au 09 février
2019, sur une période d’un mois.

Une première partie de ce rapport présente les conditions dans lesquelles j'ai acquis ma
deuxième expérience professionnelle dans l'informatique : présentation de la société
l’organisme d’accueil, historique, domaine d’interventions.

La deuxième partie décrit l’environnement de travail matériel (pc portable) et logiciel


(Visual Studio Code), les langages utilisés (Ionic 4 « HTML, CSS, JavaScript ») et les
différents choix de conceptions pris au cours du développement de l'application.

La dernière partie sera dédiée au bilan du projet, et à un possible perspectif


d'évolution, sur un point de vue aussi bien technique que personnel.

En dernier lieu, l’objectif de ce stage est de faire une intervention pratique qui m’a
permis d’appliquer mes connaissances scientifiques et techniques relatives au domaine
de l’informatique, multimédia et développement web, et de tester mes facultés
d’analyse et de synthèse.

1|Page
Chapitre1 : présentation de
l’organisme d’accueil et étude
préalable

2|Page
Chapitre1 : présentation de l’organisme d’accueil et étude
préalable

Introduction 

Dans ce chapitre, nous allons présenter en premier lieu la société dans laquelle nous avons
effectué notre sujet de travail proposé tout en expliquant ses objectifs ainsi les fonctionnalités
nécessaires pour le réaliser.

1. Présentation générale

1.1 Présentation de l’aéroport international Habib Bourguiba 

L’aéroport international de Monastir Habib Bourguiba (code AITA : MIR), situé à huit
kilomètres à l’ouest de Monastir, sur le territoire de la station balnéaire de « Skanés ». Crée en
1966, il n’avait qu’un simple aérodrome et une Piste de taille réduite, plus tard et à cause de la
croissance de l’activité Touristique, l’aéroport de Monastir connaît une extension dans tous
les services, actuellement il comprend :

 Une aérogare passagers d’une superficie de : 2987m² et d’une capacité de 300 000
passagers /ans.
 Une piste d’environ 3 km de long et 41m de largeur.
 Un air de stationnement d’une surface de 115 000 m² et pouvant contenir 25 avions de
différents types.
 Une aérogare de passagers qui contient un hall public et une partie sous douane (salle
d’embarquement, salle d’arrivée….).
 Un bloc technique (unité électricité bâtiment, unité balisage et production d’énergie,
salle de radar, etc.…).
 Un tour de contrôle.
 Une caserne de sécurité, d’incendie et de sauvetage (sis).
 Un bloc de génie civil.
 Salle d’embarquement dont la superficie est de : 1800m².
 12 portes d’embarquement.
 46 Comptoirs d’enregistrement.
 04 Tapis roulants.
 Parking voitures.

3|Page
Chapitre1 : présentation de l’organisme d’accueil et étude
préalable

Aujourd’hui, cet aéroport est classé second dans le pays après Tunis Carthage et le 4éme en
Afrique, ce classement explique l’importance de son rôle dans le transport aérien tunisien et
notamment en raison de l’expansion touristique de la région sahélienne.
Comme tous les aéroports tunisiens, l’aéroport est à l’origine géré par l’office de l’aviation
civile et des aéroports (OACA) 2010.

Toutefois, dès janvier 2008, il est Passé sous la gestion du consortium turc TAV Aéroport
Holding pour une période de 40 ans, dans le cadre de la concession de futur aéroport
international d’ENFIDHA également accordé au même groupe.

1.2 Présentation de la société TAV 

Etablie en 1997 par les groupes « Tepe » et « Akfen », la société turque TAV Aéroport
Holding est devenue une marque internationale avec l’augmentation du volume d’activités et
les projets qu’elle mènent à l’étranger notamment en matière de construction et de gestion
d’aéroports.

D’ailleurs, TAV a remporté au mois d’avril 2007 l’appel d’offre relatif à la concession
concernant la construction et l'exploitation de l'aéroport d'Enfidha et l'exploitation de
l'aéroport de Monastir. Juste à titre indicatif : les investissements pour la réalisation de la
première phase de construction du nouvel aéroport sont estimés à 660 millions de dinars.

Revenons aux débuts de l'opérateur TAV: c’est pendant l’appel d’offres de la construction du
terminal international de l’aéroport Atatürk d’Istanbul en 1997 que TAV a vu le jour. Le
projet de cet aéroport est devenu l’un des premiers projets de gestion d’aéroport réalisé par le
modèle «BOT (Build-Operate-Transfer), (construis-gère-cède)».

En 2006, et avec une réorganisation, TAV a regroupé ses services de gestion et de


construction sous «TAV Airports Holding» et «TAV Constructions».
Aujourd’hui, TAV s’est chargé de gestions des aéroports internationaux d’Istanbul Atatürk,
d’Ankara Esenboga, du terminal international d’Izmir Adnan Menderes en Turquie, de
Tbilissi en Géorgie, d’Enfidha et de Monastir en Tunisie.

4|Page
11.000 personnes travaillent pour TAV qui est composé de 11 différentes entreprises : TAV
Istanbul, TAV Izmir, TAV Anatolia, TAV Georgia, Havas, BTA, ATU, TAV Operations, 
TAV IT et TAV Security.
Chapitre1 : présentation de l’organisme d’accueil et étude
préalable

TAV assure par ailleurs, les activités aux branches complémentaires de l’opération d’aéroport
comme services au sol, services de gestion, Duty free, restaurations, informatiques et services
de sécurité. 27 millions de passagers bénéficient des services de TAV, pour 285.000 vols de
300 compagnies aériennes. 

1.3 TAV Information Technologies

TAV IT est un fournisseur technologique principal et une société d’intégration de système,


spécialisée dans l’aviation, qui livre des systèmes d’aéroport clés en main et des solutions
d’infrastructure pour des partis divers dans des aéroports, y compris des autorités portuaires,
des compagnies aériennes et des sociétés de traitement moulues.

Les points clés qui différencient TAV ce sont fortement consacres des experts d’affaire ayant
profondément la connaissance d’affaire d’aéroport et des ingénieurs très doués utilisant des
technologies hautes de gamme.

TAV c’est le produit et le portefeuille de services consiste en :

 Produits :

- FIDS: flight information display Systems.


- RMS : ressource management Systèmes.
- IB: information broker.
- IAYA: parser.
- VIP/CIP : réservation suite (VCRS).
- AODB : air port opérationnel data bases.
- ITMS : IT services management.

 Services :

- Conseil en gestion d’exigences.


- Système d’exploitation, stockage de données et conseil de base de données.
- Conseil de systèmes d’aéroport spécial.
- IT entretient le conseil en gestion.
- Aéroport CDM conseil.
- Intégration de système de maitre.
- ITIL conseil pour aéroports.
- ERP conseil pour aéroports.

6|Page
Chapitre1 : présentation de l’organisme d’accueil et étude
préalable

2. Contexte du stage 

Dans l’objectif de maitriser et approfondir nos connaissances déjà acquises, la société TAV
nous a accueillis dans ces locaux.

Elle nous a proposé comme sujet de suivre des formations sur Ionic4 (IOS, Android), Firebase
« Firestore » (no SQL) et approfondir les connaissances dans le développement mobile.

Les formations consistent à connaitre les différentes fonctionnalités de ces outils, bien
maitrisés ces connaissances à l’aide des exemples et des travaux pratiques.

La société TAV a proposé comme sujet de stage : « La création d’une application de
gestion de stagiaires ».

3. Notions théoriques

3.1 Ionic 4 

Ionic Framework est une boîte à outils d'interface utilisateur open source permettant de créer
des applications de bureau et mobiles de haute qualité utilisant des technologies Web (HTML,
CSS et JavaScript).

Ionic Framework est axé sur l'expérience utilisateur frontale ou sur l'interaction de l'interface
utilisateur d'une application (contrôles, interactions, gestes, animations). Il est facile à
apprendre et s'intègre parfaitement à d'autres bibliothèques ou frameworks, tels que Angular,
ou peut être utilisé de manière autonome, sans framework frontal, à l'aide d'un simple script
include.

7|Page
Chapitre1 : présentation de l’organisme d’accueil et étude
préalable

Les principaux objectifs d’ionic4 sont :

 Multiplateforme :

Créez et déployez des applications fonctionnant sur plusieurs plates-formes, telles que iOS,
Android, un ordinateur de bureau et le Web en tant qu'application Web progressive - le tout
avec une base de code. Écrivez une fois, exécutez partout.

 Basé sur des standards Web :

Ionic Framework est construit sur des bases fiables, technologies web standardisées: HTML,
CSS et JavaScript, à l’aide des API Web modernes.

 Beau design :

Propre, simple et fonctionnel. Ionic Framework est conçu pour fonctionner et s'afficher


parfaitement sur toutes les plates-formes. 

 Simplicité :

Ionic Framework est construit dans une optique de simplicité, de sorte que la création
d'applications Ionic est agréable, facile à apprendre et accessible à quiconque ayant des
compétences en développement Web.

 Licence :

Ionic Framework est un projet libre et open source, publié sous la licence permise MIT . 

3.2 Firebase 

La base de données en temps réel Firebase est une base de données hébergée dans le
cloud. Les données sont stockées au format JSON et synchronisées en temps réel sur chaque
client connecté. Lorsque vous créez des applications multi plates-formes avec nos kits de
développement logiciel (SDK) iOS, Android et JavaScript, tous vos clients partagent une
instance de base de données en temps réel et reçoivent automatiquement les mises à jour avec
les données les plus récentes.

8|Page
Chapitre1 : présentation de l’organisme d’accueil et étude
préalable

3.3 HTML 

L'HTML est un langage informatique utilisé sur l'internet. Ce langage est utilisé pour créer
des pages web. L'acronyme signifie « HyperText Markup Language », ce qui signifie en
français « langage de balisage d'hypertexte ». Cette signification porte bien son nom
puisqu'effectivement ce langage permet de réaliser de l'hypertexte à base d'une structure de
balisage.

3.4 Css

Les feuilles de styles (en anglais « Cascading Style Sheets », abrégé CSS) sont un langage
qui permet de gérer la présentation d’une page web.

Le langage CSS est une recommandation du World Wide Web Consortium (W3C), au même
titre que HTML ou XML.

Conclusion

A travers ce chapitre, nous avons présenté le cadre du projet, identifié à atteindre et le travail à
faire.

9|Page
Chapitre2 : Spécification des
besoins et modélisation de la
solution

10 | P a g e
Chapitre2 : Spécification des besoins et modélisation de la
solution

Introduction

Durant ce mois de stage et à travers l’assistance de mon encadreur au sein de la société


TAV, j'ai pu élaborer mon projet qui consiste à créer une application mobile. « La gestion de
stagiaires ».

1. Présentation du projet 

Mon projet consiste à la création d’une application mobile qui sert à la gestion des stagiaires
de la société TAV, en utilisant l’Ionic comme outil de projet, sous la demande de cette
dernière par manque d’information sur ce domaine.

2. Les différentes tâches effectuées 

2.1 Besoins fonctionnels

Avant la création de l’application il faut définir quelques besoins fonctionnels qui sont
généralement :
 Partie pour les administrateurs.
 Les statistiques de stagiaires.

2.2 Besoins non fonctionnels

Les besoins non fonctionnels décrivent toutes les contraintes auxquelles est soumis le système
pour sa réalisation et son bon fonctionnement

 Ergonomie et souplesse
 Rapidité
 Efficacité

2.3 Modélisation de la solution

Nous illustrons, dans la suite, une structuration de ce chapitre dans le cas d’un stage ayant
pour objectif de développer une application qui gère une base de données.

11 | P a g e
2.3.
Chapitre2 : Spécification des besoins et modélisation de la
solution

2.3.1 Extractions des différentes entités 

Les différentes entités du modèle :

 Stagiaires
 Etablissements
 Types

2.3.2 Extractions des attributs des différentes entités 

Les différents attributs classés par entités :

 Stagiaires
- Id Stagiaire : clé primaire
- Nom Stagiaire
- Prénom
- Age
- Tel
- Date Début
- Date Fin
- Affected
- Attestation
- Année
- Id Etab
- Id Type

 Etablissements
- Id Etab : clé primaire
- Nom Etab

 Types
- Id Type : clé primaire
- Nom Type

13 | P a g e
Chapitre2 : Spécification des besoins et modélisation de la
solution

2.3.3 Présentation du modèle entité association de la base de


données 

Figure 1: Modèle entité association de la base de données

14 | P a g e
Chapitre2 : Spécification des besoins et modélisation de la
solution

2.3.4 Diagramme de cas d’utilisation

Figure 2:Diagramme de cas d’utilisation

Conclusion

Dans ce chapitre, nous avons étudié les besoins fonctionnels et non fonctionnels qui sont
indispensables pour mieux faciliter le travail à réaliser.

15 | P a g e
Chapitre 3 : Réalisation et tests

16 | P a g e
Chapitre3 : Réalisation et tests

Introduction

Après avoir placé notre projet dans son cadre général, une étape indispensable serait de
présenter l’environnement sur lequel se base l’application.

Dans ce chapitre, nous allons présenter les interfaces de notre application gestion de stagiaires

1. Environnement logiciel 

Les langages utilisés :

 Ionic 4 (HTML, CSS, JavaScript)

Les logiciels utilisés :

 Visual Studio Code


 Firebase (Firestore)

2. Environnement matériel 

J’ai réalisé ce projet sur un PC portable AZUS i3 dont les Caractéristiques sont les suivantes :
 Nom de l’appareil : DESKTOP-465Q3QJ
 Processeur : Intel® pentium® i3-5005U CPU@2.00 GHZ.
 Mémoire Ram installée : 4,00 Go
 Type de système : système d’exploitation 64 bits

17 | P a g e
Chapitre3 : Réalisation et tests

3. Interfaces réalisées 

Dans cette partie on va exposer les interfaces pour montrer les fonctionnalités offertes par
notre application :

Figure 3:Page login

18 | P a g e
Chapitre3 : Réalisation et tests

Figure 4:Page d'accueil

Figure 5:Page d'ajout

19 | P a g e
Chapitre3 : Réalisation et tests

Figure 6:Type de stage

Figure 7:L'etablissement

20 | P a g e
Chapitre3 : Réalisation et tests

4. Tests et validation 

Figure 8:Exemple de coordonnées de stagiaire

A ce stade de cette application, il suffit d’écrire l’année de déroulement de stage  une liste
de stagiaires qui ont passé leurs stages pendant cette année s’affiche.

21 | P a g e
Chapitre3 : Réalisation et tests

Figure 9:La recherche

Figure 10:La suppression

22 | P a g e
Chapitre3 : Réalisation et tests

Firebase :
Firebase permet de nous donner des tableaux illustratifs qui présent un état des données saisie
dans l’Ionic4

Figure 11:Tableau de la liste des stagiaires

Figure 12:Tableau des Types de stage

23 | P a g e
Chapitre3 : Réalisation et tests

Figure 13:Tableau des Etablissements d’étude des stagiaires

Conclusion

Dans le chapitre réalisation nous somme appelé à présenter les interfaces réalisés dans notre
application pour clarifier les étapes d’utilisation de notre application avec ses deux parties,
statique et dynamique.

24 | P a g e
Conclusion
générale

Conclusion générale

L’environnement technique de ce stage nous a permis de découvrir des outils très


intéressants et qui semblent demandés sur le marché du travail.

Ce projet consiste à concevoir une application gestions de stagiaires.

Au cours de ce rapport, nous avons présenté les différentes étapes de la conception et


la réalisation de notre application.

Pour concevoir ce travail j’ai présenté premièrement le cadre de ce projet, puis j’ai
analysé la présentation de la société.

En second, j’ai montré l’environnement de travail (logiciel et matériel). Finalement,


j’ai traité toutes les phases nécessaires à la réalisation de cette application, et dans cette
phase j’ai appris à mieux manipuler les langages HTML et css j’ai approfondi mes
connaissances sur le langage Java.

Par ailleurs, l’objectif principal de ce projet était la découverte du monde de


l’entreprise et dans cette optique, ce projet a totalement répondus à mes attentes. Des
améliorations pourraient aussi être apportées à ce site par exemple dans le cas d’une
réelle utilisation commerciale du site.

Enfin, la réalisation de ce projet de travail sur une durée limitée est un bon
entraînement pour ce futur métier.

25 | P a g e
Webographie

Webographie
[1] https://www.youtube.com/watch?v=H20l9ofyR54&t=340s [How to Create a Simple Ionic
4 App with Firebase and AngularFire].
[2] https://www.youtube.com/watch?v=OCV2W2DZDSI&list=PLYxzS__5yYQnpK36-
GJjm7IEAuHR7IExa [#0: [Kickstart] Creating a Social Media App - Ionic + Firebase +
Angular + Uploadcare].
[3] https://www.youtube.com/watch?v=3c1f0MsO3gQ&list=PLYxzS__5yYQnpK36-
GJjm7IEAuHR7IExa&index=2 [#1: Setting up | Ionic 4 + Firebase + Uploadcare].
[4] https://www.youtube.com/watch?v=Q8zcieAWn3g&list=PLYxzS__5yYQnpK36-
GJjm7IEAuHR7IExa&index=3 [#2: Firebase + Ionic 4 Login and Registration].
[5]https://www.youtube.com/watch?v=xbIhn45Mjgg&index=4&list=PLYxzS__5yYQnpK36-
GJjm7IEAuHR7IExa [#3: Ionic 4 + Firebase + Angular: Tabbed Navigation and File upload
with Uploadcare].
[6]https://www.youtube.com/watch?
v=W5GD6gwYC18&index=5&list=PLYxzS__5yYQnpK36-GJjm7IEAuHR7IExa[#4: Data
Handling of Cloud Firestore in Ionic 4 + Angular + Firebase + Uploadcare].
[7] https://www.youtube.com/watch?v=HXEnjsHpSTc&list=PLYxzS__5yYQnpK36-
GJjm7IEAuHR7IExa&index=6 [#5: Ionic 4 + Firebase + Angular: Profile page].
[8] https://www.youtube.com/watch?v=iI2uGL0jlVY&list=PLYxzS__5yYQnpK36-
GJjm7IEAuHR7IExa&index=7 [#6: Ionic 4 + Firebase + Angular: Post Page].
[9] https://www.youtube.com/watch?v=z3pDqnuyzZ4&t=1186s [Building à Basic Ionic 4
Login Flow with Angular Router].

[10] https://ionicframework.com/ [Ionic Framework].


[11] https://firebase.google.com/ [Firebase].

26 | P a g e