Rapport pfev7

TABLE DES MATIERES :
…..
SITE WEB DYNAMIQUE : LOCATION DE VOITURE

Chapitre 1 : Introduction Générale
1. INTRODUCTION .......................................................................................................................................... 4
2. QU’EST-CE QUE LE COMMERCE ELECTRONIQUE : ................................................................................................. 4
2.1. Les points forts dans un fournisseur d’e-commerce : ..................................................................... 5
2.2. Problèmes Rencontrer par l’e-commerce :..................................................................................... 5
2.3. Le but qu’on doit atteindre : .......................................................................................................... 6
3. LES ASPECTS TECHNOLOGIQUES DU COMMERCE ELECTRONIQUE : ............................................................................ 6
3.1. L’accès : ......................................................................................................................................... 6
3.2. La transaction : .............................................................................................................................. 7
3.3. Le soutien ...................................................................................................................................... 7

Chapitre 2 : Phase d'analyse des besoins

1. BUT A ATTEINDRE :...................................................................................................................................... 8
2. DEFINITION DE LA MISSION : .......................................................................................................................... 8
3. OBJECTIF A ATTEINDRE : ............................................................................................................................... 9
4. CAHIER DE CHARGE :.................................................................................................................................... 9
5. CONCLUSION :............................................................................................................................................ 9

Chapitre 3 : Phase d'analyse et de Conception

1. INTRODUCTION :........................................................................................................................................10
FACULTE DES SCIENCES DE MONASTIR

2. PRESENTATION D’UML ...............................................................................................................................11
2.1. Définition d’UML : ........................................................................................................................11
2.2. Choix de la méthodologie : ...........................................................................................................12
2.3. Les diagrammes d’UML : ...............................................................................................................12
Diagrammes structurels ou diagrammes statiques (UML Structure) ...................................................................... 12
Diagrammes comportementaux ou diagrammes dynamiques (UML Behavior) ...................................................... 13
3. PHASE DE CONCEPTION : .............................................................................................................................13
3.1. Diagramme de cas d’utilisation : ...................................................................................................13
3.1.1. Côté Client : ............................................................................................................................................. 15
3.1.2. Côté Webmaster: .................................................................................................................................... 16
3.2. Diagrammes de séquence : ...........................................................................................................17
3.2.1. Côté Client : ............................................................................................................................................. 17
3.2.2. Côté Webmaster :.................................................................................................................................... 19
3.3. Diagramme de classes : ......................................................................................................................21
4. CONCLUSION ............................................................................................................................................25

Projet de fin d’étude 1
2010

Chapitre 4 : Langage et Outils de développement

1. PRESENTATION DU WEB : ............................................................................................................................26
1.1. Site web : ......................................................................................................................................26
1.2. Qu'est-ce qu'un site statique : ......................................................................................................26
1.3. Qu'est-ce qu'un site dynamique : .................................................................................................26
1.4. Comment choisir si une page est statique ou dynamique? ...........................................................27

1.5. Quels sont les avantages et les inconvénients des deux méthodes? .............................................27
1.6. Page web : ....................................................................................................................................27
1.7. Hyperlien ou lien hypertexte : ......................................................................................................27
1.8. Adresse Web ou URI (URL) : ..........................................................................................................27
1.9. Serveur Web : ...............................................................................................................................27
2. COMMENT CREER UNE APPLICATION WEB AVEC PHP/MYSQL …? .......................................................................28
2.1. Qu'est-ce que PHP ?......................................................................................................................29
2.2. Qu'est-ce que MySQL ? .................................................................................................................29
2.3. Le langage HTML : .........................................................................................................................29
2.4. Une feuille de style : .....................................................................................................................30
2.5. JavaScript : ...................................................................................................................................30
2.6. Le XML : ........................................................................................................................................30
3. LES OUTILS DE DEVELOPPEMENT : ..................................................................................................................31
3.1. XAMPP :........................................................................................................................................31
3.2. Adobe DreamWeaver CS3 : ...........................................................................................................31
3.3. Mozilla Firefox : ............................................................................................................................31
3.4. Adobe Fireworks :.........................................................................................................................31
3.5. Power AMC Designer : ..................................................................................................................32

Chapitre 5 : Réalisation du Projet

1. INTRODUCTION :........................................................................................................................................33
2. DESCRIPTION DE CYCLE DE VIE : .....................................................................................................................33

3. DEPLOIEMENT DE L’APPLICATION : .................................................................................................................34
4. SYSTEME DE GESTION DE BASE DE DONNEES......................................................................................................35
5. TRAVAIL REALISE : ......................................................................................................................................35
5.1. Coté Client (internaute) : ..............................................................................................................35
5.1.1. Page d’Accueil : ....................................................................................................................................... 35
5.1.2. La phase de réservation d’une voiture par des illustrations :.................................................................... 36
5.2. Coté Administrateur (Webmaster) : .............................................................................................42
5.2.1. Authentification de l’administrateur :...................................................................................................... 42
5.2.2. Page d’administration : ........................................................................................................................... 43
Conclusion……………………………………………………………………………………………………………………...4
4Annexe…………………………………………………………………………………………………………………………...4
5

2010

LISTE DES FIGURES :
…..

Figure 1: Quelle méthode pour passer de l’expression des besoins au code de l’application ? .......... 11
Figure 2 : Cas d’utilisation globale ................................................................................................. 14
Figure 3 : Cas d’utilisation coté client ............................................................................................. 15
Figure 4 : Cas d’utilisation coté administrateur .............................................................................. 16
Figure 5 : Diagramme de séquence pour la consultation de la page d'accueil. ................................. 17
Figure 6 : Diagramme de séquence de la réservation d’une voiture ................................................. 18
Figure 7 : Diagramme de séquence d'authentification de l'administrateur du site ........................... 19
Figure 8 : Diagramme de séquence d'ajout d'une voiture ............................................................... 20
Figure 9 : Diagramme de séquence de suppression d'une voiture .................................................... 20
Figure 10 : Diagramme de classe de l'agence de location de voiture en ligne .................................. 22
Figure 11: Modèle physique de données ........................................................................................ 24
Figure 12 : architecture client-serveur ............................................................................................ 28
Figure 13 : Diagramme de déploiement ......................................................................................... 35
Figure 14: Page d'accueil ............................................................................................................... 36
Figure 15 : Saisie des critères de la recherche ................................................................................. 37
Figure 16 : Les voitures disponibles pour la réservation .................................................................. 38
Figure 17 : Saisie des informations du client .................................................................................. 39
Figure 18 : Phase de paiement ....................................................................................................... 40
Figure 19 : Bon de Livraison ........................................................................................................... 41
Figure 20 : Page d’authentification ................................................................................................ 42
Figure 21 : Page d’Administration .................................................................................................. 43

2010

1

CHAPITRE
……………………………………………………………………………………………………………..

Introduction Générale

1. Introduction
Le Commerce électronique connaît une formidable croissance, aussi bien en nombre de sites

ouverts qu'en fréquentation de ces sites. Les responsables de ces sites vont avoir à faire face à

des choix cruciaux d'architecture et à répondre correctement à de multiples challenges.

En effet, pour connaître le succès, un site de commerce électronique doit d'être à la fois sûr,

accueillant et disponible, mais il doit également offrir un excellent temps de réponse et pouvoir

traiter correctement les pointes de trafic.

Le But de ce Chapitre « le commerce électronique » est de se familiariser avec la notion e-

commerce, ces nécessités, ces points, ainsi ces aspects technologie d'une part et avec les

caractéristiques spéciales d'un fournisseur de services commerce électronique (FSCE), et de

commerce électronique en Tunisie, d'une autre part.

2. Qu’est-ce que le commerce électronique :
Le commerce électronique est l’achat ou la vente de produits ou de services via un réseau

électronique à l’heure actuelle, le support le plus courant pour ce type de transaction est

l’Internet. Cependant pour remédier les attaques sur ce réseau, Il existe des moyens efficaces

2010

d’assurer la protection des données qu’une entreprise affiche surle Web. Les coupe-feu qui

bloquent l’accès à quiconque n’est pas autorisé à accéder à un site ou à une partie de celui-ci,

les méthodes de paiement électronique sécurisé, l’utilisation de messages chiffrés et encodés

dans le cas de clés publiques et privées ou de signatures et de certificats électroniques sont

autant d’outils qu’un fournisseur de solutions électroniques fiable saura mettre à la disposition

d'un entrepreneur.

2.1. Les points forts dans un fournisseur d’e-commerce :
De tous les environnements commerciaux, l'e-business est celui dans lequel les en reprises

ont le moins le droit à l’erreur.Le succès est directement lié au sentiment "d'expérience

positive" que l'utilisateur ou l'Internaute retirent sur un site à vocation commerciale.

Les points qu’on doit prendre au sérieux lors ou même avant l’ouverture de votre site de

commerce électronique sont :

 Un serveur doit être capable d'accueillir correctement x clients en http
pratiquement.

 Le fait d'offrir un temps de réponse qui passe de 7 à 8 secondes fait perdre 20% de
clients d’ou on doit offrir un temps de réponse qui ne dépassera pas les 6 secondes.

 On doit construire notre fournisseur de sorte à garantir que lors des pannes sur l'un
des serveurs sur un réseau entier, sur l'un des firewall ou sur l'un des accès réseau,

le site ne sera pas affecter ou trafiquer …

2.2. Problèmes Rencontrés par l’e-commerce :
Le problème du paiement est actuellement au centre de tous les débats consacrés au

commerce électronique. En effet, pas moins de 68% des internautes n’ayant jamais acheté en

ligne n'avouent leurs réticences à transmettre leurs numéro de carte bancaire sur l’Internet, par

peur d’une interception ou d’une utilisation fraudeuse de celui-ci.

2010

2.3. Le but qu’on doit atteindre :
Quel que soit votre objectif, le but est d’obtenir ou de construire un site commercial qui nous

garantie :

 Disponibilité : des accès WAN, de l’infrastructure, des serveurs et des services…

 Qualité de service : amélioration des temps de réponse, traitements différentiés…

 Optimisation financière : économies sur l'infrastructure d'accueil et sur les éléments
constitutifs du site.

3. Les aspects technologiques du commerceélectronique:
Les aspects technologiques du commerce électronique peuvent être répartis en trois groupes,

correspondant aux trois fonctions fondamentales de tout environnement de marché :

3.1. L’accès :
Des infrastructures de communications électroniques sont indispensables pour que les

acheteurs et les vendeurs puissent se rencontrer et rester en contact, et pour faciliter la diffusion

d’informations sur les produits et les besoins des clients. Les échanges d’information peuvent

se faire sous une forme structurée (comme avec les systèmes d’EDI) ou de manière

relativement peu structurée ou informelle (comme dans les ventes par téléphone).

2010

Le commerce électronique fait très largement appel aux installations des réseaux publics de

télécommunications comme le téléphone. Il utilise aussi divers moyens de communication

informatisée transitant par le réseau public : réseaux de transmission de données, courrier

électronique, panneaux d’affichage électronique, bases de données en ligne et Internet. Au

niveau de l’entreprise, en particulier, le commerce électronique a très largement recours aux

technologies de réseaux privés, sous la forme de réseaux locaux et de grands réseaux.

3.2. La transaction :
Des technologies spécialisées sont nécessaires pour permettre des formes spécifiques

d’échanges d’informations structurées intervenant directement dans l’organisation et la

conclusion de transactions commerciales et dans l’exécution d’obligations contractuelles. On

peut citer, parmi ces technologies, l’EDI, les points de vente électronique, les cartes (de crédit,

de paiement et à puce), les guichets automatiques et le transfert électronique de fonds.

3.3. Le soutien :

D’autres technologies ou applications spécialisées sont nécessaires pour apporter un soutien

administratif ou technique aux transactions réalisées sur le marché électronique. Il s’agit, entre

autres, de l’archivage électronique des spécifications et des prix des produits, de

l’authentification de l’identité de l’acheteur et du vendeur, de la vérification du crédit, des

garanties et de la validation des adresses. On peut citer, par exemple, les technologies de

validation des cartes de crédit et les mécanismes électroniques de compensation et de

2010

CHAPITRE 2

……………………………………………………………………………………………………………..

Phase d’Analyse des
Besoins

1. But à atteindre :
Notre projet consiste à concevoir et développer une application WEB d’une agencede

location de voiture en ligne.

2. Définition de la mission :

Nous souhaitons proposer une solution complète de location de voiture en ligne qui offre les

fonctions standard de fonctionnement d’une société de location de voiture à savoir chercher une

voiture, réserver une voiture, rendre une voiture, éditer son bon de livraison.

Ce site web dispose d’une interface web graphique, et il doit pouvoir aussi connecter à une

base de données.

2010

3. Objectif à atteindre :
Les principaux objectifs à atteindre concernant ce site web sont les suivants :

 Prévoir un site web assez dynamique et simple pour assurer l’exactitude et la
cohérence des processus.

 Accélérer l’élaboration des documents techniques précis et cohérents.

 Avoir une base de données adéquate afin de faciliter le suivie des demandes de
location.

 Appliquer des outils de développement afin d’améliorer la qualité de ce site.

4. Cahier de charge :
Certains critères sont nécessaires pour réaliser ce site :

 Savoir distinguer parmi son parc automobile quels sont les véhicules disponibles,
sachant qu’un véhicule peut être loué plusieurs fois dans la même journée

 La possibilité des modifier la réservation lorsque le client le veut.

 Etablir un bon de livraison qui prend en compte toutes les caractéristiques liées à la
location :

 Le type de voiture.
 Le type de location (location de courte durée, de langue durée).
 Les plages horaires (1 jours,2 jours…1 semaine ou plus, un mois ou plus ..)

5. Conclusion :
A l’aide des critèresillustrés ci-dessus on essayera de comprendre le fonctionnement du

système et cela pour nous permettre de bien concevoir notre base de données et par suite

l’exactitude et la cohérence des processus.

2010

3

CHAPITRE
……………………………………………………………………………………………………………..

Phase d’Analyse et de
Conception

1. Introduction :
La description de la programmation par objets a fait ressortir l’étendue du travail

conceptuelnécessaire : définition des classes, de leurs relations, des attributs et méthodes, des

interfaces etc.Pour programmer une application, il ne convient pas de se lancer tête baissée

dans l’écriture du code : il faut d’abord organiser ses idées, les documenter, puis organiser la

réalisation en définissant les modules et étapes de la réalisation. C’est cette démarche antérieure

à l’écritureque l’on appelle modélisation ; son produit est un modèle.

Pour aboutir à une application qui soit proche des concepts du monde réel, on pourra

favoriser la méthodologie qui convient le mieux à la modélisation du problème. Sachant

qu’UML nous permet de couvrir tout le cycle de développement, on a favorisé l’utilisation de

cet outil de modélisation. Les avantages et la justification du choix de l’approche objet seront

exposés dans ce chapitre à travers les différents diagrammes qui suivent.

2010


Figure 1: Quelle méthode pour passer de l’expression des besoins au code de l’application ?

2. Présentation d’UML
2.1. Définition d’UML :
UML (en anglais Unified Modeling Language ou « langage de modélisation unifié ») est un

langage de modélisation graphique à base de pictogrammes. Il est apparu dans le monde du

génie logiciel, dans le cadre de la « conception orientée objet ». Couramment utilisé dans les

projets logiciels, il peut être appliqué à toutes sortes de systèmes ne se limitant pas au domaine

informatique.

UML n’est pas une méthode (i.e. une description normative des étapes de la modélisation) :

ses auteurs ont en effet estimé qu’il n’était pas opportun de définir une méthode en raison de la

diversité des cas particuliers. Ils ont préféré se borner à définir un langage graphique qui permet

de représenter et de communiquer les divers aspects d’un système d’information.

UML est donc un métalangage car il fournit les éléments permettant de construire le modèle

qui, lui, sera le langage du projet.

Il est impossible de donner une représentation graphique complète d’un logiciel, ou de tout

autre système complexe, de même qu’il est impossible de représenter entièrement une statue (à

trois dimensions) par des photographies (à deux dimensions). Mais il est possible de donner sur

un tel système des vues partielles, analogues chacune à une photographie d’une statue, et dont

la conjonction donnera une idée utilisable en pratique sans risque d’erreur grave.

2010

2.2. Choix de la méthodologie :
Nous avons choisi UML pour ces raisons :

 Les digrammes UML supportent l’abstraction. Leur niveau de détail caractérise le
niveau d’abstraction du modèle.

 La structure des diagrammes UML et la notation graphique des éléments de
modélisation sont normalisées.

 Le recourt à des outils appropriés est un gage de productivité pour la rédaction des
diagrammes UML, car :

 Ils facilitent la navigation entre les différentes vues.
 Ils permettent de centraliser, organiser, partager et synchroniser les diagrammes
(indispensables avec un processus itératif),
 Facilitent l’abstraction, par des filtres visuels,
 Simplifient la production de documents et autorisent (dans certaines limites) la
génération de code.

2.3. Les diagrammes d’UML :
UML 2.0 comporte ainsi treize types de diagrammes représentant autant de vues

distinctespour représenter des concepts particuliers du système d’information. Ils se répartissent

en deuxgrands groupes :

Diagrammes structurels ou diagrammes statiques (UML Structure)
 diagramme de classes (Class diagram)

 diagramme d’objets (Object diagram)

 diagramme de composants (Component diagram)

 diagramme de déploiement (Deployment diagram)

 diagramme de paquetages (Package diagram)

 diagramme de structures composites (Composite structure diagram)

2010

Diagrammes comportementaux ou diagrammes dynamiques (UML Behavior)
 diagramme de cas d’utilisation (Use case diagram)

 diagramme d’activités (Activity diagram)

 diagramme d’états-transitions (State machine diagram)

 Diagrammes d’interaction (Interaction diagram)

 diagramme de séquence (Sequence diagram)
 diagramme de communication (Communication diagram)
 diagramme global d’interaction (Interaction overview diagram)
 diagramme de temps (Timing diagram)

Ces diagrammes, d’une utilité variable selon les cas, ne sont pas nécessairement tous

produits à l’occasion d’une modélisation. Les plus utiles pour la maîtrise d’ouvrage sont les

diagrammes de cas d’utilisation, de classes et de séquence.

3. Phase de Conception :
3.1. Diagramme de cas d’utilisation :
Le diagramme de cas d’utilisation représente la structure des grandes fonctionnalités

nécessaires aux utilisateurs du système. C’est le premier diagramme du modèle UML, celui où

s’assure la relation entre l’utilisateur et les objets que le système met en œuvre.

Un diagramme de cas d’utilisation capture le comportement d’un système, d’un sous-

système,d’une classe ou d’un composant tel qu’un utilisateur extérieur le voit. Il scinde

lafonctionnalité du système en unités cohérentes, les cas d’utilisation, ayant un sens pour

lesacteurs. Les cas d’utilisation permettent d’exprimer le besoin des utilisateurs d’un système,

ilssont donc une vision orientée utilisateur de ce besoin au contraire d’une vision informatique.

Il ne faut pas négliger cette première étape pour produire un logiciel conforme aux

attentesdes utilisateurs. Pour élaborer les cas d’utilisation, il faut se fonder sur des entretiens

avec lesutilisateurs. Ce diagramme se compose de deux éléments :

2010

 Acteur :Un acteur est l’idéalisation d’un rôle joué par une personne externe, un
processus ou une chose qui interagit avec un système. Il se représente par un petit
bonhomme.

 Cas d’utilisation :Un cas d’utilisation est une unité cohérente représentant une
fonctionnalité visible de l’extérieur. Un cas d’utilisation modélise donc un service

rendu par le système, sans imposer le mode de réalisation de ce service.

Dans notre cas le système d’une agence de location de voiture en ligne possède deux

acteurs : le client (internaute) et le webmaster (administrateur du site) et un ensemble des cas

d’utilisations qui représente les différentes fonctionnalités du système.

Après avoir déterminé les différents acteurs, nous avons procédé à la modélisation du

comportement du site vis-à-vis des différents acteurs :

Utiliser composant interface client

WebMaster
Client

Utiliser composant administrateur

Figure 2 :Cas d’utilisation globale

Nous allons par la suite détailler les deux diagrammes de cas d’utilisation relatifs au client et

à l’administrateur.

2010

3.1.1. Côté Client :
Le diagramme de cas d’utilisation du côté client montre tous les services du système que le

client peut utiliser.

Figure 3 :Cas d’utilisation coté client

2010

3.1.2. Côté Webmaster:
Le diagramme de cas d’utilisation du côté Webmaster montre tous les services du système

destinés à l’administrateur.

Figure 4 : Cas d’utilisation coté administrateur

2010

3.2. Diagrammes de séquence :
Le diagramme de séquence montre des interactions entre objets selon un point de vue

temporel. Ce type dediagramme sert à modéliser les aspects dynamiques des systèmes temps

réels et des scénarios complexesmettant en œuvre peu d'objets.

Dans ce type de diagrammes, l'accent est mis sur la chronologie des envois de messages.

Lareprésentation se concentre sur l'expression des interactions et non pas sur l'état ou le

contexte des objets.

Ce type de diagramme est usuellement utilisé pour illustrer les diagrammes de cas

d'utilisation.

Dans ce qui suit, nous présenterons les scénarios des principaux cas d’utilisations des deux

côtés : côté client et côté Webmaster.

3.2.1. Côté Client :
i. Consultation de la page d’accueil :

page d'acceuil

client

1:demande
Le client demande
la page d'acceuil

2:affiche
le système affiche la
page d'acceuil

Figure 5 : Diagramme de séquence pour la consultation de la page d'accueil.

2010

ii. La recherche des voitures disponibles, Réservation et Paiement :

Figure 6 : Diagramme de séquence de la réservation d’une voiture

2010

3.2.2. Côté Webmaster :
i. Diagrammede séquence d’authentification du l’administrateur :

Pour que l'administrateur gère les différents stockages de site, il faut authentifier.

Figure 7 : Diagramme de séquence d'authentification de l'administrateur du site

ii. Diagramme de séquence d’ajout d’une voiture :

Ce diagramme décrit les différentes taches que l'administrateur va suivre pour ajouter une

véhicule à leur base de données

2010

.

Figure 8 : Diagramme de séquence d'ajout d'une voiture

iii. Diagramme de séquence desuppression d’une voiture :

Ce diagramme décrit les différentes tâches que le Webmaster va suivre pour supprimer une

voiture de la base de données.

Figure 9 : Diagramme de séquence de suppression d'une voiture

2010

3.3. Diagramme de classes :
Le diagramme de classes est considéré comme le plus important de la modélisation

orientéeobjet, il est le seul obligatoire lors d’une telle modélisation.

Alors que le diagramme de cas d’utilisation montre un système du point de vue des

acteurs,le diagramme de classes en montre la structure interne. Il permet de fournir une

représentationabstraite des objets du système qui vont interagir ensemble pour réaliser les cas

d’utilisation.

Il s’agit d’une vue statique car on ne tient pas compte du facteur temporel dans le

comportement du système.

Les principaux éléments de cette vue statique sont les classes et leurs relations : association,

généralisation et plusieurs types de dépendances, telles que la réalisation et l’utilisation.

 Les classes : Une classe est la description formelle d’un ensemble d’objets ayant
une sémantique et des caractéristiques communes.

 Relations entre classes : Une association est une relation entre deux classes
(association binaire) ou plus (association n-aire), qui décrit les connexions
structurelles entre leurs instances. Une association indique donc qu’il peut y avoir
des liens entre des instances des classes associées.

Après l’étude de notre système un ensemble d’objets qui ont été recensés permettant en

effet de dégager le diagramme de classes.Dans ce qui suit la Figure10 présentera le diagramme

de classes de notre site.

2010


Figure 10 : Diagramme de classe de l'agence de location de voiture en ligne

2010

Pour pouvoir passer du diagramme de classes au modèle relationnel un ensemble de règles

doivent être appliqué. Les règles de passage du modèle relationnel utilisées sont les suivantes :

 Les classes du domaine désignées comme persistances deviennent des tables.

 Certains attributs deviennent des colonnes des tables.

 Lorsque l’association a un lien de type (1,1) ou (0,1), il y a migration des clefs.

 Lorsque l’association présente les cardinalités (*, n) et (*, m) où m représente 0 ou
1, elle est traduite par une table dont la clef primaire est la concaténation des
identifiants des objets participant à l’association.

 Si un objet hérite d’un autre, il est représenté par une table ayant la même clef
primaire de son père, les mêmes attributs, plus les attributs, qui lui sont propres.

 Les opérations n’existent pas dans le modèle relationnel.

En appliquant ces règles, nous obtenons le modèle relationnel suivant :

2010

FACULTE DES SCIENCES DE MONASTIR SITE WEB DYNAMIQUE : LOCATION DE VOITURE

2010
Projet de fin d’étude
Figure 11: Modèle physique de données

24

4. Conclusion
Dans ce chapitre nous avons présenté les exigences et les besoins des différents

protagonistes ainsi que leur interactions avec le système et avec les autre utilisateurs à travers

les cas d’utilisations et des scénarios pour mieux comprendre le rôle, les actions et les droits de

chaque acteur dans notre site Web.

2010

4

CHAPITRE
……………………………………………………………………………………………………………..

Langages et Outils de
Développement.
1. Présentation du Web :
1.1. Site web :
Ensemble de pages web hyperliées entre elles,appartenant à un même serveur web et mises

en ligne à uneadresse Web.

1.2. Qu'est-ce qu'un site statique :

On entend par page statique, non pas une page sans mouvements ou sans animations, mais

une page visible telle qu'elle a été conçue.

Ces pages peuvent présenter toute forme de contenu, animations flash, images, musique, vidéo

etc... Mais elles sont toujours présentées de la même façon. Elles ne changent pas et c'est en ce

sens qu'elles sont statiques.

1.3. Qu'est-ce qu'un site dynamique :
En opposition aux pages statiques, les pages dynamiques permettent de présenter les

informations de différentes manières selon l'interaction avec le visiteur.

Les pages sont alors construites "à la volée" grâce à une programmation conçue par le

2010

webmaster. Le contenu est issu d'une base de données en fonction de critères établis par

l'internaute

1.4. Comment choisir si une page est statique ou dynamique?
Tout d'abord il convient de déterminer le rôle de la page. Tout système d'interaction avec le

visiteur nécessitera une partie dynamique.

Pour un système de mise à jour, il conviendra de réfléchir aux fréquences des mises à jour. Si le

contenu ne change peu ou qu'une fois à l'année, il n'est pas nécessaire de passer par des pages

dynamiques. Une intervention ponctuelle du webmaster peut très bien convenir.

1.5. Quels sont les avantages et les inconvénients des deux méthodes?
L'utilisation des pages dynamiques est plus souple pour l'évolution du site mais nécessite

plus de temps de travail pour laprogrammation.

En opposition, les pages statiques sont plus "figées" mais plus simples à réaliser.

1.6. Page web :
Ressource du World Wide Web conçue pour êtreconsultée par des visiteurs à l'aide d'un

navigateur Web.

1.7. Hyperlien ou lien hypertexte:

Référence dans un systèmehypertexte permettant de passer automatiquement d'undocument

consulté à un document lié.

1.8. Adresse Web ou URI (URL) :

Référence universelle d'une ressource sur le web (et plus encore), de la forme :

protocole://serveur:port/chemin#ancre?params

1.9. Serveur Web:
Ensemble machine et logiciel hébergeant despages web

2010

2. Comment créer une application Web avec PHP/MySQL …?
De nombreuses applications Web reposent sur l'utilisation de bases de données (paniers de

commandes, forums, ...).

Les bases de données sont utilisées dans les applications WEB pour permettre de stocker des

données nécessaires à l'application. Si par exemple un site vitrine de type site d'entreprise

n'aura nul besoin de base de données, car il ne sert qu'à présenter des informations, un site

marchand devra stocker ses produits dans une base de données et mettre à jour les quantités

pour un produit, en dynamique, après l'achat effectué par un de ses clients.

Une application Web en PHP/MySQL repose sur une architecture client-serveur mettant en

jeu trois acteurs (Figure 12) :

 un serveur HTTP (ou serveur Web) permettant l'exécution de scripts PHP,

 un serveur de bases de données MySQL,

 un client HTTP (navigateur).

Le client émet une requête HTTP. Le serveur Web la reçoit et transmet une réponse au

client. Lorsque la réponse nécessite l’interrogation d’une base de données, une interface de

programmation est utilisée pour communiquer avec la base.

Figure 12 : architecture client-serveur

2010

2.1. Qu'est-ce que PHP ?
PHP est un l'un des langages de script les plus actifs sur le Web. Il permet de créer

principalement des pages Web HTML mais aussi d'autres types de contenu comme des images,

des animations Flash, des documents PDF, etc.

PHP peut être utilisé soit comme un langage de script répondant à des besoins simples et à

court terme (c'est ce quil'a fait connaître), soit comme un langage de programmation complexe

permettant de mettre en place des applicationsd'entreprise (programmation orientée objet,

design patterns etc.).

2.2. Qu'est-ce que MySQL ?
SQL signifie« Structured Query Language » c'est-à-dire Langage d'interrogation

structuré.En fait SQL est un langage complet de gestion de bases de données relationnelles.Il a

été conçu par IBM dans les années 70. Il est devenu le langagestandard des systèmes de gestion

de bases de données (SGBD) relationnelles(SGBDR).

C'est à la fois :

 un langage d'interrogation de la base (ordre SELECT)

 un langage de manipulation des données (LMD; ordres UPDATE,
INSERT,DELETE)

 un langage de définition des données (LDD ; ordres CREATE, ALTER, DROP),

 un langage de contrôle de l'accès aux données (LCD ; ordres GRANT,REVOKE).

Le langage SQL est utilisé par les principaux SGBDR : DB2, Oracle,Informix, Ingres,

RDB,... Chacun de ces SGBDR a cependant sa propre variantedu langage. Ce support de cours

présente un noyau de commandesdisponibles sur l'ensemble de ces SGBDR, et leur

implantation dans OracleVersion 7.

2.3. Le langage HTML :
HTML est le langage universel utilisé pour communiquer sur le Web. Votre information

sera ainsi transportée sur cette gigantesque toile de réseaux interconnectés qu'est Internet, pour

2010

aboutir sur l'ordinateur de votre lecteur grâce à un programme appelé navigateur ou browser.

Le logiciel que l'on appelle un browser vous permet de surfer sur le Net et d'afficher sur votre

écran les "pages" qu'il a interceptées. Il y a, hélas, beaucoup de marques et de types de

browsers différents. Des simples, des archaïques ou des sophistiqués... Les plus connus sont

Netscape Navigator et Internet Explorer de Microsoft mais il en existe beaucoup d'autres.

Chaque browser a sa propre façon de travailler.

2.4. Une feuille de style :
Une feuille de style est un document numérique qui va pouvoir spécifier toutes les

caractéristiques de mise en forme du document lié à la balise à laquelle elle s'applique.

2.5. JavaScript :
JavaScript est un langage de scripts qui incorporé aux balises Html, permet d'améliorer la

présentation et l'interactivité des pages Web. Javascript est donc une extension du code Html

des pages Web. Les scripts, qui s'ajoutent ici aux balises Html,peuvent en quelque sorte être

comparés aux macros d'un traitement de texte.

Ces scripts vont être gérés et exécutés par le browser lui-même sans devoir faire appel aux

ressources duserveur. Ces instructions seront donc traitées en direct et surtout sans retard par le

navigateur.

2.6. Le XML :
XML (Extensible Markup Language) est un langage de balisage qui permet la création de

documents structurés. Vous pouvez le considérer comme une généralisation de HTML vous

permettant de définir des balises. XML dérive du langage SGML (Standard Generalized

Markup Language). Il permet, comme celui-ci, de définir des ensembles de balises et les

relations qui existent entre eux.

2010

3. Les outils de développement :
3.1. XAMPP :
XAMPP est un ensemble de logiciels permettant de mettre en place facilement un serveur

Web, un serveur FTP et un serveur de messagerie électronique. Il s'agit d'une distribution de

logiciels libres (XApacheMySQLPerlPHP) offrant une bonne souplesse d'utilisation, réputée

pour son installation simple et rapide. Ainsi, il est à la portée d'un grand nombre de personnes

puisqu'il ne requiert pas de connaissances particulières et fonctionne, de plus, sur les systèmes

d'exploitation les plus répandus.

3.2. Adobe DreamWeaver CS3 :
Adobe Dreamweaver CS3est un éditeur HTML professionnel destiné à la conception,

aucodage et au développement de sites, de pages et d'applications Web. Quel que

soitl'environnement de travail utilisé (codage manuel HTML ou environnement d'édition

visuel),Dreamweaver propose des outils qui vous aideront à créer des applications Web.

Les fonctions d'édition visuelle de Dreamweaver vous permettent de créer rapidement des

pagessans rédiger une seule ligne de code. Vous pouvez afficher tous les éléments ou actifs de

votre siteet les faire glisser directement d'un panneau convivial dans un document.

3.3. Mozilla Firefox :

Mozilla Firefox est un navigateur Web, développé et distribué par la Mozilla Foundation

aidée de centaines de bénévoles grâce aux méthodes de développement du logiciel libre/open

source et à la liberté du code source.

3.4. Adobe Fireworks CS3 :
Adobe Fireworks CS3est la solution de conception et de production de graphiques

Webprofessionnels. Il s’agit du premier environnement de production permettant de faire face

et derésoudre les défis posés aux concepteurs et aux développeurs de graphiques Web.Créez,

modifiez et animez des graphismes Web avec Fireworks, ajoutez des fonctions

d’interactivitéavancées et optimisez les images dans un environnement professionnel. Dans

2010

Fireworks, vouspouvez créer et modifier des graphique bitmap et vectoriels dans une seule

application. Tout resteentièrement modifiable, à tout moment. En outre, vous pouvez

automatiser vos procédures detravail pour faire face aux exigences de longues mises à jour et

modifications.

3.5. Power AMC Designer :
PowerAMC désigner est un logiciel de modélisation. Il permet de modéliser les traitements

informatiques et leurs basesdedonnées associées. Créé par SDP sous le nom AMC*Designor,

racheté par Powersoft, ce logiciel est produit par Sybase depuis le rachat par cet éditeur en

1995.

2010

5

CHAPITRE
……………………………………………………………………………………………………………..

Réalisation du projet.

1. Introduction :
Dans cette partie nous traitons les différents détails liés à l’implémentation et

audéveloppement de l’application déjà conçue et modélisée dans la partie précédente. Nous

exposons en premier lieu le cycle de vie utilisé dans le développement de notre site, en

deuxième partie nous présentons le diagramme de déploiement de notre système. Enfin nous

allons illustrer par des imprimes écrans la description du travail réalisé, ainsi que

l’environnement matériel et logiciel qui fera l’objet de la dernière partie de ce dernier chapitre.

2. Description de cycle de vie :
Plusieurs modèles de cycle de vie peuvent être appliqués pour réaliser un projet

informatique et cela en fonction de son type : modèle en V, modèle en spirale, modèle en

cascade etc.

2010

Pour mener à bien notre site, on a opté le paradigme objet au niveau de la conception. On a

besoin de développer des prototypes qui ont été améliorés au fur et à mesure pour arriver à la

version finale.

En outre, les négociations avec le client ont été basées sur les interfaces. Il se trouve alors

que le modèle le plus approprié pour l’élaboration de ce PFE est le RAD (Rapid Application

Developement).

Le modèle RAD est basé essentiellement sur la réalisation de prototype, mené conjointement

avec le client, cette approche est supportée par beaucoup des outils RAD (Rapid Aided

Design). La phase de prototypage débouche sur une interface validée par le client. L’outil

génère des squelettes de fonctions de classes. le comportement de chaque objet de l’interface

est ensuite décrit dans un langage approprié et ses fonctionnalités sont programmés.

RAD = Spirale + Orienté objet + IHM

3. Déploiement de l’application :
Le déploiement est l’étape qui permet de mettre l’application en ligne. Pour réaliser cette

tâche, nous avons choisi l’architecture présentée dans la Figure 13. Il fallait tout d’abord créer

un projet de déploiement qui servira pour le déploiement de l’application.

Le schéma si dessous représente le diagramme de dépoilement de notre système :

2010


Figure 13 : Diagramme de déploiement

4. Système de gestion de base de données
Pour implémenter notre base de données, nous avons utilisé phpmyAdmin comme SGBD

(Système de gestion de base de données). PhpmyAdmin est un SGBD relationnel. C’est un

logiciel libre. Il est caractérisé par sa rapidité et sa fiabilité. Il a été développé à l’origine pour

gérer de très grandes bases de données.

5. Travail réalisé :
Nous présentons dans cette partie quelques interfaces de notre site web de l’agence de

location de voiture.

5.1. Coté Client (internaute) :
5.1.1. Page d’Accueil :
Devant la page d’accueil l’internaute a le choix de consulter les rubriques, voir les voitures

de l’agence, voir les différents services présentés par le site, voir les voitures disponibles pour

la réservation.

2010


Figure 14: Page d'accueil

5.1.2. La phase de réservation d’une voiture par des illustrations :
Lorsque le client visite la page d’accueil il remarque la présence d’un formulaire pour

spécifier les critères de sa recherche (la date dont la quelle il veut effectuer la réservation et la

classe de la voiture souhaitée), ce qui illustre la figure suivante

2010


Figure 15 :Saisie des critères de la recherche

En cliquant sur le bouton Recherche une consultation de la base de données s’effectue par

une requête de sélectiondont la condition les valeurs saisies, puis le résultat de notre recherche

s’affiche dans une autre page comme vous voyez dans la figure suivante.

2010


Figure 16 : Les voitures disponibles pour la réservation

Dans cette page on voit le résultat de la recherche une liste de voitures avec leurs critères et

on voit aussi un bouton , en cliquant sur cette bouton le choix

de la voiture à réserver est effectué et le client va remplir une fiche d’information personnelle

avant de terminer sa réservation.

2010


Figure 17 : Saisie des informations du client

Après la saisie de ses informations personnelles et le nombre de jours souhaité pour la

locationet en validant, le client va passer à la phase de paiement. Le client va à une page qui

contient le net à payer et un formulaire à remplir concernant les informations de paiement dont

2010

le client va remplir soigneusement, cette phase est la phase la plus importante dans la

réservation.

Une réservation n’est validée qu’après le paiement. Donc la phase de paiement est

obligatoire pour effectuer une réservation.

Figure 18 : Phase de paiement

Cette page (Figure 18) est la page de paiement. Après un paiement réussit, le client atteint

une page qui contient tous les informations concernant la réservation qui permet au client

d’imprimer son bon de livraison via le bouton imprimer

2010

FACULTE DES SCIENCES DE MONASTIR SITE WEB DYNAMIQUE : LOCATION DE VOITURE

2010
Projet de fin d’étude
Figure 19 : Bon de Livraison

41

Après l’impression de son bon de livraison la réservation s’est effectuée avec succès et tout

est terminé pour le client.

On passe alors au côté administrateur qui est le gérant de ce site.

5.2. Coté Administrateur (Webmaster) :

5.2.1. Authentification de l’administrateur :
Pour pouvoir effectuer ses fonctionnalités ,l’administrateur doit s’authentifier en saisissant

un Login et un mot de passe.

Cette authentification est obligatoire pour passer en mode administration. Après vérification

de login et de mot de passe, on passe à la page d’administration.

Figure 20 : Page d’authentification

L’administrateur saisie son login et sa mot de passe.

2010

5.2.2. Page d’administration :
Après une authentification réussite, l’administrateur passe à la page d’administration.

Figure 21 : Page d’Administration

A partir de cette page l’administrateur peut gérer son site, il effectue toutes ses opérations :

 Gérer les voitures :

 Ajouter une voiture.
 Supprimer une voiture.
 Modifier les informations d’une voiture.

 Gérer les réservations :

 Ajouter une réservation.
 Annuler une réservation.
 Modifier les informations d’une réservation

2010

 Gérer les clients :

 Ajouter un client.
 Supprimer un client.
 Modifier les informations d’un client.

 Gérer les entretiens des voitures.

6. Conclusion :
Ce chapitre a pour objectif de présenter les différents aspects pratiques de l’application.

Malgré les difficultés lors de langage de programmation PHP et de la base de donnés qu’on

a utilisé dans notre application, nous avons pu finalement modéliser la partie conceptuelle de

notre site. A cette étape la réalisation du projet devient claire suivant la démarche que nous

avons suivie.

.

2010

Conclusion

Générale
……………………………………………………………………………………………………………..

Au cours de ce projet, nous avons étudié un secteur d’activité très intéressant : c’est celui du

service de location des voitures en ligne.

L’objectif escompté par ce présent travail est de concevoir, de développer un site web pour

une agence de location des voitures en ligne.

En achevant ce rapport, il est indispensable de signaler les aspects bénéfiques de ce projet :

 Sur le plan méthodologique, il a permis de mieux maîtriser le langage de
modélisation UML.

 Sur le plan pratique, nous avons été confrontés à la gestion d’un projet depuis la
phase d’analyse jusqu’à l’implémentation en passant par la conception et la
réalisation.

Il nous a permis de faire de nouveaux contacts avec plusieurs personnes s’impliquant de près

ou de loin aux nouvelles technologies et de côtoyer le monde professionnel.

2010

Rapport pfev7

Recommandé

Recommandé

Contenu connexe

Tendances

Tendances (20)

En vedette

En vedette (19)

Similaire à Rapport pfev7

Similaire à Rapport pfev7 (20)

Rapport pfev7