‫اﻟﺟزاﺋـرﯾـﺔ اﻟدﯾﻣﻘراطﯾـﺔ اﻟﺷﻌﺑﯾـﺔ‬

République Algérienne Démocratique et Populaire

‫وزارة اﻟﺗﻌﻠﯾــم اﻟﻌﺎﻟـﻲ واﻟﺑﺣـث اﻟﻌﻠﻣـﻲ‬
Ministère de l’Enseignement Supérieur et de la Recherche Scientifique

No Réf :……………

Centre Universitaire de Mila

Institut des sciences et de la technologie Département de Mathématiques et Informatique

Mémoire préparé En vue de l’obtention du diplôme de licence

En: - Filière : informatique général

Thème
Conception et réalisation d’un site web
dynamique pour l’achat et la vente d’une
pharmacie

Préparé par : Zemmouri Amina

Boulaiche Nassima
Boumeslate Roqiya

Encadré par: Bouchekouf Asma

Année universitaire : 2013/2014

 Nous tenons à remercier toujours et par cette occasion, en

Premier et avant tout, notre créateur <<ALLAH>> car sans sa

Majesté et son aide nous n’aurions pu arriver à se stade

Scientifique.

Nos remerciements Melle BOUCHEKOUF ASMA pour son encadrement et

son aide, ses directives ainsi que ses conseils qui nous ont permis d’avancer

dans la conception de notre projet.

Nos remerciements a mes Parents, frères, sœurs, et a toute la famille pour

leur inestimable soutien

Nous tenons à exprimer nos sincères remerciements à tout

Le personnel de l’institut de l’informatique Ainsi que tous les

Enseignants qui nous ont enseigné durant toutes nos années

D’étude.

Nous remercierons aussi Asma Touil, Abd lbasset et Kais qui son aide

durant toute la période du travail.

Enfin, Nous exprimons nos plus vifs remerciements à toute

Personne qui nous a aidés à élaborer ce travail de proche ou de

Loin.

Nassima, Amina et Rokiya.

 Au Début et avant tout, je veux remercier le dieu qui à permet le
Courage à faire et finir ce modeste travail.
C'est avec un grand plaisir et une réelle joie de fierté que je dédie ce
travail.
Prier pour moi. Puisse Dieu, le tout puissant, te préserver et t'accorder
Une longue vie, pleine de bonheur et de santé.
À mon père Mouloud.
Avec un énorme plaisir, un cœur ouvert et une immense joie,
Que Je dédie ce travail à ma très chère mère Salima.
Tu es l'exemple de dévouement qui n'a pas cessé
De m'encourager et de
A ma tante Fadiya.
A ma chères sœur Fatima Zahra
A mes frères : Adel, Nadir, Mohamed, Badradinne, Samir, et le petit
adorable Anis.
A ma chère « Asma touil »
A mes oncles et tantes, ainsi que mes cousins et cousins.
A ma binôme Amina etRoqiya.
A mes amies: Amina, Ibtissem, Amel z, Souad,
Amelk, Rahma, Ranya, Imane, Nour lhouda, Chahinaz.
A toute personne qui me connait.

Nassima
Au Début et avant tout, je veux remercier le dieu qui à permet le
Courage à faire et finir ce modeste travail.
C'est avec un grand plaisir et une réelle joie de fierté que je dédie ce
travail.
Prier pour moi. Puisse Dieu, le tout puissant, te préserver et t'accorder
Une longue vie, pleine de bonheur et de santé.
A mon père et ma mère
Pour l’amour et l’aide qu’ils m’ont fait entourer
Une place particulière dans mon coeur.
A mes frères « Amin » et « islam ».
A ma sœur « wissam ».
A toute mes oncles, tantes, cousin et cousines.
A ma cousines « Sirine ».
A ma chère « Asma touil »
A mon amis binôme Nassima (Ikram) et Roqiya.
A tous mes amis avec lesquelles j’ai partagé les bons moments : Ikram,
Amelz, Souad, Ibtissam, Roqiya, Rahma
Amel k, Meryem.
A toute personne qui me connait.

Amina
 Au Début et avant tout, je veux remercier le dieu qui à permet le
Courage à faire et finir ce modeste travail.
C'est avec un grand plaisir et une réelle joie de fierté que je dédie ce
travail.
C'est avec un grand plaisir et une réelle joie de fierté que je dédie ce
travail.
Prier pour moi. Puisse Dieu, le tout puissant, te préserver et t'accorder
Une longue vie, pleine de bonheur et de santé.
A mon père Sassi et ma mère Sakina.
Qui m’a encouragé et soutenue toute au long de mes études.
A ma chères sœur Hiba, À mes frères Hamza, Ali, et Daoud. Et toute ma
famille Boumesslat, & A tous mes enseignants.
A ma chère « Asma touil ».
A mes oncles et tantes, ainsi que mes cousins et cousins.
A ma binôme Amina et Nasima.
A mes amies: Salma, Meryem, Faten, Wafa, Aaicha, et Manale.
A toute personne qui me connait.

Rokiya
 Au cours des dernières années, le monde a connu des évolutions et des changements

qu’il n’ya pas vu précédemment, grâce à la révolution technologique et informatique qui

a touché divers secteurs et a noté que le plus grand impact de ce sujet apparaît dans le

domaine commercial soi-disant commerce électronique ou le commerce via Internet.

Nous permettent de faire les opérations d'achat et de vente à distance. Dans notre projet

nous allons réaliser un site web dynamique pour l’achat et la vente

D’une pharmacie en utilisant des outils de Modélisation

UML et un ensemble de langages de Programmations tels que l’ HTML et le PHP...

 ‫ﻓﻲ اﻟﺳﻧوات اﻷﺧﯾرة‪ ،‬ﺷﮭد اﻟﻌﺎﻟم ﺗطورات واﻟﺗﻐﯾرات اﻟﺗﻲ ﻻ ﻣﺛﯾل ﻟﮭﺎ ﻣن ﻗﺑل‪،‬‬

‫وذﻟك ﺑﻔﺿل اﻟﺛورة اﻟﺗﻛﻧوﻟوﺟﯾﺔ واﻟﻛﻣﺑﯾوﺗر اﻟﺗﻲ أﺛرت ﻋﻠﻰ ﻣﺧﺗﻠف اﻟﻘطﺎﻋﺎت وأﺷﺎر إﻟﻰ‬

‫أن أﻛﺑر أﺛر ھذا اﻟﻣوﺿوع ﯾظﮭر ﻓﻲ اﻟﻘطﺎع اﻟﺗﺟﺎري ﻣﺎ ﯾﺳﻣﻰ اﻟﺗﺟﺎرة اﻹﻟﻛﺗروﻧﯾﺔ أو‬

‫اﻟﺗﺟﺎرة ﻋﺑر اﻹﻧﺗرﻧت‪.‬‬

‫ﺗﺳﻣﺢ ﻟﻧﺎ ﺑﺷراء وﺑﯾﻊ اﻟﻣﻌﺎﻣﻼت ﻋن ﺑﻌد‪ .‬ﻓﻲ ﻣﺷروﻋﻧﺎ ھذا ﺳوف ﻧﻘوم ﺑﺈﻧﺷﺎء ﻣوﻗﻊ‬

‫اﻟﺗﻲ دﯾﻧﺎﻣﯾﻛﻲ ﻟﺑﯾﻊ وﺷراء‬

‫ﻓﻲ اﻟﺻﯾدﻟﯾﺔ ﺑﺎﺳﺗﺧدام أدوات اﻟﻧﻣذﺟﺔ و ھﻲ‬

‫‪ PHP‬و ‪ HTML‬وﻣﺟﻣوﻋﺔ ﻣن ﻟﻐﺎت اﻟﺑرﻣﺟﺔ ﻣﺛل ‪UML‬‬

INTRODUCTION GENERALE………………………………………..21
Chapitre 01 : Les Technologies web
Section01 : Internet
1.1. Introduction …………………………………………………….....23

1.2. Définition ……………………………………………………….….23

1.3. Historiqued’internet. ………………………………….………..…23

1.4. Le rôle d’internet ……………………………….………..………..24

1. 5. Lesservicesd’internet ……………………………….….……….. 24

1.5.1Services de dialogue…………………………………………........24

1. 5.1.1 Le courrier électronique ou l'E-mail (courriel)……………..24

[Link]. Les forums de discussion (news)….……………….………....24

1.5.2. Service d’information ………………………………….……….25

1.6. Les protocoles ………………………………………………. ……25

1.6.1. Définition……………………………………………… ..……...25

1. 6.2. Lesprotocolesde transmissions TCP/IP………………….......25

1. 6.2.1. Le protocole TCP ……………………………………………26

[Link]. Le protocole IP ………………………………………….…....26

1.6.3. Les protocoles de communications ……………………………26

1. 6.3.1 Le protocole http……………………………………..……..…26

[Link] Le protocole DNS ……………………………………..…….....26

1.7. Modèle OSI (Open SystemsInterconnexion)……………..….… .26

1.7.1. Définition ……………………………………………..…….......26

1.7.2. La déférence entre le modèle OSI et modèle TCP/IP……..... .28

 Section 02: World Wide Web

1.1. Definition d’un site web……………………………………………....…28

1.2. Les types d’un site web…………………………………………….…....28

1.2.1. Les sites statiques………………………………………………………28

1.2.2. Les sites dynamiques……………………………………………...……29

1.3. Les applications de site web………………………………………….….30

1.4. L’architecture Client/serveur …………………………………..….….31

1.4.1. Définition …………………………………………………………....…31

1.4.2. Client web ………………………………………………………..…….31

1.4.3. Le serveur web………………………………………..…....................31

1.4.4. Requête ………………………………………………….……………..31

1.4. 5. Réponse …………………………………………………….…………31

1.5. Navigateur web ………………………………………………………….32

1.5.1. Définition……………………………………………………………….32
1.5.2. Le rôle ………………………………………………………………….32

1.6. Hébergeur web ……………………………………………..………..…..32

1.6.1. Définition ………………………………………………………………32

1.6.2. Le rôle …………………………………………………………….……32

1.6.3. Les différentes catégories d’hébergeurs…………………..…………33

1.7. L’URL (adresse web) …………………………..……………….…….....33

1.7.1. Definition ………………………………………...……………….…….33

1.7.2. Le World Wide Web (www)…………………………………………..34

1.7.3. Page web………………………………………………………………..34

1.8. Conclusion ………………………………………………………….…....35

 Chapitre 2……………. UML et processus unifié (PU)

Section 01 : UML (Langage de modélisation unifié)

2.1. Introduction…………………………………………………………...….36

2.2. Définition………………………………………………………………….36

2.3. Historique…………………………………………………………….......36

2.4. Les points forts d'UML………………………………………. ………...38

2.5. Les points faibles d'UML………………………………………………..38

2.6. Les diagrammes d’UML …………………………………... …………..38

2.7. Les différents diagrammes d’UML ……………………………….…….38

2.8. Caractéristiques d’UML ………………………………………………...39

2.9. Présentation des diagrammes utilisés………...…………………………40

2.9.1. Diagramme de cas d'utilisation…………………..……………………40

2.9.2. Les diagrammes de séquences………………….…...……..…………..42

2.9.3. Diagramme de classe ………………………..…………………………45

2.9.4. Digramme d’activité …………………………………………………..47

Section 02 : Processus unifié (up)

2.1. Définition ………………………………………………………….…….49

2.2. Les phases ………………………………………………………….…….50

2.2.1. Analyse des besoins ……………………………………….…….…….50

2.2.2. Elaboration ……………………………………………...……….……50

2.2.3. Construction ………………………………………….………….……50

2.2.4. Transition ……………………………………... …….……….………50

2.3. Les Principe de processus ………………………….………….……….50

2.4. Conclusion ……………………………………….……………..……….51

 Chapitre 03 : Les langages de programmations web et les outils de
travails

Section 01 : Les langages de programmations web

3.1. Introduction…………………………………………………………...….52

3.2. HTML……………………………………………………………………..52

3.2.1. Définition …………………………………………………………........52

3.2.2. Les avantages de HTML………………………………………........... 53

3.3. CSS (feuille de style de cascade) :…………………………………….....53

3.3.1. Définition ……………………………... ………………………….……53

3.3.2. Les avantages de CSS ……………………………………………...….54

3. 4. PHP ……………………………………………………………………....54

3.4.1. Définition …...……………………………………………………….….54

3.4.2. Avantage de PHP …………..……………………………………….....54

3.5. JavaScripts……………………………………………………………….55

3.5 .1. Définition ………………………..…………………………………....55

3.5.2. Les Avantages de JavaScripts………………………………………..55

Section 02 : Les outils de travails

3.1. PHP MyAdmin …………………………………………………………56

3.2. MySQL ……………………………………………………………….....57

3.2.1. Définition ………………………………………………………….......57

3.2.2. Avantage de MYSQL ………………………………………………...57

3.3. Adobe Photoshop …………....................................................................58

3.4. Notepad++…………………………………….........................................58
3.5. Mozilla Firefox …………………………………...................................59

3.6. Wamp Server………………………………………………………….....59

3.7. UML PacesterDiagrammer …………………………………………....60

Section 03 : Langage Joomla

1.1. Définition …………..……………………………………………………61

3.2. Historique de Joomla ………………….…...……..……………………61

3.3. Caractéristique de Joomla ………………..……………………….…...62

3.4. Les Avantages des Joomla…………………………………………......63

3.5. Les Inconvénients de Joomla ………………………………………..63

3.6. Pour quoi utilisée le langage Joomla ?…..……………………………63

3.7. Personnalisation……………….…...……..… ………………………..64

3.8. Les Versions de Joomla ………………..……………………………..64

3.9. Template ………………………………………………………………65

3.10. Module………………..……………………………………………….65

3.11. Menu ………………………………………………………………….66

3.12. Conclusion…………………………………………………………….66

Chapitre 04:La modélisation UML de site web

4.1. Introduction……………………......……………………………….…67

4.2. Identification des acteurs …………………………………………….67

4.3. Diagrammes élaborés ………………………………………………..68

4.3.1. Diagrammes de cas d’utilisation …………………………………..68

4.3.2. Description textuelle du cas d’utilisation…………………………69

[Link]. Cas d’utilisation « Crée un compte »…………………….……....69

[Link]. Cas d’utilisation « Supprimer un médicament »………………..69

[Link]. Cas d’utilisation « modifier un médicament »…………………70

[Link]. Cas d’utilisation « rechercher médicament »………………….70
[Link]. Cas d’utilisation « ajouter médicament »………………………71
[Link]. Cas d’utilisation« annuler une commande »……………….…..71

[Link]. Cas d’utilisation« facturation »…………….……………………71

[Link]. Cas d’utilisation« vente médicament »…………………….……72

[Link]. Cas d’utilisation « s’authentifier »……………………………...72

[Link]. Cas d’utilisation « effectuer une commande »………………..73
4.3.3. Diagramme de séquence système………………………………….73

[Link]. Cas d’utilisation crée compte………….………………………...73

4.3.3.2Cas d’utilisation supprimé médicament.…………………………74

4.3.3.3Cas d’utilisation modifier médicament……….………………….74

[Link] Cas d’utilisation rechercher médicament.……………………....75

[Link] Cas d’utilisation ajouter médicament.………………………..…75

[Link] Cas d’utilisation annuler commande ……….………………….76

[Link] Cas d’utilisation facturation ……………..……………………..76

[Link]. Cas d’utilisation vente médicament …………..………………..77

[Link] Cas d’utilisation s’authentifier………………..…………………78

[Link] Cas d’utilisation effectuer une commande….…………………78

4.3.4. Diagramme d’activité………………………….………………..…79

[Link] crée compte ……………………………….…………………..…79

[Link] supprimer médicament …………….…………………………...80

[Link] modifier médicament……………..……………………………...81

4.3.4.4rechercher médicament………..………………………………...82

[Link] ajouter médicament………..………………………………….…82

[Link] annuler une commandes…………………………………………83

[Link] Facturation ……………………………………………………….84

[Link] Vente médicament………………….………..……………………85

[Link] S’authentifier ……………………..……………………………...86

[Link] Effectuer une commande ..……………………………………..86

4.3.5. Diagramme de classe participant……………………………..…..87

[Link] crée compte…………………………………………..……………87

[Link] Supprimer médicament……………………..……………………87

[Link] Modifier médicament…………….………………………………88

[Link] rechercher médicament……………………………………….…89

[Link] Ajouter médicament……….…………………………………….90

[Link] Annuler une commande….………………………………………90

[Link] Facturation……….……………………………………………….91

[Link] Vente médicament………………..……………………………….91

[Link] S'authentifier …………..…………………………………………92

[Link] Effecteur une commande…………………………….…………92

4.3.6. Diagramme de modèle de domaine………….…………………...93

4.4. Conclusion ……………………………..………………………….....93

Chapitre 05 : Conception et réalisation

5.1. Introduction………………………………………………………..…94

5.2. Les interface de notre site…………………………………………....94

5.2.1 Page d’accueil ………….……………………………………………94

5.2.2Page Authentifier ……………………………………………………95

5.2.3 Page message d’erreur d’Authentifier …………………………....96

5.2.4 Page d’inscription ……………………………….………….…….97

5.2.5. Page message d’erreur de l’inscription ………..……………….98

5.2.6. Page guide des médicaments ………….………………………...99

5.2.7. Qui somme nous ?.........................................................................100

5.2.8. La recherche…………..………………………………………......101

5.2.9. Page mise à jour des médicaments…………………………….....102

5.2.10. Page d’administrateur……………………………………………103

5.2.11 Conclusion…………………………………………………………103

CONCLUSION GENERALE..……………………………………..……..104
Bibliographie..……………………………………...…………………..…105
 Liste des figures
Chapitre 01 : Technologie web
Figure 1.1:l’internet....................................................................................................23
Figure 1.2 : L’E-mail........................................................................................24

Figure 1.3 : Le modèle OSI…………………………………………………………..27

Figure 1.4 : OSI et TCP/IP…………………………………………………………...28

Figure 1.5 : site statique………………………………………………………………29

Figure 1.6: site dynamique……………………………………………………………30

Figure 1.7 : architecture client/serveur………………………………………………31

Figure 1.8: les navigateurs web……………………………………………………….32

Figure 1.9: L’URL……………………………………………………………………33

Figure 1.10 : www……………………………………………………………………..34

Chapitre 02 : UML et le processus unifié (up)

Figure 2.1 : UML………………………………………………………………………36

Figure 2.2 : L’historique d’UML…………………………………………………..…37

Figure 2.3 : Schéma de la hiérarchie des diagrammes d’UML 2.0……………..….39

Figure 2.4 : Représentation d’un acteur……………………………………….…….40

Figure 2.5 : Représentations de cas d’utilisation…………………………………….41

Figure 2.6 : Représentations de relation d’inclusion…………………………….…..41

Figure 2.7 : Représentations de relation d’extension………………………………..41

Figure 2.8: Relation de généralisation…………………………………………….….42

Figure 2.9 : Représentation de relation d’association…………………………….…42

Figure 2.10 : Représentation d’une ligne de vie…………………………………..…43

Figure 2.11 : Représentation d’un message synchrone..……………………………..43

Figure 2.12 : Représentation d’un message asynchrone……………………….…..44

Figure 2.13 : Schéma qui présente fragment loop………………………………….44

Figure 2.14 : schéma qui présente fragment opt…………………………….……..45

Figure 2.15 : Schéma qui présente fragment Alt…….……………………….……45

Figure 2.16 : Représentations d’une classe……………………………………..….46

Figure 2.17 : Relation d’association…………………………………..………….…46

Figure 2.18 : Cardinalité d’une relation entre les classes…………………………46

Figure 2.19:Nœud initial………………………………………………………….....47

Figure 2.20:Nœud final…………………………………………………………...…47

Figure 2.21 : Représentations d’action………………………………….…..……..47

Figure 2.22 : Représentations d’une transition……………………………….…...48

Figure 2.23 : Représentations d’un nœud de décisions…………………………...48

Figure 2.24 : Représentations d’une jonction……………………………………..49

Chapitre 03: Les langages de programmation et les outils de travails

Figure 3.1: HTML………………………………………………………………………..…53

Figure 3.2 : CSS………………………………………………………………………..……53

Figure 3.3 : PHP……………………………………………………………………….….…54

Figure 3.4 : JavaScript………………………………………………………………….…..55

Figure 3.5 : PHP MyAdmin……………………………………………………………...…56

Figure 3.6: MYSQL………………………………………………………………………...57

Figure 3.7: Adobe Photoshop Portable………………………………………………..…..58

Figure 3.8 : Notepad++………………………………………………………………….....58

Figure 3.9 : Mozilla Firefox……………………………………………………………...…59

Figure 3.10 : Wamp server………………………………………………………………...59

Figure 3.11:UML PacesterDiagrammer………………………………………………….60

Figure 3.12: la présentation de Joomla……………………………………………………61

Chapitre 04 : La modélisation UML de site web

Figure 4.1 : Diagramme de cas d’utilisation……………………………………………….68

Figure 4.2: Diagramme de séquence systèmecrée compte………………………………..73

Figure 4.3: Diagramme de séquence système supprimé médicament……………………74

Figure 4.4: Diagramme de séquence système modifié médicament……………..……….74

Figure 4.5: Diagramme de séquence système rechercher médicament…………..……...75

Figure 4.6: Diagramme de séquence système ajouter médicament……………………..75

Figure 4.7: Diagramme de séquence système annuler commande……………………...76

Figure 4.8: Diagramme de séquence système facturation……………………………….76

Figure 4.9: Diagramme de séquence systèmevente médicament………………….……..77

Figure 4.10: Diagramme de séquence systèmes’authentifier…………………….……....78

Figure 4.11: Diagramme de séquence systèmeeffectuer une commande………..……...78

Figure 4.12: Diagramme d’activité crée compte……………………………..………....…79

Figure 4.13: Diagramme d’activité supprimer un médicament……………………….…80

Figure 4.14: Diagramme d’activité modifier médicament…………………………..……81

Figure 4.15: Diagramme d’activité rechercher médicament……………………………..82

Figure 4.16 : Diagrammed’activité ajouter médicament……………..…………….……82

Figure 4.17: Diagramme d’activité annuler commande……………………………..……83

Figure 4.18: Diagramme d’activité facturation……………………………………………84

Figure 4.19: Diagramme d’activité vente médicament………………………..…………..85

Figure 4.20: Diagramme d’activité s’authentifie………………………………..………...86

Figure 4.21: Diagramme d’activité effectuer une commande………………………….…86

Figure 4.22: Diagramme de classe participant créer compte……………………………..87

Figure 4.23: Diagramme de classe participant supprimer médicament……………..….87

Figure 4.24: Diagramme de classe participant modifier médicament……………….…88

Figure 4.25: Diagramme de classe participant rechercher médicament………………...89

Figure 4.26: Diagramme de classe participant ajouter médicament………….…………90

Figure 4.27: Diagramme de classe participant annuler un commande……………….…90

Figure 4.28: Diagramme de classe participant facturation……………………….………91

Figure 4.29: Diagramme de classe participant vente médicament………………..……...91

Figure 4.30 : Diagrammede classe participant s’authentifier………………………...….92

Figure 4.31: Diagramme de classe participante effectuer une commande…………...….92

Figure 4.32: Diagramme de modèle de domaine……………………………………..……93

Chapitre 05 : Conception et réalisation

Figure 5.1: page d’accueil…………………………………………………………….…….94

Figure 5.2: Authentifier…………………………………………………………….….......95

Figure 5.3: message d’erreur d’authentifier……………………………………………...96

Figure 5.4 : Page d’inscription………………………………………………………..…..97

Figure 5.6: message d’erreur d’inscription……………………………………..…..……98

Figure 5.7: page guide médicament……………………………………………….….…..99

Figure 5.8 : Page Qui somme nous ?..........................................................................100

Figure 5.9 : Page de rechercher médicament……………………………………….……101

Figure 5.10 : Page de mise à jour des médicaments………….………………………….102

Figure 5.11 : Page modifier l’espace administrateur…………………………………….103

 Liste des tableaux

Chapitre 04 : la modélisation UML de site web

Tableau 4.1: Fiche descriptive de cas d’utilisation Crée un compte………………….…69

Tableau 4.2 : Fiche descriptive de cas d’utilisation Supprimer un médicament……….69

Tableau 4.3: Fiche descriptive de cas d’utilisation modifier un médicament…………..70

Tableau 4.4: Fiche descriptive de cas d’utilisation rechercher médicament…………....70

Tableau 4.5: Fiche descriptive de cas d’utilisation ajouté médicament…………….……71

Tableau 4.6: Fiche descriptive de cas d’utilisation annuler une commande………….…71

Tableau 4.7: Fiche descriptive de cas d’utilisation facturation………………………..…71
Tableau 4.8: Fiche descriptive de cas d’utilisation vente médicament…………………..72

Tableau 4.9: Fiche descriptive de cas d’utilisation s’authentifier……………………….72

Tableau 4.10: Fiche descriptive de cas d’utilisation effectuer une commande………….73

Introduction générale

Aujourd’hui la réalisation du web est très nécessaire dans les déférents besoins
techniques ou, économie ou, le commerce électronique…etc.
L’internet offre des possibilités considérables et accroit les chances de communication
à travers un lieu virtuel.
En Algérie, pour acheter un médicament, les clients doivent se déplacer vers une
pharmacie donc dans notre projet nous allons essayer de réaliser un site web
dynamique. Pour simplifier l’opération de vente et l’achat des médicaments.
En appliquant un processus de développement repose sur une conception qui utilise
des diagrammes du langage UML.
Et utiliser aussi des outils de travail tels que PHP myadmin et MYSQL…etc., et utiliser le
langage principale Joomla.
Le mémoire est constitué de 5 chapitres :
Le premier chapitre nous allons définir l’internet, le site web, le Word wide web et les
différant services d’internet.
Le deuxième chapitre s'intéresse au langage UML et ses diagrammes, en plus, le
Processus unifié (UP) qui est un processus de développement logiciel définit une
séquence d’étapes
Le troisième chapitre est consacré les outils de développement que nous avons utilisé
Tels que : PHP, MySQL, HTML et aussi le langage Joomla qui peut créer le site web
dynamique.
Le quatrième chapitre est consacré à notre conception, par la définition des différents
Acteurs et les cas d’utilisations, et puis la proposition des différents diagrammes de cas
D’utilisations, les fiches descriptives, les diagrammes de séquences système et les
digrammes d’activités.
Enfin, Le cinquième chapitre présente le résultat de notre implémentation résumé
Dans quelques interfaces de notre site web.

21
 Chapitre 01

Technologie web
CHAPITRE 01 TECHNOLOGIE WEB

1.1. Introduction

Bien que les concepts techniques fondamentaux aient été imaginé dès le début des
années 60, en peut dire que internet est née au moins de septembre 1969, L’application qui
a fait connaitre Internet au public est le World Wilde Web, autrement dit le Web.

Section01 : Internet

1.2. Définition

L'Internet est un système de communication qui permet aux ordinateurs autour du

monde de communiquer et de s'échanger de l'information entre eux. Cette communication
entre ordinateurs permet plusieurs possibilités et offre une masse d'informations chaque
jour plus important dans des domaines comme la médecine, la science et la technologie. [1]

Figure 1.1:l’internet

1.3. Historique d’internet

Histoire d’Internet remonte au développement des premiers réseaux de

télécommunication. L’idée d’un réseau informatique, permettant aux utilisateurs de
différents ordinateurs de communiquer, se développa par de nombreuses étapes
successives. La somme de tous ces développements conduisit au « réseau des réseaux »
(network of networks) que nous connaissons aujourd’hui en tant que l’internet. Il est le
fruit à la fois de développements technologiques et du regroupement d’infrastructures
réseau existantes et de systèmes de télécommunications. Les premières versions mettant

23
CHAPITRE 01 TECHNOLOGIE WEB

en place ces idées apparurent à la fin des années1950. L’application pratique de ces
concepts commença à la fin des années 1960. Dès les années 1980, les techniques que
nous reconnaissons maintenant comme les fondements d’Internet moderne
commencèrent à se répandre autour du globe. Dans les années 1990, sa popularisation
passa par l’apparition du World Wide Web. [2]

1.4. Le rôle d’internet

 Permet de partager les informations personnelles.

 Permet dés échanger des données et des courriers.
 Permet la distance et supprimer les frontières entre les nations. [3]

1.5. Les services d’internet

1.5.1. Services de dialogue

[Link]. Le courrier électronique ou l'E-mail (courriel)

Le courrier électronique service (dans le web) le plus utilisé d'internet, il permet de

transmission des messages écrit, d'envoyer tous types ladocument, d’un ordinateur à un
autre en quelques secondes électroniquement en utilisant un réseau informatique (internet).

Figure1.2 : L’E-mail

[Link]. Les forums de discussion (news)

Un forum de discussion est un espace de discussion asynchrone sur un site web ou sur un
service en ligne qui permet aux internautes d’échanger, de poser des questions ou de poster
des réponses sur les thématiques proposées.

24
CHAPITRE 01 TECHNOLOGIE WEB

1.5.2. Service d’information

 Le Web (WWW)

Le service le plus connu, le plus récent et maintenant le plus utilisée. Il s’agit d’un jeu de
pages interconnectées qui constituent différents sites Web. Les pages Web utilisent des
liens spéciaux qui prennent la forme de texte en surbrillance ou de graphismes. Il suffit de
cliquer sur un lien pour être transporté vers une nouvelle page qui peut se trouver à l’autre
bout de la planète. Sans efforts, le Web nous fait passer de pages en pages et de sites en
site. [4]

1.6. Les protocoles

1.6.1. Définition

Le protocole est un ensemble de règles (codes) à respecter pour établir un échange

d’informations entre ordinateurs. Le protocole plus utilisé par l’Internet est le TCP/ IP
(Transmission Control Protocol / Internet Protocol). Il permet l’envoi des données par
petits paquets. Il existe d’autres types de protocoles tels que le FTP, http …etc. [3]

1.6.2. Les protocolesde transmissions TCP/IP

TCP/IP est une suite de protocoles. Le sigle TCP/IP signifie «Transmission Control
Protocol/Internet Protocol». Il provient des noms des deux protocoles majeurs de la suite
de protocoles, c'est-à-dire les protocoles TCP et IP). TCP/IP représente d'une certaine
façon l'ensemble des règles de communication sur internet et se base sur la notion
adressage IP, c'est-à-dire le fait de fournir une adresse IP unique à chaque machine du
réseau afin de pouvoir acheminer des paquets de données. Etant donné que la suite de
protocoles TCP/IP a été créée à l'origine dans un but militaire, elle est conçue pour
répondre à un certain nombre de critères parmi lesquels :

 Le fractionnement des messages en paquets.

 L'utilisation d'un système d'adresses.
 L'acheminement des données sur le réseau (routage).
 Le contrôle des erreurs de transmission de données. [3]

25
CHAPITRE 01 TECHNOLOGIE WEB

[Link]. Le protocole TCP

Le protocole TCP (Transmission Control Protocol) correspond à la couche 4(transport)

du modèle OSI qui présente les services les plus importants (des services fiables et non
fiables) pour interconnecter les ordinateurs avec des réseaux.

[Link]. Le protocole IP

Le protocole IP (Internet Protocol) correspond à la couche 3 (réseau) du modèle OSI

qui permet l’interconnexion de sous-réseaux. Il est souvent associé à un protocole de
contrôle de la transmission des données appelé TCP, on parle ainsi du protocole TCP/IP.

1.6.3. Les protocoles de communications

Est un ensemble des règles et des conventions déterminant de procédures permettant à

deux entités de communiquer.

[Link] Le protocole HTTP

Le protocole HTTP (HyperText Transfer Protocol) est le protocole le plus utilisé sur
Internet depuis 1990. Le but du protocole HTTP est de permettre un transfert de fichiers
(essentiellement au format HTML) localisés grâce à une chaîne de caractères appelée URL
entre un navigateur (le client) et un serveur L’URL est l'adressage standard de n'importe
quel document, sur n'importe quel ordinateur en local ou sur Internet. [3]

[Link] Le protocole DNS

Le protocole DNS (Domain Name System) est un système hiérarchique, redondant et

distribué de noms pour le réseau internet. C’est service d’annuaire internet qui permet de
convertir les noms en adresse IP. Il est constitué de deux composantes principales : les
donnée DNS et les serveurs. [5]

1.7. Modèle OSI (Open Systems Interconnexion)

1.7.1. Définition

Est un ensemble de règles applicable de façon générale à tous les réseaux.

Il est très important, c’est le meilleur outil disponible pour d’écrire l’envoi et la réception
de données sur un réseau.

26
CHAPITRE 01 TECHNOLOGIE WEB

En réalité le modèle TCP/IP a été développé à peu près au même moment que le modèle
OSI, c'est la raison pour laquelle il s'en inspire mais n'est pas totalement conforme aux
spécifications du modèle OSI. Il est constitué de sept couches qui sont les suivantes :

Niveau Ancien modèle Nouveau modèle

Niveau 7 Couche Application Niveau Application
Niveau 6 Couche Présentation Niveau Présentation
Niveau 5 Couche Session Niveau Session
Niveau 4 Couche Transport Niveau Message
Niveau 3 Couche Réseau Niveau Paquet
Niveau 2 Couche Liaison Données Niveau Trame
Niveau 1 Couche Physique Niveau Physique

Figure 1.3 : Le modèle OSI.

 La couche physique : définit la façon dont les données sont physiquement

converties en signaux numériques sur le média de communication (impulsions
électriques, modulation de la lumière, etc.).
 La couche liaison données : définit l'interface avec la carte réseau et le
partage du média de transmission.
 La couche réseau : permet de gérer l'adressage et le routage des données,
c'est-à-dire leur acheminement via le réseau. [3]
 La couche transport : est chargée du transport des données, de leur
découpage en paquets et de la gestion des éventuelles erreurs de transmission.
 La couche session : définit l'ouverture et la destruction des sessions de
communication entre les machines du réseau.
 La couche présentation : définit le format des données manipulées par le
niveau applicatif (leur représentation, éventuellement leur compression et leur
chiffrement) indépendamment du système.
 La couche application : assure l'interface avec les applications. Il s'agit
donc du niveau le plus proche des utilisateurs, géré directement par les logiciels.[6]

27
CHAPITRE 01 TECHNOLOGIE WEB

1.7.2. La déférence entre le modèle OSI et modèle TCP/IP

Figure1.4: OSI et TCP/IP.

Section 02: World Wide Web

1.1. Definition d’un site web

Un site internet est un dossier présent sur un ordinateur distant appelé serveur (on
l’appelle également hébergeur), il est connecté en permanence à internet. Ce dossier
accueille les pages du site web, qui sont accessibles via une adresse unique. [3]

1.2. Les types d’un site web

Il existe deux principaux types lors de la création d'un site Internet : le site statique et le
site dynamique.

1.2.1. Les sites statiques

On dit qu’un page web est statique lorsque leur contenu est fixé à l’avance car. Il n’est
pas modifiable par l’utilisateur. La maintenance de ce type des sites se fait par

28
CHAPITRE 01 TECHNOLOGIE WEB

l’administrateur. Une fois le site mis à jour sur l'ordinateur de l'administrateur, celui-ci
devra être envoyé sur le site via FTP. Un site est dit statique car les pages HTML qui le
compose sont toujours identiques entre deux visites sans mise à jour. [7]

Figure 1.5 : site statique.

Les avantages d’un site statique

 Moins cher.
 Chaque page est construite séparément les un des autres (ses pages sont
individuelles).
 plus rapide pour l'internaute.
 manipulation du design plus facile (il est plus simple de changer / ajouter
certaines mises en forme).

1.2.2. Les sites dynamiques

Dont les informations des pages sont variables selon différents paramètres : l'heure de la
visite, le visiteur, etc. Le site dynamique se réalise généralement grâce aux scripts PHP,
Cold Fusion ou encore ASP. [8]

Figure 1.6: site dynamique.

29
CHAPITRE 01 TECHNOLOGIE WEB

Les avantages d’un site dynamique

 La mise à jour est très simple : une fois le script dynamique en place, on met
à jour le site en ligne dans la partie «administration» du site. On peut donc mettre
à jour le site de n'importe quel ordinateur et même depuis certains téléphones
mobiles.
 Avec un site dynamique il est possible de réaliser une grande interaction
avec les visiteurs : les visiteurs peuvent donc reste beaucoup plus longtemps sur
vos pages si les fonctionnalités sont intéressantes. [7]

1.3. Les applications de site web

En informatique, une application Web (aussi appelée Web pp) est un logiciel applicatif
manipulable grâce à un navigateur Web. De la même manière que les sites Web, une
application Web est généralement placée sur un serveur et se manipule en actionnant des
bides (composent d’interface graphique) à l'aide d'un navigateur Web.

Les applications web sont souvent créées par des équipes composées à la fois de
développeurs et de designers. Le développement nécessite la connaissance des différents
langages utilisés dans les technologies du Web : HTML pour la présentation des pages,
CSS pour la charte graphique, JavaScript, Java ou Action Script pour les automatismes
exécutés par le client, ainsi qu'un langage tels que par exemple Java, PHP, C# ou VB
Script pour les automatismes exécutés par le serveur. Le navigateur web est le logiciel qui
affiche les résultats envoyés par le serveur, reçoit les manipulations de l'utilisateur et les
transmet au serveur. [9]

30
CHAPITRE 01 TECHNOLOGIE WEB

1.4. L’architecture Client/serveur

1.4.1. Définition

Est un ensemble des ordinateurs clients liées à une machine serveur, cette architecture
propose un environnement ouvert. Les applications client s'exécutent obligatoirement sur
des PC, chaque machine client demande un service par l'envoi d’une requête et à la suite la
réception d’une réponse.

Figure 1.7 : Architecture client/serveur.

1.4.2. Client web : est un logiciel utilisé pour demander des pages web du serveur web. Le
client envoie des requêtes au serveur à que l’utilisation veut ramener des informations
disponibles à des serveurs. Il est appelé aussi le navigateur web.

1.4.3. Le serveur web : serveur est un ordinateur qui répond à la requête émise par les
clients web le serveur web est généralement un ordinateur très nécessaire pour la capacité
des traitements et des stockages.

1.4.4. Requête : C’est un message écrit pour en savoir davantage sur l’information envoyé
par le client au serveur web.

1.4. 5. Réponse : C’est un message envoyé par le serveur web à un client web. Le message
doit être soit sous la forme de texte ou l'image ...... etc.

31
CHAPITRE 01 TECHNOLOGIE WEB

1.5. Navigateur web

1.5.1. Définition
Le «navigateur» est l'outil de l'internaute, lui permettant de surfer entre les pages web de
ses sites préférés. Il s'agit d'un logiciel possédant une interface graphique composée de
boutons de navigation, d'une barre d'adresse, d'une barre d'état (généralement en bas de
fenêtre) et dont la majeure partie de la surface sert à afficher les pages web. [7]

Figure 1.8: les navigateurs web

1.5.2. Le rôle
 permet d'afficher des sites web.
 lit les langages HTML et CSS pour savoir ce qu'il doit afficher.

1.6. Hébergeur web

1.6.1. Définition
Un hébergeur web (ou hébergeur internet) est une entité ayant pour vocation de mettre à
la disposition des internautes des sites web conçus et gérés par des tiers. Il donne ainsi
accès à tous les internautes au contenu déposé dans leurs comptes par les webmestres
souvent via un logiciel FTP ou un gestionnaire de fichiers. Pour cela, il maintient des
ordinateurs allumés et connectés 24 heures sur 24 à Internet (desserveur web par Exemple)
par une connexion à très haut débit (plusieurs centaines de Mb/s), sur lesquels sont
installés des logiciels : serveur http (souvent Apache), serveur de messagerie, de base de
données...etc. [7]
.1.6.2. Le rôle
 Fournir de la bande passante.
 Fournir de la puissance CPU.
 Un service 24h sur 24h, 7 jour/7jour.

32
CHAPITRE 01 TECHNOLOGIE WEB

1.6.3. Les différentes catégories d’hébergeurs

On distingue les principales catégories d’hébergeur :

 Hébergeur gratuit.
 Hébergeurs professionnels.
 L’hébergement mutualisé.
 L’hébergement dédié.
 Colocation.
 Activité d’hébergeur.

1.7. L’URL (adresse web)

1.7.1. Définition
Le sigle URL (Uniform Ressource Locator) ou appelées aussi adresse web, ce terme
utilisée pour adresser les ressources de la world wide web (document HTML, image,
forum Usenet, boite de courrier électronique et d’autres. L'URL est utilisée pour identifier
les pages et les sites web.
L’adresse web est une adresse unique pour chaque ressource sur le web.
Exemple :

Figure 1.9: L’URL

33
CHAPITRE 01 TECHNOLOGIE WEB

1.7.2. Le World Wide Web (www)

Le www est le service le plus reconnus parmi les services Internet. Le Web est le
service qui offre sur l’Internet une interface graphique permettant par simple pointage
d’accéder, à des documents sur le réseau contenant du texte, des images statiques, des sons,
des images animées, des liens, …etc. L’accès aux documents se fait en utilisant un logiciel
de consultation (browser, aussi appelé navigateur) qui gère l’interface graphique de
l’utilisateur et les liens permettant par un simple clic de la souris d’accéder au document
ainsi désigné. [7]

Figure 1.10 : www

1.7.3. Page web

Une page web est une ressource de la world wide web conçue pour être consultée par
des visiteurs à l’aide d’un navigateur web. Elle a une adresse web. Techniquement, une
page Web est souvent constituée d'un document en HyperText Markup Langage (HTML)
et d’images. Cependant, tout type de ressources ou d'assemblage de ressources, textuelles,
visuelles, sonores, logicielles, peuvent constituer une page Web. [2]

34
CHAPITRE 01 TECHNOLOGIE WEB

1.8. Conclusion

S'il ya un phénomène caractérisé par le monde de l'informatique dans ces derniers

temps il est l'internet que le World Wide Web a été établi près de 50 ans, qui sont en effet
réseau vigilants car nous avons trouvé dans la plupart des pays du monde, et donc
accessible à tout le monde sert de source d'information et un moyen de divertissement et de
la culture etc. ......... nous avons fourni dans ce chapitre le mécanisme de transfert de
l'information sur Internet et de ses services ainsi que toutes sortes, nous allons examiner le
chapitre suivant pour montrer les concepts de base d’ UML.

35
 Chapitre02
UML et leprocessus
unifié (up)
CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

Section 01 : UML (Langage de modélisation unifié)

2.1. Introduction

Dans ce chapitre on propose une présentation générale d’UML, d’UP et de ses domaines
d’application. Le langage UML a été Utilisé pour modéliser le système et le logiciel pour
réaliser les diagrammes. Donc ce chapitre réponde aux questions suivantes :

Qu’est-ce que c’est UML ?

Qu’est-ce que c’est UP ?

2.2. Définition

UML (sigle désignant Unified Modeling Language ou « langage de modélisation unifié »)

est un langage de modélisation graphique à base de pictogramme. Il est apparu dans le monde
du génie logiciel. C’est une méthode de modélisation orientée objet développée en réponse à
l’appel à propositions lancé par l’OMG (Object Management Group) dans le but de définir la
notation standard pour la modélisation des applications construites à l’aide d’objets. [10]

Figure 2.1 : UML.

2.3. Historique

 Les années 1980: Utilisation de méthodes adaptées à la programmation impérative

(notamment Merise)
 Fin 80 / début 90 la programmation par objets prend de l’importance.
 Conséquence naturelle: mise en place de méthodes orientées objet. Plus de cinquante
méthodes apparaissent entre 1990 et 1995:
 OOD : Object Oriented Design (Booch, 1991)
 HOOD : Hierarchical Object Oriented Design (Delatte et al., 1993)
 OOA : Object Oriented Analysis (Schlaer, Mellor, 1992)
 OOA/OOD : (Coad, Yourdon, 1991)

36
CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

 OMT : Object Modelling Technique (Rumbaugh, 1991)

 OOSE : Object Oriented Software Engineering (Jacobson, 1992)
 OOM : Object Oriented Merise (Bouzeghoub, Rochfeld, 1993)
 Fusion (Coleman et al. 1994)
 Les méthodes proposées définissent des concepts assez proches avec des notations
différentes.
 1994 : le consensus se fait autour de trois méthodes :
 OMT (Object Modeling Technique) de James Rumbaugh fournit une représentation
graphique des aspects statique, dynamique et fonctionnel d’un système ;
 OOD (Object Oriented Design) de GradyBooch, définie pour le Département of
Defense, introduit le concept de paquetage (package) ;
 OOSE (Object Oriented Software Engineering) d’Ivar Jacobson fonde l’analyse sur la
description des besoins des utilisateurs (cas d’utilisation, ou use cases).
 1995 : Fusion des 3 principales méthodes pour définir un langage de modélisation
commun: UML (UnifiedModeling Langage). [11]

Figure 2.2 : L’historiqued’UML.

37
CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

2.4. Les points forts d'UML

 UML est un langage formel et normalisé.

 Gain de précision.
 Gage de stabilité.
 Encourage l'utilisation d'outils.
 UML est un support de communication performant.
 Il cadre l'analyse.
 Il facilite la compréhension de représentations abstraites complexes.
 Son caractère polyvalent et sa souplesse en font un langage universel. [12]
2.5. Les points faibles d'UML

 La mise en pratique d'UML nécessite un apprentissage et passe par une période

d'adaptation.
 UML n'est pas une méthodedans la mesure où elle ne présente aucune démarche. [12]
2.6. Les diagrammes d’UML

Un diagramme UML est une représentation graphique, qui s'intéresse à un aspect précis du
modèle, dans sa version 2.0 s'articule autour de treize diagrammes, Chaque type de
diagramme UML possède une structure (les types des éléments de modélisation qui le
composent sont prédéfinis).

Un type de diagramme UML véhicule une sémantique précise (un type de diagramme offre
toujours la même vue d'un système).

Ces diagrammes sont regroupés dans deux grands ensembles: les diagrammes structurels et
les diagrammes de comportements

2.7. Les différents diagrammes d’UML

Il existe 2 types de diagramme :

Six diagrammes structurels (diagrammes statiques)

 diagramme de classes.
 diagramme d’objets.

38
CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

 diagramme de composants.
 diagramme de déploiement.
 diagramme de paquetages.
 diagramme de structures composites.
Sept diagrammes comportementaux (diagrammes dynamiques)

 diagramme de cas d’utilisation.

 diagramme d’activités.
 diagramme d’états-transitions.
 diagramme de séquence.
 diagramme de communication.
 diagramme global d’interaction.
 diagramme de temps.

Figure 2.3 : Schéma de la hiérarchie des diagrammes d’UML 2.0.

2.8. Caractéristiques d’UML

Parmi les caractéristiques attrayantes en UML nous pouvons citer :

 UML est un langage standard de modélisation non spécifique à un domaine.
 UML est un langage graphique qui facilite la compréhension et la communication des
acteurs du même objet.
 UML propose une notation qui permet de présenter graphiquement les éléments de
modélisation
 UML fournit une unification des notations et des méthodes de modélisation.

39
CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

 UML fournit une lisibilité pour les utilisateurs et une facilité d’utilisation pour les
concepteurs.
 UML c’est un moyen de définir la structure d’un programme. [13]

2.9. Présentation des diagrammes utilisés

2.9.1. Diagramme de cas d'utilisation

 Définition :
Les cas d'utilisation sont une technique de description du système étudié selon le
point de vue de l'utilisateur. Ils décrivent sous la forme d'actions et de réactions le
comportement d'un système. Donc, le diagramme des cas d’utilisation, permet
d'identifier les possibilités d'interaction entre le système et les acteurs. Il permet de
clarifier, filtrer et organiser les besoins. [10]

 Les éléments d’un diagramme de cas d’utilisation

 Acteur : Un acteur est le rôle joué par une entité externe (personne, un autre système,…)
qui interagit avec le système.
Un acteur se représente par un petit bonhomme.

« Acteur »
Nom de l’acteur

Figure 2.4 : Représentation d’un acteur.

40
 CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

 Cas d’utilisation : Un cas d'utilisation représente une unité discrète d'interaction entre un
utilisateur (humain ou machine) et un système.
Un cas d’utilisation (use case) représente un ensemble de séquences d’action qui sont
réalisées par le système et qui produisent un résultat observable intéressant pour un acteur
particulier. Un cas d’utilisation modélise un service rendu par le système. Il exprime les
interactions acteurs/système et apporte une valeur (notable) à l’acteur concerné [14]

Nom du cas d’utilisation

Figure 2.5 : Représentations de cas d’utilisation.

 Relations dans les diagrammes de cas d’utilisation

 Relation d’inclusion :
Un cas A inclut un cas B si le comportement décrit par le cas A inclut le comportement du
cas B (B est une partie de A).

Figure 2.6 : Représentations de relation d’inclusion.

 Relation d’extension :
Une relation d’extension d’un cas d’utilisation A par un cas d’utilisation B signifie qu’une
instance de A peut être étendue par le comportement décrit dans B. Cette extension est
symbolisée par une flèche discontinue stéréotypé «extend».

Figure 2.7 : Représentations de relation d’extension.

41
 CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

 Relation de généralisation/spécialisation :
Un cas A est une généralisation d’un cas B si B est un cas particulier de A. Cette relation
de généralisation/spécialisation est présente dans la plupart des diagrammes UML. Une flèche
dont la pointe (un triangle fermé) est dirigée vers le cas d’utilisation le Plus général.

Figure 2.8: Relation de généralisation.

 relation d’association
Une relation d’association est un lien de communication entre un acteur et un cas d’utilisation.

Elle est représentée par un trait continu

Figure 2.9 : Représentation de relation d’association.

2.9.2. Diagramme de séquences

 Définition : Les diagrammes de séquences sont la représentation graphique des

interactions entre les acteurs et les objets du système selon un ordre chronologique. Ils
permettent de représenter un système pendant son exécution.

42
CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

 Les éléments du diagramme de séquence :

 Lignes de vie
Une ligne de vie représente un objet qui participe à l’interaction.

Graphiquement, une ligne de vie se représente par un rectangle, auquel est accrochée
une ligne verticale pointillée, contenant une étiquette dont la syntaxe est :

[<Nom de l’objet>] : [<nom de la classe>]. [11]

Figure 2.10 : Représentation d’une ligne de vie.

 Message :
Un message représente la spécification d’une communication unidirectionnelle entre
objets qui transporte de l’information avec l’intention de déclencher une activité chez le
récepteur. [11] .Il Ya deux types nécessaires sont :

 Messages synchrones
L’émetteur reste bloqué le temps que le récepteur traite le message envoyé et envoie la
réponse. Graphiquement, un message synchrone se représente par une flèche en traits
pleins et à l’extrémité pleine, suivi d’une réponse qui se représente par une flèche en
discontinue. [11]

Figure 2.11 : Représentation d’un message synchrone.

43
 CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

 Messages asynchrones
L’émetteur n’est pas bloqué lorsque le récepteur traite le message envoyé. Graphiquement,
un message asynchrone se représente par une flèche en traits pleins et à l’extrémité ouverte.

Dans la pratique, la plupart des invocations sont synchrones (l’émetteur reste bloqué le temps
que dure l’invocation de l’opération). [11]

Figure 2.12 : Représentation d’un message asynchrone.

 Les cadres d'interactions

Les principaux opérateurs sont :

 Loop (boucle): Le fragment peut s’exécuter Plusieurs fois, et la condition de garde explicite
l’itération.

Figure 2.13 : Schéma qui présente fragment loop.

44
 CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

 Opt (optionnel) : Le fragment ne s’exécute que si la condition fournie est vraie.

Figure 2.14 : schéma qui présente fragment opt

 Alt (fragments alternatifs): Seul le fragment possédant la condition vraie

s’exécutera.

Figure 2.15 : Schéma qui présente fragment Alt.

2.9.3. Diagramme de classe
 Définition

Le diagramme de classes est un diagramme UML qui permet de modéliser les classes du
système et leurs relations (association, généralisation,…). Il fournit une représentation
abstraite des objets du système qui vont interagir ensemble pour réaliser les fonctionnalités du
système. [11]

45
 CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

 Les éléments du diagramme de classe

Classe : Représentera la description abstraite d'un ensemble d'objets possédant les mêmes
caractéristiques. est représenté Comme :

Nom

Attributs

Méthodes

Figure 2.16 : Représentations d’une classe.

 Attribut : Représente un type d'information contenu dans une classe. Il représente la
modélisation d’une information élémentaire représentée par son nom et son format.
 L’objet: Est une entité aux frontières bien définies, possédant une identité et encapsulant
un état et un comportement. Un objet est une instance (ou occurrence) d'une classe [15].
 L’opération : Est une fonctionnalité assurée par une classe. Il représente un élément de
comportement (un service) contenu dans une classe.
 Association : C’est une relation entre deux classes. Il représenté par une ligne continue
entre deux classes.

Classe 1 Association

Figure 2.17 : Relation d’association.

 Cardinalité :La cardinalité spécifie le nombre d’objets qui peuvent participer à une
relation avec un objet de l’autre classe dans le cadre d’une association en l’appelle aussi
multiplicité.

Personne Entreprise
Classe 2 * 1

Figure 2.18 : Cardinalité d’une relation entre les classes.

 Superclasse : Est une classe plus générale reliée à une ou plusieurs autres classes plus
spécialisées (sous-classes) par une relation de généralisation [15]

46
 CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

2.9.4. Digramme d’activité

 Définition

Le diagramme d’activité est un diagramme états-transitions simplifié pour lequel les états se
réduisent à de simples actions ou activités et dont les transitions se déclenchent
automatiquement avec éventuellement des gardes. Les diagrammes d'activité sont utilisés
pour documenter le déroulement des opérations dans un système, du niveau commercial au
niveau opérationnel (de haut en bas) [10].

 Les éléments de diagramme d'activité

 Nœud initial : Un nœud initial est un nœud de contrôle à partir duquel le flot débute lorsque
l’activité enveloppante est invoquée. Une activité peut avoir plusieurs nœuds initiaux. [10]

Figure 2.19 : Nœud initial.

 Nœud final : Un nœud final est un nœud de contrôle possédant un ou plusieurs arcs entrants
et aucun arc sortant [10]

Figure 2.20 : Nœud final.

 Action: Les actions sont des étapes discrètes à partir desquelles se construisent les
comportements. Une activité définit un comportement décrit par une séquence d’actions. Elle
est modélisée par plusieurs nœuds reliés par des transitions. [11]

Nom de l’action

Figure 2.21 : Représentations d’action.

 Transition : Une transition est le passage d’une action vers l'action suivante. [11]

Il y’a deux type de transition.

47
 CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

Figure 2.22 : Représentations d’une transition.

 Transition automatique

Déclenchées par la fin d’une activité et provoquent le début immédiate d’une autre. [11]

 Transition gardée

Le passage à l’activité suivante n’est possible que si la condition de la transition est vérifiée.
[11]

 Nœud de décisions
Un nœud de décision permet de faire un choix entre plusieurs flots. Il possède un arc
entrant et plusieurs arcs sortants. Les arcs sortants sont généralement accompagnés de
conditions de garde pour conditionner le choix. [11]

Figure 2.23 : Représentations d’un nœud de décisions.

 Embranchement ou bifurcation (fork)

Un embranchement est la décomposition du flux de contrôle en deux ou plusieurs flux de

contrôle. Les transitions qui partent d’un embranchement ont lieu en même temps. [11]

48
 CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

 Jonction (join)

Une jonction est la recomposition de deux ou plusieurs flux de contrôle en un seul. On ne

franchit une jonction qu’après réalisation de toutes les transitions qui s’y rattachent (Jonction
ou join). [11]

Représentation

Figure 2.24 : Représentations d’une jonction.

 Couloirs d'activités (swimlane)

Afin d'organiser un diagramme d'activités selon les différents responsables des actions
représentées, il est possible de définir des "couloirs d'activités". On peut les utiliser pour
spécifier la classe responsable de la mise en œuvre d’un ensemble d’actions. Dans ce cas, la
classe en question est responsable de l’implémentation du comportement des nœuds inclus
dans son couloir. [11]

Section 02 : Processus unifié (up)

2.1. Définition

Le processus que nous avons choisi pour le développement de notre application est le
processus UP (Unified Process).Ce processus qui utilise UML basé sur les cas d’utilisation,
l’architecture et le développement incrémental. Le processus unifié semble être la solution
idéale pour remédier à l'éternel problème des développeurs. En effet, il regroupe les activités à
mener pour transformer les besoins d'un utilisateur en un système logiciel quel que soit la
classe, la taille et le domaine d'application de ce système. [12]

49
 CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

2.2. Les phases

Il existe quatre phases :

2.2.1. Analyse des besoins

Cette phase porte essentiellement sur les besoins principaux (du point de vue de
l'utilisateur).Il donne une vue du projet sous forme de produit fini.

2.2.2. Elaboration

L'élaboration reprend les éléments de la phase d'analyse des besoins et les précise pour
arriver à une spécification détaillée de la solution à mettre en œuvre.

2.2.3. Construction

Moment où l’on construit le produit. L’architecture de référence se métamorphose en

produit complet, elle est maintenant stable. Le produit contient tous les cas d’utilisation que
les chefs de projet, en accord avec les utilisateurs ont décidé de mettre au point pour cette
version. [12]

2.2.4. Transition

C’est la phase qui finalise le produit. Il suppose des activités comme la formation des
utilisateurs clients, la mise en œuvre d'un service d'assistance et la correction des anomalies
constatées.

2.3. Les Principe de processus

Le processus unifié s'appuie sur les principes suivants :

 Piloté par les cas d’utilisation : Comme nous avons déjà vu, un cas d'utilisation représente
une fonctionnalité qui satisfait un besoin d'un utilisateur. Le processus suit une voie
spécifique, en procédant par une série d'enchaînement d'activités, dérivées d'un cas
d'utilisation. Un cas d'utilisation est analysé, conçu, implémenté et enfin testé. [16]
 Centré sur l'architecture : tout système complexe doit être décomposé en parties modulaires
afin de garantir une maintenance et une évolution facilitées. Cette architecture (fonctionnelle,

50
 CHAPITRE 02 UML ET PROCESSUS UNIFIE(UP)

logique, matérielle, etc.) doit être modélisée en UML et pas seulement documentée en texte.
[12]
 Itératif et incrémental : Vu que les projets à réaliser sont de plus en plus complexes et
grands, l'idée est de découper le travail en mini projets. Chacun d'entre eux représente une
itération qui donne lieu à un incrément. Les itérations désignent des étapes de l'enchaînement
d'activités, tandis que les incréments correspondent à des stades de développement du produit.
[16]
2.4. Conclusion

En conclusion, UML est un outil précieux, et incontournable c’est pourquoi nous avons
présenté les différents diagrammes définit par UML, puis nous avons présenté le processus
unifiés que nous allons utiliser pour modéliser notre application.

51
 Chapitre 03
Le langage de
programmation
et les outils de travails
 CHAPITRE 03 LES LANGAGES DE PROGRAMMATION ET
LES OUTILS DE TRAVAILS

3.1. Introduction

Dans le cadre de ce chapitre, nous allons présenter les langages de programmation et les
outils de travail utilisé pour la conception et la réalisation d’un site, aussi, nous allons
examiner en détail le programme utilisé Joomla pour développer un site dynamique .Donc Ce
chapitre vise à répondre aux questions suivantes:

C’est quoi les langages de programmation ?

C’est quoi les outils de travail ?

Pour quoi utilisé le langage Joomla ?

Section 01 : Les langages de programmations web

3.2. HTML
3.2.1. Définition

HTML « Hyper Texte Mark up Langage » est un langage permettant de décrire les
différents composants d’un document définir des titres, construire des tableaux. Le HTML
est un langage simple rédigé sous forme de texte et qui demande un simple éditeur de texte.
Le lien Hypertexte est un des principaux atouts du langage HTML, un lien permettant à
l’utilisateur d’accéder rapidement à un autre emplacement du document ou à une autre page
sur internet. [17]

La structure générale d'une page HTML est la suivante :

<HTML>

<HEAD>

<TITLE>Titre du document</TITLE>

</HEAD>

<BODY>

...

...

52
 CHAPITRE 03 LES LANGAGES DE PROGRAMMATION ET
LES OUTILS DE TRAVAILS

</BODY>

</HTML>

Figure 3.1: HTML

3.2.2. Les avantages de HTML

 HTML est indépendant de toute marque, il est donc fait pour libérer et non pour rendre
le client captif d'un produit particulier.
 Une page en HTML peut être lue par des ordinateurs de différentes
Marques pour obtenir essentiellement le même résultat.
 Sa structure distribuée (liens externes) permet de changer un élément sans rienchanger
à la page où il s'intègre. Le même élément peut être utilisé plusieurs fois sans devoir le
répéter plusieurs fois.
 Lien réseau: On peut intégrer des éléments locaux dans une page personnelle au des
éléments distants dont on intègre l'adresse (URL).
 L'hypertexte permet de gérer des informations très diversifiées sans devoir les stocker
localement. [3]

3.3. CSS (feuille de style de cascade)

3.3.1. Définition

Cascading Style Sheets, crée par le CSS Working groupe et un système destiné à mettre en
forme les contenus de pages Web. La partie CSS d'un document Web se contente de définir
les différents styles de textes ou de blocs qui seront utilisés pour la mise en forme tandis que
la partie HTML ne contient que le texte encadré de quelques balises.[11]

Figure 3.2 : CSS

53
 CHAPITRE 03 LES LANGAGES DE PROGRAMMATION ET
LES OUTILS DE TRAVAILS

3.3.2. Les avantages de CSS

CSS est une révolution dans l'univers de la conception Web. Les avantages de CSS sont les
suivants :

 La mise en page des pages Web pages peut être mise à jour avec un seul fichier
CSS, économisant ainsi un temps considérable.

 Les pages Web rendues par CSS sont compatibles avec toutes les tailles d’écran,
du PDA aux écrans 1600 × 1200.
 Dans le futur, les navigateurs rendront de plus en plus facile aux utilisateurs du
Web de modifier les réglages du site Web (couleurs, tailles de police) émettant
en page le site Web avec des CSS.
 Les CSS séparent la structure et la présentation et ainsi fournissent d’énormes
bénéfices en termes d’accessibilité. [3]

3. 4. PHP

3.4.1. Définition

PHP (Hypertexte Pré Processor) C’est un langage de scripts interprété, et open source.
Il est conçu pour le développement d ‘application web interactive et dynamique. [3]

Figure 3.3 : PHP

3.4.2. Avantage de PHP

 Gratuit.
 Rapide.
 Stable (le serveur n’a pas besoin d’être réinitialisé souvent, le logiciel
 L’échange pas radicalement d’une version à l’autre)
 Simplicité d’écriture

54
 CHAPITRE 03 LES LANGAGES DE PROGRAMMATION ET
LES OUTILS DE TRAVAILS

 Possibilité d’inclure le script PHP au sein d’une page HTML facilement

 Simplicité d’interface avec les BDD
 Intégration au sein de nombreux serveurs (Apache, Microsoft...). [18]
3.5. JavaScripts
3.5 .1. Définition
JavaScript est un langage de programmation de scripts principalement utilisé pour
les pages web interactives. C'est un langage orienté objet à prototype, c'est à dire que
les bases du langage et ses principales interfaces sont fournies par des objets qui ne
sont pas instanciés au sein de classes mais qui sont chacun équipe de constructeurs
permettant de générer leurs propriétés, et notamment une propriété de prototypage qui
permet d'en générer des objets héritiers personnalisés. Le langage est créé en 1995 par
Brendan Eich, qui s’est inspiré de nombreux langage, notamment de java [19]

Figure 3.4 : JavaScript

 Exemple :
<SCRIPT langage= "JavaScript">
Alert (bienvenu au site de voyage)
</SCRIPT>
3.5.2. Les Avantages de JavaScripts
Les avantages du JavaScript sont nombreux:

 Il est très sécuritaire

 Vitesse : Les fonctions du JavaScript ne doivent pas attendre pour des réponses de
leurs serveurs pour agir, ce qui accélère le traitement.
 Simplicité : le JavaScript est relativement simple et facile à apprendre.

55
CHAPITRE 03 LES LANGAGES DE PROGRAMMATION ET
LES OUTILS DE TRAVAILS

 Versatilité : Le JavaScript ne nécessite pas un programme spécial pour l'interpréter

(Flash Player, "plug-ins"), ni pour l'écrire. De plus, JavaScript n'occupe pas un grand
espace sur les sites web.
Section 02 : Les outils de travails

3.1. PHP MyAdmin

Il existe plusieurs méthodes d’accéder à la base de données. Par exemple PHP

MyAdmin, est une interface conviviale faîte en PHP pour gérer une base de données
MySQL. Utiliser pour créer des bases de données, les supprimer, créées des tables est
exécuter toutes les requêtes permises par MySQL.

Figure 3.5 : PHP MyAdmin.

56
 CHAPITRE 03 LES LANGAGES DE PROGRAMMATION ET
LES OUTILS DE TRAVAILS

3.2. MySQL

3.2.1. Définition

MySQL dérive directement de SQL (Structured Query Language) qui est un langage de
requête vers les bases de données exploitant le modèle relationnel. Le serveur de base de
données MySQL est très souvent utilisé avec le langage PHP. [20]

Figure 3.6: MYSQL.

3.2.2. Avantage de MYSQL

 Il est sur.
 Il facile à utiliser.
 Il n’est pas cher.

57
 CHAPITRE 03 LES LANGAGES DE PROGRAMMATION ET
LES OUTILS DE TRAVAILS

3.3. Adobe Photoshop : C’est un utilitaire populaire très puissant de manipulation d’image. Il
offre des fonctionnalités de haut niveau qui permettent de traiter les images comme des
professionnels. Nous avons utilisé Adobe Photoshop pour la création de toutes les images de
notre site web. [21]

Figure 3.7: Adobe Photoshop Portable.

3.4. Notepad++:Est un éditeur de texte générique codé en C++, qui intègre la coloration
syntaxique de code source pour les langages et fichiers C, C++, Java, C#, XML, HTML,…
ainsi que pour tout autres langages informatiques, car ce logiciel propose la possibilité de
créer ses propres colorations syntaxiques pour un langage quelconque. Ce logiciel a pour but
de fournir un éditeur léger (aussi bien au niveau de la taille du code compilé que des
ressources occupées durant l’exécution) et efficace. [7]

Figure 3.8 : Notepad++

58
 CHAPITRE 03 LES LANGAGES DE PROGRAMMATION ET
LES OUTILS DE TRAVAILS

3.5. Mozilla Firefox

C’est le plus connu et le plus répandu de tous les navigateurs, car il est livré par défaut avec
tous les Windows. Mozilla Firefox permet d’explorer les ressources d’Internet et d’accéder
facilement à l’information sous forme de texte, d’image, flash, de sons, d’animation, ou de
séquences vidéo. [7]

Figure 3.9:Mozilla Firefox.

3.6. Wamp Server

Wamp Server (anciennement WAMP5) est une plateforme de développement Web de
type WAMP, permettant de faire fonctionner localement (sans se connecter à un serveur
externe) des scripts PHP. Wamp Server n'est pas en soi un logiciel, mais un environnement
comprenant deux serveurs (Apache et MySQL), un interpréteur de script (PHP), ainsi que
PHP My Admin pour l'administration Web des bases MySQL. Il dispose d'une interface
d'administration permettant de gérer et d'administrer ses serveurs au travers d'un trayions
(icône près de l'horloge de Windows).[22]

Figure 3.10 :Wamp server.

59
 CHAPITRE 03 LES LANGAGES DE PROGRAMMATION ET
LES OUTILS DE TRAVAILS

3.7. UML Pacester Diagrammer

Un programme fournir un ensemble complet d'outils de modélisation graphique, d'analyse

et de conception dans le développement de logiciel Se basés sur les modèles……

Figure 3.11:UML Pacester Diagrammer

60
 CHAPITRE 03 LES LANGAGES DE PROGRAMMATION ET
LES OUTILS DE TRAVAILS

Section 03 : Langage Joomla

1.1. Définition

Joomla (en français SGC pour système de gestion de contenu ou en anglais CMS pour
content management system) est une famille de logiciels destinés à la conception et à la mise
à jour dynamique de sites Web ou d'applications multimé[Link] est codé en PHP, le langage de
programmation web le plus répandu du marché, et fonctionne en liaison avec une base de
données MySQL. Le plus utilisé du web, est un système de gestion de contenu libre, open
source et gratuit.

Joomla inclut des fonctionnalités telles que des news, une version imprimable des pages,
des sondages, des recherches.

Figure 3.12: la présentation de Joomla.

3.2. Historique de Joomla

Joomla a vu le jour le 17 août 2005 à la suite d'un fork de Mambo par l'ensemble de ses principaux
développeurs. À cette époque, le nom Mambo est une marque déposée par Miro International Pty. Ltd.,
qui a formé une fondation à but non lucratif avec l'objectif déclaré de financer le projet et de le
protéger des poursuites. L'équipe de développement a fait valoir que de nombreuses dispositions de la
Fondation allaient à l'encontre des accords antérieurs et contenaient des dispositions violant les valeurs
open source fondamentales.

L'équipe de développement a créé le site webOpenSourceMatters pour communiquer avec

les utilisateurs, développeurs, concepteurs de sites Web et la communauté en général.

61
 CHAPITRE 03 LES LANGAGES DE PROGRAMMATION ET
LES OUTILS DE TRAVAILS

Un millier de personnes a rejoint le site [Link] en un seul jour, la plupart

avec des messages d'encouragements et de soutien pour les actions de l'équipe de
développement.

Le site web a profité d'un effet slash dot et des articles de presse concernant l'événement
sont apparus sur [Link], [Link], et [Link]. Miro (Peter Lamont) y a donné
une réponse publique, dans un article intitulé « La controverse Mambo Open Source - 20
Questions Avec Miro. »

Cet événement a suscité de vives réactions dans la communauté du logiciel libre. De

nombreux messages pour et contre les actions des deux côtés ont rempli des forums de
nombreux autres projets open source. [23]

3.3. Caractéristique de joomla

Le paquet se compose de plusieurs parties, qui sont construites pour être le plus modulaire
possible, ce qui permet des extensions et intégrations à faire facilement. Certaines extensions
sont appelées « plugins » (antérieurement connues sous le nom de "Mambots"). Les plugins
sont des extensions de fond qui donnent à Joomla de nouvelles fonctionnalités. Le WikiBot,
par exemple, permet à l'auteur de contenu Joomla d'utiliser "Wikitags" dans ses articles
Joomla qui vont créer des dynamiques d'auto-hyperliens vers des articles Wikipédia lorsqu'il
est affiché. Il y a plus de 4500 extensions pour Joomla disponibles via des extensions
Directory, OpenSourceMatters un site qui fonctionne comme un répertoire officiel des
extensions.

En plus des plugins, des extensions sont disponibles. Les "Composants" permettent
d'effectuer des tâches telles que la construction d'une communauté en expansion avec des
fonctionnalités pour les utilisateurs, la sauvegarde d'un site web, traduire le contenu et créer
des URL qui sont plus optimisés pour le référencement dans les moteurs de recherche.
Certains « Modules » permettent d'effectuer des tâches telles que l'affichage d'un calendrier
ou un code personnalisé pour Google ……etc. à insérer dans le code de base de Joomla

62
 CHAPITRE 03 LES LANGAGES DE PROGRAMMATION ET
LES OUTILS DE TRAVAILS

Même s'il existe un nombre plus important d'extensions pour Joomla 1.0 que pour la
version 1.5, de nouvelles extensions compatibles avec cette dernière version sont désormais
mises à disposition à un rythme remarquable. Certaines des extensions de la version 1.0
peuvent être utilisées avec la version 1.5 si Joomla est réglé sur le mode de compatibilité.

Joomla permet aux administrateurs de fixer les paramètres de configuration globaux qui
affectent tous les articles. Chaque page est conforme à ces paramètres par défaut, mais une
page peut avoir son propre réglage de chaque paramètre. Il est par exemple possible de choisir
d'afficher l'article, l'auteur, cacher l'auteur, etc.[23]

3.4. Les Avantages des Joomla

 La gratuité.
 Facilité d’installation.
 La popularité.
 Les Template.
 Les extensions.
 La création de groupes et droits d’accès.[24]
3.5. Les Inconvénients de Joomla

 Il est impossible de créer un système permettant de rajouter automatiquement des entrées

dans mon tableau de dates de concert.
 Il faut absolument repasser par le code HTML
 Le principal inconvénient reste la lenteur d’accès aux bases de données qui est visible
surtout à l’affichage des pages (selon l’hébergeur).[24]
3.6. Pour quoi utilisée le langage Joomla ?

Un outil très polyvalent et robuste (Joomlapeut aussi bien être employé pour la réalisation
d'un simple site vitrine comme pour la construction d'une boutique de commerce
électronique), une équipe de développement efficace et une communauté active, assurant la
pérennité du produit ; voici les critères essentiels qui nous font préférer Joomla aux autres
CMS, même si nombre d'entre eux présentent des atouts séduisants.

63
 CHAPITRE 03 LES LANGAGES DE PROGRAMMATION ET
LES OUTILS DE TRAVAILS

On peut ajouter plusieurs points à la liste : une gestion des droit simple et efficace, une
interface conviviale et complète, un nombre impressionnant de modules complémentaires
pouvant se ploguer sur le système et lui adjoignant pratiquement toutes les fonctionnalités
dont a toujours rêvé un webmestre, sans jamais trouver le temps de les développer.

Juridiquement, Joomla est un système sous licence GNU/GPL (vous donnant le droit d'utiliser
gratuitement et légalement le produit), développé sous technologie PHP(en ce qui concerne le
langage de programmation) et MySQL(le gestionnaire de base de données).[25]

3.7. Personnalisation

L'utilisateur de Joomla! Peut, en plus des paramètres de configuration de base, le

personnaliser sur plusieurs niveaux :

 au niveau du code de Joomla! : l'utilisateur qui a des connaissances en PHP peut aller
mettre à jour le code suivant ses besoins
 du point de vue de l'affichage - notion de modèles (Web Template (en) en anglais) :
Joomla! permet à l'utilisateur de créer son propre modèle en disposant les menus
suivant son goût
 ajout de fonctionnalités : il se fait soit sous forme de modules, soit sous forme de
composants, soit sous forme de plugins .[23]

3.8. Les Versions de joomla

Depuis sa création, Joomla! a évolué :

 Version 1.0
 Version 1.5
 Version 1.6 : la version 1.6 apporte plusieurs nouveautés dont :
o Une nouvelle gestion des autorisations (ACL : Access Control Layer), c'est-à-
dire une gestion plus fine des groupes d'utilisateurs
o Une hiérarchie infinie de catégories d'articles (catégories imbriquées, limitées
jusque là à Sections>Catégories uniques pour chaque élément de contenu)

64
 CHAPITRE 03 LES LANGAGES DE PROGRAMMATION ET
LES OUTILS DE TRAVAILS

o La gestion multi-langues (qui nécessite dans la version 1.5 l'installation d'un

module spécifique)
 Version 1.7 beta
o La version alpha est sortie le 6 juin 2011
o La version officielle est sortie le 19 juillet 2011.
 Version 2.5 sortie le 24 janvier 2012 : une version de joomla particulièrement stable et
fonctionnelle
 Version 3.0 sortie le 27 septembre 2012 : cette nouvelle version de joomla offre un
tableau de bord des multiples fonctionnalités du CMS plus intuitif que sur les versions
précédentes.
 Version 3.1 sortie le 24 avril 2013 : cette mise à jour de la branche 3.x inclut plusieurs
nouvelles fonctionnalités dont le système de Tag.
 Version 3.2 sortie le 6 novembre 2013: cette mise à jour de la branche 3.x inclut
plusieurs nouvelles fonctionnalités dont le système d'historique des contenus, le
gestionnaire de Template et le Joomla App Store. [23]

3.9. Template

Un Template est un type d'extension pour Joomla! Qui permet de modifier l'apparence de
votre site Web. Il existe deux types de Template pour le CMS Joomla! : Les Template de site
Frontend et les Template d'administration Backend. Les Template de site déterminent
l'apparence du contenu de votre site pour le visiteur. Les Template d'administration
déterminent l'apparence donnée aux fonctionnalités d'administration de votre site et
disponibles aux administrateurs du site. Cela concerne les fonctionnalités Joomla! Telles que :
utilisateurs, menu, article, catégorie, module, composant, plugin et gestion des Template. [26]

3.10. Module

Les Modules sont des extensions, légères et flexibles, utilisées pour le rendu de pages.
Sur une page classique, ces modules sont des “boîtes” s'affichant autour d'un composant. Le
module de connexion en est un bon exemple. Les Modules sont assignés à des éléments de
menu, ainsi, vous pouvez par exemple décider de montrer ou de cacher le module de

65
 CHAPITRE 03 LES LANGAGES DE PROGRAMMATION ET
LES OUTILS DE TRAVAILS

connexion selon la page (élément de menu) que l'utilisateur est en train de consulter. Certains
modules sont liés à des composants : le module “derniers articles”, par exemple, lie le contenu
du composant de contenu (com_content) et affichera les éléments de contenu les plus récents.
Toutefois, les modules n'ont pas besoin d'être liés à des composants ; ni à quoi que ce soit, ils
peuvent contenir seulement du HTML statique ou du texte. [26]

3.11. Menu

Dans Joomla!, un menu est un ensemble d'éléments de menu utilisé pour naviguer sur un
site web. Chaque élément de menu définit une URL vers une page de votre site, ainsi que les
paramètres qui contrôlent le contenu (articles, listes de catégorie(s), éléments tagués, etc.) et
le style (module(s), mise en page) de cette page. En outre, chaque menu possède un type
demenu, listé dans le Gestionnaire de menu (voir ajouter un nouveau menu). Le type de menu
sera en fait le nom unique ou alias qui sera utilisé pour créer des URL lisibles si la
fonction Optimisation des URL pour les moteurs de recherche (SEF) est activée. Les éléments
de Menu peuvent avoir un nombre illimité de sous-éléments. [26]

3.12. Conclusion

Dans ce chapitre, nous avons fourni une description de tous les logiciels et outils utilisés
dans la mise en œuvre de notre site. Qui présent la partie essentiale dans les différentes
interfaces du logiciel réalisé.

66
 Chapitre 04
La modélisation UML de
site web
CHAPITRE04 LA MODELISATION UML DE SITE WEB

4.1. Introduction

Dans ce chapitre, nous allons présenter notre sujet de tous les côtés que nous aurions
besoin pour implémenter notre application, et pour cela, nous allons exprimer nos besoins et
élaborer les diagrammes nécessaires pour pouvoir débuter la réalisation de notre
application.

4.2. Identification des acteurs

Il existe 3 acteurs dans notre projet :

 L’internaute : c’est un personne inconnu par le site qui peut rechercher un

médicament crée un compte ou tout simplement visiter le site.
 Le pharmacien : c’est une personne déjà connu par le site, qui peut ajouter,
modifier, supprimer un médicament, et faire l’annulation des commandes, et vente
des médicaments.
 Le client : c’est une personne déjà connu par le site qui peut effectuer ou annuler
une commande.

67
CHAPITRE04 LA MODELISATION UML DE SITE WEB

4.3. Diagrammes élaborés

4.3.1. Diagrammes de cas d’utilisation

systéme d'une pharmacie

visiter le site

par nom commercial

rechercher des médicaments

internaute par nom chimique

créer compte
par nom international

gérer médicament
«include»
modifier
«include»
«include»

ajouter supprimer

pharmacien «include» S'authentifier

annuler une commande

«include»

«include»
vente des médicaments

«include»
facturation

«include»
client
effectuer une commande

Figure 4.1 : Diagramme de cas d’utilisation.

68
CHAPITRE04 LA MODELISATION UML DE SITE WEB

4.3.2. Description textuelle du cas d’utilisation

[Link]. Cas d’utilisation « Crée un compte »

Acteur L’internaute.
But L’inscription en ligne.
Pré condition la connexion existante.
Post condition Le système afficher un message de confirmation.
Scénario nominale 1-L’internaute demande le formulaire.
2-Le système afficher le formulaire d’inculpation.
3-L’internaute saisit les informations nécessaires.

4-Le système vérifier les informations au base de donnée.

Scénario alternatif Si l’information incorrect afficher un message de erreur.
Scénario d’exception L’internaute annuler l’inscription.
Tableau 4.1: Fiche descriptive de cas d’utilisation Crée un compte.
[Link]. Cas d’utilisation « Supprimer un médicament »

Acteur Pharmacien.
But Supprimer un médicament.
Pré condition Le pharmacien s’authentifie.
Scénario nominale 1-le pharmacien demande de voir la liste des médicaments.
2-Le système afficher la liste des médicaments.

3- Le pharmacien sélectionne le médicament qu’il veut supprimer.

Tableau 4.2 : Fiche descriptive de cas d’utilisation Supprimer un médicament.

69
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link]. Cas d’utilisation « modifier un médicament »

Acteur Pharmacien.
But Modifier un médicament.
Pré condition Le pharmacien s’authentifie.
Post condition Le système affiche un message confirmation.
Scénario nominale 1-Le pharmacien demande au système la liste des médicaments et
choisit le médicament à modifier.

2-Le système afficher les informations de médicament.

3-Le pharmacien modifie et valider.
4-Le système enregistrer la modification et afficher un message de
confirmation.
Scénario alternatif  Si la modification est correcte afficher un message de
confirmation.
 Sinon afficher un message d’erreur.

Scénario d’exception Quitter la modification.

Tableau 4.3: Fiche descriptive de cas d’utilisation modifier un médicament.

[Link]. Cas d’utilisation « rechercher médicament »

Acteur client.

But recherche d’un médicament.

pré condition Le client s’authentifier.
Post condition Le système afficher la liste des médicaments.
Scénario nominale 1-Le client demande la recherche par nom commercial, ou
international, ou chimique d’un médicament.
2-Le système afficher le résultat.
3-Le client sélectionner un médicament.
4-Le système afficher les informations du médicament.

5-L’internaute consulter le résultat.

Scénario alternatif le médicament n’existe pas, le système afficher message d’erreur.

Le client décide de continue la recherche par un autre nom.

Scénario d’exception Le client annuler la recherche.

Tableau 4.4: Fiche descriptive de cas d’utilisation rechercher médicament.

70
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link]. Cas d’utilisation « ajouter médicament »

Acteur Pharmacien.
But Ajouter un nouveau médicament.
Pré condition Le pharmacien s’authentifier.
Poste condition Le système afficher le message d’enregistrement.
Scénario nominale 1-le pharmacien lancer l’ajout d’un nouveau médicament

2-Le système afficher un formulaire pour saisit les informations

des médicaments.
3-le pharmacien saisit les informations des médicaments.
Scénario d’exception le pharmacien annuler l’ajoute.
Tableau 4.5: Fiche descriptive de cas d’utilisation ajouté médicament
[Link]. Cas d’utilisation« annuler une commande »

Acteur Pharmacien client.

But Annuler une commande.
Pré condition Pharmacien et le client s’authentifier.
Post condition La commande est annulée.
Scénario nominale 1-L’utilisateur demande au système d’annuler la commande.
2-Le système affiche un message de confirmation d’annulation.
3-L’utilisateur valide l’annulation.

Tableau 4.6: Fiche descriptive de cas d’utilisation annuler une commande.

[Link]. Cas d’utilisation« facturation »

Acteur Pharmacien.
But Crée une facture.
Pré condition Le pharmacien authentifie.
Post condition Le système afficher la facture de vente.
Scénario nominale 1-Le client demande au système la création d’une facture de vente.
2-Le système afficher la facture de vente et demande la saisie des
informations nécessaires.
3- Le pharmacien saisie les informations et valider la saisie.
4-Le système vérifié la validation est enregistrer la facture de vente.
Scénario alternatif Les informations saisies sont incomplète ou erronée.

Scénario d’exception Le pharmacien quitter le système.

Tableau 4.7: Fiche descriptive de cas d’utilisation facturation.

71
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link]. Cas d’utilisation« vente médicament »

Acteur Pharmacien
But Vente les médicaments aux clients.
Pré condition Le pharmacien s’authentifie.
Post condition Le système afficher un message d’acceptation de la vente.
Scénario nominale 1-Pharmacien demande au système les commandes d’un client.

2-Le système offre les commandes au pharmacien.

3-Le pharmacien valider la vente des médicaments.
4-Le système calculer le prix total des médicaments et valider la
vente.
Scénario alternatif 1- Le système valider la vente, afficher un message de
confirmation et crée la facture.
2-Le pharmacien annuler la vente roture au scénario nominal au
point 1.
Scénario d’exception Le pharmacien quitte le système.
Tableau 4.8: Fiche descriptive de cas d’utilisation vente médicament

[Link]. Cas d’utilisation « s’authentifier »

Acteur Pharmacien, client.

But Vérifier l’autorisation d’accès au système.
Pré condition Chaque utilisateur déjà inscrit.
Poste condition L’utilisateur et authentifier.
Scénario nominale 1-L’utilisateur saisit son mot de passe et pseudo et valider la saisie.
2-La confirmation de système.
Scénario d’exception 1-Le mot de passe et le pseudo erronés.
2-Le système afficher un message d’erreur retour scénario nominale
au point 1.
Tableau 4.9: Fiche descriptive de cas d’utilisation s’authentifier.

72
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link]. Cas d’utilisation « effectuer une commande »

Acteur Client
But effectuer une commande.
Pré condition Le client doit être authentifié
Post condition effectuer la commande
Scénario nominale 1-Le client demander effectuer une commande.
2-Le système enregistrer.
Scénario alternatif Le système indique qu’il Ya aucun commande effectuer.
Scénario d’exception 1-Le client annuler sa commande.
2-Le système revient sur l’affichage de la page d’accueil.
Tableau 4.10: Fiche descriptive de cas d’utilisation effectuer une commande.
4.3.3. Diagramme de séquence système

[Link]. Cas d’utilisation crée compte

:systéme
:internaute

demander le formulaire d'inscription

afficher le formulaire d'inscription

saisie les informations

vérifie()

Alt
[les informations incorrects]

afficher message d'erreur

[else]

confirmation inscription

Figure 4.2: Diagramme de séquence système crée compte.

73
CHAPITRE04 LA MODELISATION UML DE SITE WEB

4.3.3.2Cas d’utilisation supprimé médicament

:systéme
:pharmacien

Réf s'authentifier

demander la liste des médicaments

afficher la liste

sélectionner les médicaments

afficher message de confirmation

Figure 4.3: Diagramme de séquence système supprimé médicament.

4.3.3.3Cas d’utilisation modifier médicament

: s y s t ém e
: p ha rm a c ie n

Ré f s ' a ut h en t if i er

d e m a nd e m o d i fi e r l e m éd i ca m e n t

a ff ich er l es i nf o r m a ti o n s d e s m é di c a m en t s

c h o i s i e l e m é d i ca m e n t et s a i s i e l a m o d i fi c a ti o n

v é r i fi ca ti o n ()
A lt [ m o d i fi c a t io n c o rr e ct e]

m es s a g e d e co nf i rm a t io n

v a l i d e r la m o d i fi c a t io n e n re g i s tr e r

[ el s e ]

m es s a g e d ' er r eu r

Figure 4.4: Diagramme de séquence système modifié médicament.

74
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link] Cas d’utilisation rechercher médicament

:sy stéme
:c lien t

la ncer la rec her che d es m édica m en ts

afficher l'écra n de rec her che

cho isir le type d e rech erch e

re che rche r()

A lt
[le méd icam ent n'existe pa s]

afficher messa ge d'erre ur

[else]

a ffich er la résultan t d e rech erch e

Figure 4.5: Diagramme de séquence système rechercher médicament.

[Link] Cas d’utilisation ajouter médicament

:sy s té m e

:p h a rm a c ie n

d em an der l'a jo u t d 'u n n ou v eau m éd ic a m e nt

a ffiche r u n e fo rm ulair e

e n tr e r le s in fo rm atio n s
v é rifier ()

Alt [les in fo r m ation s cor re c te s]

m e ss a ge d e c on fir m a tio n

[les infor m a tions inc o rr e ctes ]

m e ss a ge d 'e rre u r

Figure 4.6: Diagramme de séquence système ajouter médicament.

75
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link] Cas d’utilisation annuler commande

:s y s té m e
:u tilis at e u r

R éf s 'a u th e n tif ie r

d e m a nd e r a n n u le r u n e c o m m a n d e

a f fic h er le s in f or m a tio ns d e la c o m m a n d e

v a lid er l'an n u la t ion

a ffic h e r m e s s ag e de c on f ir m a tio n

Figure 4.7: Diagramme de séquence système annuler commande.

[Link] Cas d’utilisation facturation

:sy stém e
:ph arm ac ien

d e m a n de r la cr éa tio n d e la fac tu re

a ffic h er la fa ctu r e d e v en te

v alid e r la fa c tu re

co n firm a tio n

Figure 4.8: Diagramme de séquence système facturation.

76
 CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link]. Cas d’utilisation vente médicament

:systéme
:pharmacien

Réf s'authentifier

demande les commandes de client

offre les commandes

valider la vente
vérification()

Alt [le médicament existe]

message de confirmation

[else]

mess age d'erreur

Figure 4.9: Diagramme de séquence système vente médicament.

77
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link] Cas d’utilisation s’authentifier

:s ys tém e

:u t ilisat eur

d em and er l'accés au sy st ém e

d em an d er la s ais it les in form at io ns

en tre r les inf o rm at ion s

v érif ier()

A lt [ le s in form a tio ns co rrec tes ]

af f ich er la pa ge d'u tilisa t eur

[les inf orm a t io ns incorr ectes ]

m essag e d'erre ur

Figure 4.10: Diagramme de séquence système s’authentifier.

[Link] Cas d’utilisation effectuer une commande

:c lie n t :sy sté m e

R éf s'a u th e n tifie r

d em a n d e l'e ffe ctu a tio n d 'u ne c om m a n d e

a ffich e r les co m m a nd e s

e ffec tu e r la c o m m an d e e t va lid e r
e n r e g istre r ()
c o nfir m a tio n

Figure 4.11: Diagramme de séquence système effectuer une commande.

78
CHAPITRE04 LA MODELISATION UML DE SITE WEB

4.3.4. Diagramme d’activité

[Link] crée compte

s ' a u th e n t i fi e r

«p age»
éc ra n a c ce u il

« a c ti o n »
c ré e c o m p t e

«p age»
é cr a n d 'a c c e u il c r é e c o m p te

« a c ti o n »
s a is i e l e s i n fo r m a ti o n s

i n c o r r ec te

c o r re c te

«p age»
a f f i c h e r l a p a g e d ' u t i l is a t e u r

Figure 4.12: Diagramme d’activité crée compte

79
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link] supprimer médicament

s'authentifier

«page»
écran acceuil

«action»
demande supprimer médicament

«page»
écran supprimer médicament

«action»
choisir le médicament

«page»
confirmation la supprission

«action»
valider la suppression

Figure 4.13: Diagramme d’activité supprimer un médicament.

80
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link] modifier médicament

s'a u t h en t ifie r

«page»
éc r a n a c c e u il

« a ctio n »
d e m a n d e r l a m o d if i c a t i o n d ' u n m é d i c a m e n t

«page»
é cr a n m o d ifie r m éd ic a m e n t

« a ctio n »
f a i r e l a m o d i fi c a t i o n e t v a l i d e r

Figure 4.14: Diagramme d’activité modifier médicament

81
CHAPITRE04 LA MODELISATION UML DE SITE WEB

4.3.4.4rechercher médicament

s'a u t h e n tifie r

«p age»
é c r a n a c c u eil

« a c ti o n »
d e m a n d e r la r e c h er c h e

«p age»
é c r a n d e v e n te

«a c tio n »
c h o i s i r le m é d i c a m e n t

le m é d ic am e n t n 'e x ist p a s

l e m é d i c a m e n t e x i st e

« e x c e p tio n »
m e s s a g e a ff i c h e r l e r é s u l t a n t d e l a r e c h e r c h e

Figure 4.15: Diagramme d’activité rechercher médicament.

[Link] ajouter médicament

s ' a u th e n t i f i e r

«p age»
éc r a n a c c e u il

« a c tio n »
l a n c e r l' a j o u t

«p age»
é c r a n d ' a jo u t

« a c tio n »
s a i s i r l e s i n f o r m a ti o n s

in c o r re c t
correct
« e x c e p tio n »
m e s s a g e d e c o n fir m a tio n

Figure 4.16 : Diagramme d’activité ajouter médicament.

82
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link] annuler une commandes

s ' au th e n t i f ie r

« p age »
é c r a n a c ce u il

« a ctio n»
d e m an d e d 'a n n u le r l a c o m m a n d e

« pa ge »
é c r a n a n n u l e r l a co m m a n d e

« a ctio n»

v al id e r l' a n n u la t i o n

« e x c e p t io n »
m es s a g e d e c o n f i r m a t i o n

Figure 4.17: Diagramme d’activité annuler commande.

83
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link] Facturation

s 'a u th en tifie r

«p age»
éc r a n a c c e u il

« a c ti o n »
d e m a n d e l a c r é a t i o n d ' u n e fa c t u r e

«p age»
é cr a n a ffic h e r la fa c tu re

« a ctio n »
v a li d e r l a f a c t u r e

« e x c e p tio n »
é c r a n m e s s a g e d e c o n f i r m a ti o n

Figure 4.18: Diagramme d’activité facturation.

84
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link] Vente médicament

s 'a u th e nti fie

«page»
é c r a n a c c u ei l

« a c tio n »
d e m a n d e les c om m a n d es

«page»
é c r a n v e n te

in c or r e c t

c or r e c t

« e x c e p tio n »
m es s a g e d e c o n fir m a ti o n

Figure 4.19: Diagramme d’activité vente médicament.

85
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link] S’authentifier

«page»
é c r a n a c cu eil

« a c tio n »
sa is ie les info r m a tion s

inc o r r e cte

c or r e c te

«p age»
a ffic h e la pa g e d 'u tilis a te u r

Figure 4.20: Diagramme d’activité s’authentifie.

[Link] Effectuer une commande

s'a u th entifie r

« p a g e»
écr a n a c ce uil

« a c tio n »
dem a nd e la v a lid atio n d'u ne co m ma n de

« e x ceptio n »
é cra n m e ssa g e d'en re gistr em en t

Figure 4.21: Diagramme d’activité effectuer une commande.

86
CHAPITRE04 LA MODELISATION UML DE SITE WEB

4.3.5. Diagramme de classe participant

[Link] crée compte

« contro le»
controle crée co mpte
«dia logue»
écra n accueil

crée com pte ()

crée com pte() A nnuler ()

Internaute

«dialog ue»
écran crée compte
Nom-ut:String
P rénom -ut:String «entité»
M o t-D e-P asse:String interna ute
P seudo-ut:String
«dialogue»
m essag e d'erreur N om -ut:String
crée compte()
Annuler () P rénom -ut:String
Mot-De-Passe:String
M essage:String P seudo-ut:String

Figure 4.22: Diagramme de classe participant créer compte

[Link] Supprimer médicament

«con trole»
con trole su p p rim er m éd icam e nt
«dialogu e»

écran accueil

S u p prim er ()
A nn u ler ()
p h arm acien
S up prim er m éd icam en t()

«en tité»
«d ialogue»
m éd icam en t
écran sup p rim er mé dicam en t
N om-c:S tring
N om-ch :Strin g N om -c:S trin g
N om-i:S tring N om -ch :S tring
Seu il-m :in teger N om -i:Strin g
D ate-Fab :D ate S eu il-m :integer
D ate -P reem :D ate D ate-F ab:D ate
PP A:Float D ate -Preem :Date
Q t-Stoc k:in teger P PA :F loat
Q t-S tock :intege r

S u pp rimer ()
A n nuler ()

Figure 4.23: Diagramme de classe participant supprimer médicament

87
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link] Modifier médicament

«d ialogu e » «C on trole »
é cran ac cu eil C on tr ole mod ifier m é dicam en t

M od ifier m éd icam en t() M odifier ()

A n nu ler ()

Ph arm acie n

«d ia logu e»
écr an m o difier méd icam ent()
«en tité »
N om -c:Strin g m é d ic am en t
N om -ch :S tr ing
N om -i:S trin g N om -c:S trin g
Seu il-m :Inte ger «d ialogu e» N om -ch:S trin g
D ate-Fa b:D ate M essage d 'e rreu r N om -i:S tr in g
D ate-Pr een:D ate S eu il-m:In teger
M e ssage:S trin g D ate-Fab :D ate
PPA :F loat
Q t-S tok :Integer D ate-Pre en :D ate
P PA :Float
Q t-Stok:Integ er

Mod ifier()
A nn u ler ()

Figure 4.24: Diagramme de classe participant modifier médicament

88
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link] rechercher médicament

«dialogue»
«controle»
controle chercher médicament

Chercher médicament() Chercher()

Annuler()
client

«entité»
médicament
«dialogue»
écran chercher médicament Nom-c:String
«dialogue» Nom-ch:String
Nom-c:String
Nom-ch:String message d'erreur Nom-i:String
Seuil-m:Integre
Nom-i:String Date-fab:Date
Seuil-m:Integre
Message:String Date-Preem:Date
Date-fab:Date PPA:Flaot
Date-Preem:Date
Qt-Stock:Integre
PPA:Flaot
Qt-Stock:Integre

rechercher() «entité»
Annuler() client
Nom-cl:String
Prénom-cl:String
Mot -De-Pass:String
pseudo:String

Figure 4.25: Diagramme de classe participant rechercher médicament

89
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link] Ajouter médicament

«controle»
«d ialogue» controle ajouter m édicament
écran accueil

A jouter ()
Ajouter m édicam ent() A nnuler ()
ph armacien

«dialogue» «dialogue» «entité»

écran ajou ter m édicam ent Message d'erreu r médicament

N om -c:String M essage:String
N om -ch:String Nom -c:String
N om -i:String Nom -ch:String
Seu il-m :integer Nom -i:S tring
D ate-Fab:D ate Seuil-m:integer
D ate -Preem :Date Date-Fab:Date
PPA :Float Date -Preem:Date
Q t-Stock:integer PPA :Float
Q t-Stock:integer

Ajouter ()
A nnuler ()

Figure 4.26: Diagramme de classe participant ajouter médicament

[Link] Annuler une commande

«dialogue» «controle»
écran accueil controle annuler une commande

ouvrir accueil () Annuler ()

Annuler()

utilisateur

«dialogue» «entité»
«entité»
écran annuler commande client commande
Num-co:Integer
Nom-cl:String
Nom-cl:String Num-co:Integer
Prénom-cl:String
Prénom-cl:String
Mot-De-Passe:String Nom-cl:String
Pseudo-ut:String Prénom-cl:String
Annuler()

Figure 4.27: Diagramme de classe participant annuler une commande.

90
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link] Facturation

« dialog ue »
«C ontrole»
écran ac ce uil
Co nt ro le factur ation

Fa ct ur at ion ( )
F act uration()
A nnuler ()

Pharmacien
«dialogue»
«entité» «entité»
éc ra n fa ct uratio n
V ent e C rée fa ct ure
N um- fact: Integre
P rix- tot al:Integre N om -cl:Str ing N um -fact:Int egre
N om -cl:Str ing P rénom-cl: Str ing P rix-total:Integre
P rénom-cl: String D ate-v :D ate N om- cl: String
P rix- tot ale:Flao t P ré no m- cl: St ring

A nnuler( )
F act uration()

Figure 4.28: Diagramme de classe participant facturation

[Link] Vente médicament

«controle»
«dialogue» controle vente médicament
écran accueil

Vente ()
Annuler ()
Pharmacien Vente ()

«dialogue»
écran ajouter médicament «entité»
médicament
Nom-c:String
Nom-ch:String «entité»
Nom-i:String vente Nom-c:String
Seuil-m:integer Nom-ch:String
Nom-cl:String Nom-i:String
Date-Fab:Date
prénom-cl:String Seuil-m:integer
Date -Preem:Date Date-V:Date
PPA:Float Date-Fab:Date
Prix-total:Float Date -Preem:Date
Qt-Stock:integer
PPA:Float
Qt-Stock:integer
Vente ()
Annuler ()

Figure 4.29: Diagramme de classe participant vente médicament.

91
CHAPITRE04 LA MODELISATION UML DE SITE WEB

[Link] S'authentifier

«dialogue» «con tro le»

écran authentification co ntro le auth entifica tion

N om -ut:String
P rénom -u t:Strin g
M o t-D e-P asse:S tring o uvrir accueil ()
P seudo :String Annu ler ()
utilisateur
o uvrir acceuil ()
A nnuler()

« en tité»
utilisateur
«dia log ue»
M essag e d'erreur
M essag e:Strin g
N om -ut:String
P rénom -ut:String
M o t-De-P asse:S tring
P seudo:Strin g

Figure 4.30 : Diagramme de classe participant s’authentifier.

[Link] Effecteur une commande

«controle»
controle effectuer une comm ande
«dialogue»
écran accueil

Effectuer ()
A nnuler ()
client

Effectuer une com mande()

«dialogue» «entité»
écran effectuer une comm ande com mande

N um-co:Integer
N om-cl:String
N um-co:Integer
Prénom -cl:String
N om-cl:String
Pseudo-cl:String
P rénom-cl:String
P seudo-cl:String

effectuer ()
A nnuler ()

Figure 4.31 Diagramme de classe participante effectuer une commande.

92
CHAPITRE04 LA MODELISATION UML DE SITE WEB

4.3.6. Diagramme de modèle de domaine

m éd ica m ent
N o m -c:S tr ing clie nt
N o m -ch :Strin g N o m -cl:Strin g
N o m -i:S tring P r en om -cl:S trin g
S eu il-m:In teg er P seu do:Strin g
D a te-fab :D ate re che rc he r
* * M ot de pa sse :String
D a te-pr eem :Da te
P P A :Fla ot
Q t-S:Integ er
*

* *
v en te

con tient
r ech er ch er 1 ve nte
1
fa cte ur e D a te -v:D a te
P r ix-v:Intege r
Nu m -fa ct:Integ er
* Pr ix-tot:In te ger
in ter na ute No m -cl:Strin g
Pr eno m -cl:Strin g
Nom -in :String
Pren om -in:S tr ing
Pseu do :String
M ot de pa sse:S tring

Figure 4.32: Diagramme de modèle de domaine

4.4. Conclusion

Au cours de cette étape de l’analyse nous avons donné une synthèse sur l’axe fonctionnel
par la description de tous les diagrammes correspondants à cette phase. Donc nous avons
préparé le projet pour l’étape suivante qui est la conception pour proposer des solutions
concrètes pour le problème posé.

93
 Chapitre 05
La conception
et
La réalisation
CHAPITRE 05 CONCEPTION ET REALISATION

5.1 Introduction
Dans ce chapitre nous présentons quelques interfaces qui d’écrit notre site.
5.2 Les interface de notre site
Le contenu de cette partie est une présentation qui définit la manière d’utilisation de notre

Système, enrichie par quelques pages de l’application réalisée.

5.2.1Page d’accueil

Cette page à un internaute de s’authentifier et consulter les différents services de site.

Figure 5.1: page d’accueil

94
CHAPITRE 05 CONCEPTION ET REALISATION

5.2.2Page Authentifier

Figure 5.2: Authentifier

95
CHAPITRE 05 CONCEPTION ET REALISATION

5.2.3 Page message d’erreur d’Authentifier

Figure 5.3: message d’erreur d’authentifier

96
CHAPITRE 05 CONCEPTION ET REALISATION

5.2.4 Page d’inscription

Cette page permet à l’internaute de créer un compte comme acheter un médicament.

Figure 5.4 : Page d’inscription

97
CHAPITRE 05 CONCEPTION ET REALISATION

5.2.5Page message d’erreur de l’inscription

Figure 5.6: message d’erreur d’inscription

98
CHAPITRE 05 CONCEPTION ET REALISATION

5.2.6Page guide des médicaments

Figure 5.7: page guide médicament

99
CHAPITRE 05 CONCEPTION ET REALISATION

5.2.7 Qui somme nous ?

Figure 5.8 : Page Qui somme nous ?

100
CHAPITRE 05 CONCEPTION ET REALISATION

5.2.8 La recherche

Cette page représente la recherche multi critères des médicaments

Figure 5.9 : Page de rechercher médicament.

101
CHAPITRE 05 CONCEPTION ET REALISATION

5.2.9 Page mise à jour des médicaments

Cette page permet à l’administrateur d’ajouter, modifier ou supprimer d’un médicament en base
de données.

Figure 5.10 : Pagede mise à jour des médicaments..

102
CHAPITRE 05 CONCEPTION ET REALISATION

5.2.10 Page d’administrateur

Cette page permet à l’administrateur pour modifier profil

Figure 5.11 : Page modifier l’espace administrateur.

5.2.11Conclusion

Dans ce chapitre nous avons présenté quelques interfaces de notre site, les plus importantes du
point de vue fonctionnel.

103
Conclusion générale

Avec le développement de l’utilisation de l’internet. Pour cela, nous avons développé

un site web dynamique commercial qui offre les principales fonctionnalités

nécessaires pour réaliser facilement des transactions commerciales. L’objectif de

notre projet est la conception la réalisation d’un site web dynamique pour l’achat et

la vente d’une pharmacie.

Le site web développé, qui est consacré pour la vente des médicaments, dans

pharmacie virtuelle. Pour réaliser effectivement ce travail, on a eu besoin d'un

ensemble varié d'outils de modélisation et de programmation pour les sites

dynamiques. Pour la réalisation de ce projet, on a utilisé pour la conception, l’outil

de modélisation UML. Il peut plusieurs diagramme pour présenter les différents

aspects statiques et dynamiques de l’application, Pour l’implémentation on a utilisé

des outils de développement récents tel que (PHP, HTML).

Le site développé est entièrement opérationnel concernant les fonctionnalités

citées dans ce mémoire. Notre site est très facile à utiliser, toutes les fonctionnalités

nécessaires des médicaments sont implémentées. Malgré que tout ça il reste une

dernière étape qu’est l’hébergement du notre site, à l’aide d’un hébergeur sur le Web.

A la fin nous allons terminer notre travail avec succès.

104
[1] «Modélisation et réalisation d’un site web dynamique pour la vente de matériels
informatiques» centre universitaire de Mila.

[2] «Conception et réalisation d’un site web dynamique pour un centre de information
professionnel « l’insep »centre universitaire de Mila.

[3] « développement d’un site web dynamique pour le partage de documents »centre
universitaire de Mila.

[4] « Internet [Link].1 » Simon & Schuster Macmillan, Paris, 1996 Auteur : Joe Kraynak et Joe
Habraken.

[5]Cours PDF de la technologie Web 1ére année universitaire, Enseignant :Douas Bilal.

[6]Cours PDF de réseau 3 éme année universitaire, Enseignant :Laalou Mohammed.

[7] « Développement d’un site web dynamique pour les offres et demandes d’emplois »centre
universitaire de Mila.

[8] [Link]

[9]. [Link]

[10] « conception et réalisation d’une application de gestion d’une pharmacie » centre

universitaire Mila.

[11]Cours PDF de Méthode d’analyse 3 éme année universitaire, Enseignant :Benhammada

Sadek.

[12] « conception et Réalisation d’un site Web dynamique pour l‘agence commerciale de
Télécommunication» centre universitaire Mila.

[13] « La Conception et la Réalisation D’un Site Web Dynamique pour l’achat et la vente des
immobiliers en ligne » centre universitaire de Mila.

[14] Pascal Roques « UML2 modéliser une application Web »,

105
[15][Link]
[Link].

[16] :[Link]

[17] Grand livre HTML, Daniel Koch, Oliver Kurten, Florian Harm.

[18] « Conception et réalisations d’un site web dynamique pour l’enseignant à distance »
centre universitaire de Mila.

[19] Ouvrage PHP 4 et MYSQL, Philip Rigaux.

[20] «Conception et réalisation d’un site web dynamique pour une agence de location des
voitures» centre universitaire de Mila.
[21] : [Link]

[22] :http.//[Link].

[23] :[Link]

[24] :[Link]

[25] :[Link]

[26] :[Link]

106