Développement d’application web (DAW)

Plan du cours
1. Introduction générale
2. HTML (hypertext markup language)
3. CSS (cascading stylesheet)
4. JS (java script)
5. PHP (hypertext preprocessing)
6. Mysql
7. Service web
Cours 1 : introduction générale
- Internet vs world wide web
- C’est quoi une application web
- Serveur web et hébergeur de site web
- Serveur DNS (domain name system)
- Nom du domaine
- Architecture client serveur
- Les outils de développement
- Resource
- Travail à faire
 Internet VS World Wide Web
Internet :
Un réseau global qui permet de relier tous les appareils ayant un accé aux services internet
(ordinateur, téléphone, …..ect) dans le monde. C'est d'ailleurs de là que vient son nom:
«interconnected network» réseau interconnecté en anglais. Il est la structure qui permet d'envoyer
des données d'un ordinateur à un autre, grâce à un système complexe d'adresses qui font parvenir
ces informations au bon endroit.
L’origine de l’internet
Il y’a plusieurs années au début des année 1970 la conception d’internet à commencer. Il était le résultat
d’une expérience appelée ARPANET « adncaed research projects agency network » projet du département
americain de la défense. Il a d'abord été utilisé à des fins militaires, puis pour faciliter la transmission
d'informations entre des universités et des centres de recherche.
Les services de l’internet

- La visualisation des pages web et les news

Les utilisateurs peuvent faire une visualisation de plusieurs pages web. Cette visualisation de page
web s’avère d’ailleurs être le service le plus connu, le plus récent et le plus utilisé en ce qui concerne
Internet.

- Telnet, ssh et ftp : des services incontournables

Telnet et ssh sont des services offerts par Internet qui permettent aux internautes de se connecter. Le ftp
quant à lui, est un service de transfert de fichiers. Il permet de disposer des fichiers sur une machine distante,
de télécharger ou de transférer des fichiers et de faire une diffusion de plusieurs fichiers.

- Le service de messagerie et le mail

Ce service a été mis en place en suivant plusieurs protocoles dont le SMTP ou Simple Mail Tranfert Protocol
qui sont des protocoles utilisés dans l’envoie des messages. Il y a également le POP ou Post Office Protocol,
pour la réception.
Le world wide web :
Un système qui permet de naviguer de pages en pages en cliquant sur des liens hypertexte grâce à un
navigateur. Le Web est né en 1989 par Tim Berners-Lee, qui est un physicien au CERN, le Conseil européen
pour la recherche nucléaire. Le Web permet de consulter des pages sur des sites, grâce à des navigateurs
adaptés, et via des machines comme des ordinateurs ou des smartphones. Il s'agit un peu d'une immense
bibliothèque de documents, qui repose sur les fondations complexes d'Internet.
Pour conclure nous pouvons dire que e web représente un service d’internet
 http et Serveur WEB
Un serveur web
Un serveur informatique qui répond à des requêtes du World Wide Web, en utilisant
principalement le protocole HTTP. Un « serveur web » fait référence à des composants logiciels
(software) et/ou matériels (hardware).
1. Au niveau des composants matériels, un ordinateur qui stocke les fichiers qui composent un site web (par
exemple les documents HTML, les images, les feuilles de style CSS, les fichiers JavaScript) et qui les
envoie à l'appareil de l'utilisateur qui visite le site. Cet ordinateur est connecté à Internet et est
généralement accessible via un nom de domaine.
2. Au niveau des composants logiciels, un serveur web contient différents fragments qui contrôlent
la façon dont les utilisateurs peuvent accéder aux fichiers hébergés. On trouvera un serveur http
qui est un logiciel qui comprend les URL et le protocole HTTP.
Au niveau le plus simple, à chaque fois qu'un navigateur a besoin d'un fichier hébergé sur un
serveur web, le navigateur demande (on dit qu'il envoie une requête) le fichier via HTTP. Quand
la requête atteint le bon serveur web (matériel), le serveur HTTP (logiciel) renvoie le document
demandé, également grâce à HTTP.

Principe du client/serveur
Un client : Les caractéristiques d’un client sont les suivantes : il est d’abord actif (ou maître), il envoie des
requêtes au serveur, il attend et reçoit les réponses du serveur. Un serveur : Un serveur est initialement
passif, il attend, il est à l’écoute, prêt à répondre aux requêtes envoyées par des clients. Dés qu’une
requête lui parvient, il la traite et envoie une réponse. Le dialogue : Le client et le serveur doivent bien sûr
utiliser le même protocole de communication. Un serveur est généralement capable de servir plusieurs
clients simultanément.
Serveur DNS (domain name system ) :
DNS est un acronyme signifiant Domain Name System. C’est un protocole permettant d’associer à des
noms de domaine (par exemple [Link]) une adresse IP (par exemple [Link]). Les
machines se connectent entre-elles à l’aide d’adresses IP, mais les noms de domaine servent à faciliter la
mémorisation et l’utilisation pour les humains

Exemple
Reprenons en modèle ce que vous avez fait pour arriver sur cette page, et regardons
comment le serveur DNS est intervenu sans que vous le sachiez.

Vous avez lancé votre navigateur Internet et vous avez “[Link]” comme moteur de
recherche par défaut. Donc la page google s’est affichée. Voici le mécanisme complet et
regardez à quel endroit le serveur DNS est appelé.
Dans l’exemple ci-dessus, on voit que la requête “quelle est l’adresse de [Link]” a
répondu [Link]. Cette requête s’appelle une résolution de nom de domaine.

Si l’on poursuit, on peut constater que le serveur DNS n’est utilisé que sur la partie 1-
Question et 2-Réponse. Une fois que l’ordinateur a récupéré l’adresse du serveur à joindre, il
n’a plus besoin du serveur DNS.

Cette adresse IP n’est pas une adresse au hasard. Elle correspond bien à un des serveurs de
Google. (il y en a évidemment un grand nombre).
Donc, si dans votre dans la barre d’adresse de votre navigateur, vous tapez :
[Link] la page de recherche de Google doit s’afficher.

Attention, cela fonctionne à l’heure ou j’écris ces lignes, mais ce ne sera peut-être pas le cas au
moment ou vous les lirez. (le serveur [Link] sera peut-être éteint ? ou affecté à de
nouvelle tâches ?)

Hypertext Transfer Protocol (HTTP) :

un protocole servant à transmettre des documents hypermédia, comme HTML. Il a été conçu pour
communiquer entre les navigateurs web et les serveurs web, bien qu'il puisse être utilisé à d'autres
fins. Il suit le modèle classique client-serveur, un client ouvre une connexion, effectue une requête
et attend jusqu'à recevoir une réponse. Il s'agit aussi d'un protocole sans état, ce qui signifie que le
 serveur ne conserve aucune donnée (on parle d'état) entre deux requêtes. Il garantit qu'aucune
donnée ne peut être perdue en chemin.
HTTP fournit des règles claires qui indiquent comment un client et un serveur communiquent.
HTTP fait l'objet d'un article technique à part entière. Pour le moment, voici les points les plus
importants à garder en mémoire :
 Seuls les clients peuvent effectuer des requêtes HTTP et uniquement vers des serveurs. Les
serveurs ne peuvent que répondre à la requête d'un client.
 Lorsque le client demande un fichier via HTTP, il doit fournir l'URL du fichier en question.
 Le serveur web doit répondre à chaque requête HTTP même si la réponse est un message d'erreur.
Sur un serveur web, le serveur HTTP est responsable du traitement des requêtes reçues et de leurs
réponses.

1. Une fois qu'il a reçu une requête, le serveur HTTP vérifie que l'URL demandée correspond à un
fichier existant.
2. Si c'est le cas, le serveur envoie le fichier vers le navigateur du client. Sinon, le serveur
d'applications génère le fichier nécessaire.
3. Si le fichier n'existe pas ou que le traitement est impossible, le serveur web renvoie un message
d'erreur au navigateur. Le message d'erreur le plus fréquemment rencontré est 404 Page non
trouvée (cette erreur étant plutôt fréquente, certains ont même personnalisé et adapté les pages
d'erreurs 404 de leurs sites).

Site web
Site web statique vs site web dynamique
un serveur peut « servir » du contenu statique ou dynamique. Un contenu « statique » signifie qu'il
est servi tel quel. Les sites web statiques sont les plus simples à mettre en œuvre et il sera donc
préférable de commencer par un site statique.

Un site « dynamique » signifie que le serveur traite le contenu ou le génère à la volée depuis les
informations contenues dans une base de données. Cette solution est plus flexible mais beaucoup
plus complexe à mettre en œuvre.

Site web statique

Site web dynamique

C’est quoi un nom du domaine :
Une adresse Internet se compose d'un préfixe "www" (world wide web) et d'un nom de domaine.
Ce nom de domaine est lui-même composé d'une chaîne de caractères et d'une extension. Dans
l'exemple ci-dessous, l'extension utilisée est relative à la France : le .fr.
Comment Choisir un nom de domaine :
- Choisir un nom de domaine parmi les top 5 des mots cés de votre site
- Rendez le domaine unique
- Essayer d’avoir un nom du domaine avec extension .com pour que votre site soit visitable
ou mémorable par l’écrasante majorité des consommateurs.
- Assurer vous que votre nom du domaine soit facile à taper et facile à retenir
- Garder le nom e plus court possible
- Eviter la violation du copyright
- Rejeter les tirets et les numéros
Utiliser ces deux liens suivant pour trouver un nom de domaine libre
- [Link]
- [Link]

Application web :
Une application web désigne un logiciel applicatif hébergé sur un serveur et accessible via un
navigateur web

Site web :
Un site web est l’ensemble des pages web et des ressources inter reliées entre elles par des liens
hypertextes, auxquelles l’internaute peut accéder par une adresse web appelée Url, le tout
enregistré sous le même nom de domaine.
Une page web peut être défini comme étant l’ensemble des documents html structurés, stockés sur
un serveur connecté au réseau mondial qu’est internet.

Hébergeur de site web :

Lorsque vous vous rendez sur un site web depuis votre navigateur, votre ordinateur reçoit un
message écrit dans les langages du web (html css javascript). Votre navigateur traduit ce langage
sous la forme que vous connaissez : images, textes, boutons CTA, tout ce qui compose une page
web. Ce code provient de différents fichiers qui ont besoin d’un espace de stockage : cet espace
est ce qu’on appelle un serveur. Ce dernier est composé d’un ordinateur qui contient de la mémoire,
un disque dur et un système d’exploitation. L’hébergeur web est l’entreprise qui est propriétaire
des serveurs où sont stockées les informations liées à votre site web. Généralement, en plus de
vendre de l’espace sur des serveurs, les hébergeurs web proposent aussi des services de gestion de
serveurs, de soutien informatique, d’antivirus et de sauvegarde de sites web.

Les différents types de sites web

Il existe différents types de sites web, chaque type correspond à un objectif. On peut citer:

 Les sites e-commerce ou sites marchands qui pour principal objectif la vente en ligne.
 Les sites vitrines, utilisés majoritairement pour présenter et exposer les services d’une
organisation ou une marque.
 Les sites institutionnels, qui Présentent une organisation et ses valeurs, à travers la
description de son activité, de ses chiffres clés et des informations indispensables au public
ciblé.
 Les sites portails, qui proposent des services de messagerie, d’actualités.
 Les sites personnels, réalisés au profit des particuliers, qui désirent partager en ligne leur
passion pour un sujet précis.
Cette liste est loin d’être exhaustive, on retrouve d’autres sites tels que : Les Blogs, les sites
communautaires, les sites collaboratifs.