Distinguez le web et internet
On confond souvent Internet et le Web. Or, Internet a été inventé avant le Web. On
peut voir le Web comme un service à l’intérieur d’Internet.
Les services fournis sur Internet
Internet, c’est le réseau qui permet de communiquer entre ordinateurs.
Sur ce réseau, on trouve plusieurs services :
Le Web(le plus connu d’entre eux) : vous ouvrez un navigateur web
pour y aller, comme Google Chrome, Firefox, Internet Explorer,
Edge, Safari...
Les e-mails : pour échanger des messages. Il s’agit tout simplement de
courrier électronique.
Les newsgroups : moins connus, ils sont l’ancêtre des forums et
permettent de discuter à plusieurs en postant des messages.
Le FTP : un moyen d’échanger des fichiers entre ordinateurs.
Etc.
On confond souvent le Web avec le reste, car tous ces
services convergent vers le Web. Par exemple auparavant, on utilisait
obligatoirement un logiciel dédié pour les e-mails (Mozilla
Thunderbird, Apple Mail, Outlook...). Si ces logiciels existent toujours,
aujourd’hui, on passe par le Web pour accéder à ses e-mails ! On va sur
le site de Gmail, par exemple.
Le Web sert donc de porte d’entrée à la plupart des services
aujourd’hui.
Le Cloud
On parle souvent de Cloud... qu’est-ce que cela signifie concrètement ?
Ce n’est pas évident, car c’est un terme (très) utilisé en marketing. Il y
aurait plusieurs définitions possibles !
Pour faire simple, on peut commencer par se dire que ce sont ces
fameux services fournis via une interface web dont je vous parlais juste
à l’instant. En clair, on pourrait dire que Gmail est un service d’e-mail
sur le Cloud.
Le Web sert alors de passerelle à de nombreux services, sous la
dénomination "cloud".
Dans la réalité, c’est un peu plus compliqué que cela : il y a plusieurs
types de clouds. On parle de SaaS (Software as a Service) pour désigner
le cas le plus courant pour le grand public, à savoir un logiciel que l’on
utilise à travers une interface web.
Retracez l’histoire du web
Le Web a une longue histoire derrière lui. Faisons un historique
express :
1969 : création de l’ancêtre d’Internet, appelé alors ARPAnet.
C’est un réseau militaire qui se veut décentralisé (il n’a pas de lieu
de commande central). Le réseau a ensuite évolué pour devenir un
lieu d’échange universitaire avant de devenir progressivement
grand public sous le nom d’Internet.
1972 : apparition des e-mails pour échanger des messages.
1991 : lancement du Web, pour afficher des pages d’information.
Comme vous le voyez, Internet est apparu bien avant le Web ! Il était
possible de s’échanger des e-mails avant que l’on puisse consulter des
pages web.
L’inventeur du Web ? Il s’agit de Tim Berners-Lee, un Britannique. Il
est le premier à présenter un concept de "page web" avec des "liens
hypertextes" qui permettent de naviguer d’une page à une autre. Il est
aussi à l’origine des bases du langage HTML que l’on utilise toujours
aujourd’hui pour concevoir des pages web.
Tim Berners-Lee, l’inventeur du Web
Tim Berners-Lee était en 1991 chercheur au CERN (un important centre
de recherche scientifique à la frontière franco-suisse). C’est là qu’il a eu
l’idée du Web.
Il a par la suite créé un organisme, le W3C (World Wide Web
Consortium) qui a pris le relais pour faire évoluer les technologies du
web (HTML, CSS, PNG, XML et autres noms barbares).
En résumé :
Le Web n’est qu’une partie d’Internet. S’il y avait une chose à
retenir, ce serait celle-là !
Internet a été créé avant le Web pour permettre d’échanger des
informations entre ordinateurs.
Le Cloud est un terme assez vaste (pour ne pas dire vague), plutôt
utilisé pour du marketing. Il signifie essentiellement "un service
fourni à travers le Web".
Le W3C est l’organisme qui guide aujourd’hui l’évolution du Web.
Entraînez-vous : partez à la recherche des premiers sites web
À vous de jouer !
Pour vous entraîner, réalisez cet exercice. Une fois terminé, vous pouvez comparer votre travail avec les
pistes que je vous propose.
Partez à la recherche des premiers sites web ! Votre mission, si vous l'acceptez, consistera à retrouver les premières
versions des sites web suivants :
la première version de Google ;
la première version de W3C ;
un moteur de recherche avant Google ;
une boutique de vente en ligne comme Amazon ;
le tout, tout premier site web créé par Tim lui-même.
C'est à vous de jouer : remontez dans le temps, menez votre recherche, et retrouvez ces cinq sites !
Vérifiez votre travail
Alors, vous êtes allé au bout ? Suivez le guide pour vérifier votre travail !
Pour réussir cet exercice, il fallait utiliser un outil comme la Wayback Machine qui affiche les anciennes versions des
sites web.
Vous devriez avoir des liens qui ressemblent à ceux-ci :
Google
W3C
Moteur de recherche avant Google, ici par exemple AltaVista
Une boutique de vente en ligne de livres, on pense forcément à Amazon même si d'autres sites sont
acceptables.
Le tout premier site web
Découvrez les langages client
Avant toute chose, il faut savoir qu’il y a 2 types d’ordinateurs
connectés au Web :
Des clients : c’est vous, votre ordinateur qui sert à aller consulter
des sites web.
Des serveurs : ce sont des ordinateurs spéciaux (souvent très
puissants) qui envoient les sites web aux clients. Les serveurs
"possèdent" les sites web et les distribuent à ceux qui veulent les
visiter.
Les langages
Pour construire un site web, on a recours à des langages. Ils servent en
quelque sorte à établir les plans d’architecte dont on a besoin pour
construire les sites. Ces langages sont principalement :
HTML
CSS
JavaScript
Tous ces langages sont désormais indispensables à la réalisation de tous
les sites web. On dit que ce sont des langages client ou encore
des langages frontend, car ils sont lus par les machines des clients.
Nous n’apprendrons pas à nous en servir dans ce cours, mais vous
pourrez enchaîner avec d’autres cours accessibles aux débutants si vous
voulez vous entraîner à les utiliser !
Les navigateurs
Pour accéder aux sites web, on a besoin de navigateurs web. Il existe
notamment :
Google Chrome
Mozilla Firefox
Internet Explorer, et son successeur appelé Edge
Opera
Safari
Le rôle des navigateurs est de traduire les langages HTML, CSS et
JavaScript sous la forme de sites web utilisables par tout le monde.
Schéma représentant la traduction des langages HTML et CSS par
l'ordinateur
Les langages HTML et CSS sont traduits sous la forme de sites web.
Découvrez les langages serveur
En plus des langages client que nous venons d’évoquer (HTML, CSS et
JavaScript), il y a une quantité importante de langages serveur.
Quelle est la différence ? Pourquoi faut-il encore plus de langages ?
Les langages serveur sont, comme leur nom l’indique, gérés par les
serveurs. Les clients n’y touchent pas. Leur rôle est un peu différent :
Les langages client décrivent comment le site web doit s’afficher.
Les langages serveur décrivent comment le site web doit se comporter.
Subtil, mais important !
Avec un langage client, je peux dire "Un menu doit s’afficher à
gauche de mon site web".
Avec un langage serveur, je peux dire "Le menu ne doit s’afficher
que si cette personne a créé un compte sur mon site".
Quelques langages serveur
Les langages serveur sont nombreux. En voici quelques exemples :
PHP
Java (rien à voir avec JavaScript, attention !)
Python
C#
...
Il n’y a pas de meilleur langage. On me pose souvent la question et je
réponds toujours la même chose : prenez le langage que vous voulez,
celui sur lequel un ami peut vous aider peut-être.
On trouve tous ces langages parmi les sites web les plus connus. On
trouve par exemple du PHP chez Facebook et OpenClassrooms, du Java
sur le site de votre banque, du Python et du Java chez Google, etc.
Inutile de tous les connaître ! Un seul langage serveur suffit pour faire
tout ce que vous voulez. Ils sont tous suffisamment puissants, mais ont
un "style" différent.
Par exemple, on dit que l’italien est "une langue qui chante", et certains
développeurs pourraient dire de la même façon que Ruby est "un
langage qui chante" (parce qu’ils aiment la façon dont le langage est
conçu). Oui, je sais, cela paraît fou !
Les frameworks
En plus de ces langages, on a inventé des frameworks pour faciliter la
création de sites web dans ces langages.
Les frameworks sont des boîtes à outils qui se révèlent de plus en plus
indispensables aujourd’hui. De la même façon que l’on n’envisage plus
de creuser un trou "à la main" (on préfère utiliser une pelleteuse !), on
n’envisage plus trop de construire un site web à la main. On se fait aider
un peu par un framework !
Les frameworks se rapportent à des langages. On peut citer :
Pour PHP : Symfony, Zend...
Pour Java : Java EE (ou J2EE)
Pour Python : Django
Pour C# : ASP .NET
Inutile de les retenir ! Je souhaite juste que vous connaissiez le concept
de framework à ce stade.
On confond souvent les frameworks et les CMS (Content Management
System) tels que WordPress.
WordPress n’est pas un framework : c’est un CMS, c’est-à-dire un site
prêt à l’emploi. Il est plus facile à utiliser qu’un framework, car il n’est
pas nécessaire de coder, mais il est aussi plus limité (même si, pour
beaucoup de personnes, il suffit largement !).
Comment un langage serveur génère-t-il une page ?
Le rôle d’un langage serveur est de générer une page web. On peut
résumer l’interaction entre le client et le serveur comme ceci :
Communication entre un client et un serveur
1. Le client demande une page au serveur.
2. Le serveur génère la page (à l’aide du langage serveur).
3. Le serveur envoie la page (sous forme de code HTML et CSS).
Par exemple, si vous utilisez PHP comme langage serveur, et HTML et
CSS comme langages client, voici à quoi ressemblera le schéma :
Communication avec les langages client et serveur
Utilisation des langages
Comme vous le voyez, PHP (le langage serveur) est du côté du serveur.
Son rôle est de générer une page HTML et CSS, qui sera ensuite
envoyée au client.
Un client ne sait lire que du HTML et du CSS (ainsi que du JavaScript).
Il ne sait pas lire un langage serveur comme PHP.
À quoi ressemble un langage serveur ?
Prenons un langage serveur comme PHP. Voici un exemple de code en
PHP qui vérifie que le fichier envoyé via un formulaire est bien une
image et que celle-ci n’est pas trop grosse :
<?php
if (isset($_FILES['monfichier']) AND $_FILES['monfichier']['error'] == 0)
if ($_FILES['monfichier']['size'] <= 1000000)
$infosfichier = pathinfo($_FILES['monfichier']['name']);
$extension_upload = $infosfichier['extension'];
$extensions_autorisees = array('jpg', 'jpeg', 'gif', 'png');
if (in_array($extension_upload, $extensions_autorisees))
// Afficher le message ici
?>
Là encore, ne paniquez pas si vous ne comprenez pas, c’est normal ! Un
code en langage serveur est souvent plus compliqué à comprendre pour
un débutant qu’un code en langage client.
À vous de jouer !
Avec cette activité, prouvez que vous êtes capables de reconnaître le
rôle des langages serveur en analysant une situation très concrète : la
connexion au site OpenClassrooms.
Page connexion d'OpenClassrooms
Je vous ai listé ci-dessous des développements qu’on a dû effectuer pour
créer cette fonctionnalité. Votre mission est de déterminer, pour chacun
de ces développements, lesquels ont été programmés avec les langages
serveur et lesquels avec des langages client. C’est parti !
Créer un champ texte “Adresse mail ou nom d’utilisateur”
Autoriser la connexion des utilisateurs ayant un mot de passe
respectant les critères de sécurité
Faire apparaître le bouton “SE CONNECTER” en violet
Créer le bouton à cocher “Se souvenir de moi”
Souligner en violet le lien “Mot de passe oublié ?”
Autoriser les utilisateurs ayant une adresse mail correcte à se
connecter
Générer un tableau de bord personnalisé pour les utilisateurs se
connectant
Créer un lien vers la page “Inscrivez-vous gratuitement”
Vérifiez votre travail
Alors, vous êtes allé au bout ? Vérifiez votre travail !
Langage client :
Créer un champ texte “Adresse mail ou nom d’utilisateur”
Faire apparaître le bouton “SE CONNECTER” en violet
Créer le bouton à cocher “Se souvenir de moi”
Souligner en violet le lien “Mot de passe oublié ?”
Créer un lien vers la page “Inscrivez-vous gratuitement”
Langage serveur :
Autoriser la connexion des utilisateurs ayant un mot de passe
respectant les critères de sécurité
Autoriser les utilisateurs ayant une adresse mail correcte à se
connecter
Générer la page “Tableau de bord” pour les utilisateurs se
connectant
Vous l’aurez compris : toute la partie apparente du site est codée avec
les langages client, comme html, alors que tout ce qui décrit le
comportement du site relève du langage serveur.
#
Découvrez les bases de données
Tous les sites web ont besoin d’enregistrer des informations, comme la
liste de leurs utilisateurs, des messages qui ont été échangés, etc. C’est
là qu’une base de données intervient : c’est un logiciel dédié au
stockage de données.
Parmi les logiciels de base de données les plus célèbres, on peut citer :
MySQL
PostgreSQL
SQL Server
Oracle
SQLite
Etc.
Pour communiquer avec ces logiciels, on utilise un langage : SQL. Oui,
je sais, encore un langage. 😳
On dit que l’on fait des requêtes SQL. Par exemple : "Je veux la liste
des derniers utilisateurs inscrits sur mon site" ou "Je veux stocker ce
message".
Voici à quoi ressemble une requête SQL pour vous donner une idée :
SELECT id, name, login FROM users ORDER BY id DESC
Bien sûr, c’est une requête simple, et l’on peut faire beaucoup plus
compliqué si l’on veut. Mais là, on débute, donc on ne veut pas. 😶
C’est généralement le serveur qui communique avec la base de données,
par le biais du langage serveur. Résumons dans un schéma pour tenter
d’y voir plus clair :
Schéma représentant les interactions entre le client, le serveur et la base
de données La base de données est aussi stockée sur un serveur
(généralement un serveur différent).
Distinguez les sites responsive et les applications mobile
Nous avons beaucoup parlé jusqu’ici de sites web que l’on affiche sur
un ordinateur. Or, aujourd’hui, les mobiles (smartphones, tablettes) sont
très courants. Comment faire pour communiquer avec eux ?
Vous avez 2 solutions. Vous pouvez faire :
Un site web responsive : vous créez votre site web dès le départ
en pensant aux smartphones. Vous faites en sorte que le design
s’adapte automatiquement aux appareils de petite taille (on dit qu’il
est responsive). C’est la solution la plus simple en général.
Une application native : vous créez une application mobile (pour
iOS, Android, etc.). C’est bien plus lourd, car il faut utiliser
d’autres langages, mais l’expérience sera bien meilleure si vous
avez un service complexe.
Que devez-vous faire ? À mon avis, si vous avez un site web, il est
aujourd’hui indispensable dans tous les cas de faire un site web
responsive.
L’application native est utile uniquement si vous avez un projet
spécifique aux smartphones, qui est suffisamment complexe (un jeu, par
exemple). En revanche, s’il s’agit juste de consulter des pages avec des
informations simples, il n’est peut-être pas nécessaire de développer une
application mobile.
En résumé
Le Web fonctionne à l’aide de nombreux langages informatiques.
HTML, CSS et JavaScript sont des langages client : ils sont lus
par votre ordinateur, l’ordinateur d’un visiteur. Ils décrivent
l’apparence du site web.
PHP, Java, Ruby et Python sont des langages serveur. Ils sont
utilisés par l’ordinateur qui distribue le site web, appelé... serveur.
Leur rôle est de décrire le comportement du site web.
Les frameworks sont des boîtes à outils qui facilitent l’usage des
langages serveur.
Les données (telle que la liste des utilisateurs) sont stockées dans
des bases de données. On communique avec elles en effectuant
des requêtes SQL..
Si les langages client sont tous obligatoires et incontournables, il
n’y a en revanche pas de meilleur langage côté serveur.
Choisissez celui qui vous parle le plus !
Découvrez les serveurs
Dans cette nouvelle partie, nous allons nous intéresser plus précisément
au réseau lui-même. Le réseau est ce qui permet aux ordinateurs de
communiquer entre eux. Nous allons creuser plus profond dans les
entrailles du fonctionnement d’Internet !
Serveurs et datacenters
Pour commencer, je vous rappelle que l’on se représente souvent une
toile d’araignée pour désigner le Web. En effet, les ordinateurs
communiquent entre eux via des nœuds :
Toile d'araignée - Schéma représentant la communication entre les
machines
Les serveurs sont les machines qui possèdent les sites web et qui les
distribuent aux clients.
Vous savez à quoi ressemble la machine du client (c’est la vôtre !), mais
à quoi ressemble la machine du serveur ? Pour en voir, il faut se rendre
dans un datacenter, un lieu où sont situés habituellement les serveurs.
Un
datacenter, où sont stockés les serveurs
Il existe des datacenters comme ceci un peu partout dans le monde. Ce
sont des bâtiments très sécurisés (je me souviens, pour rentrer dans l’un
d’eux, d’avoir dû déposer empreintes digitales et faire un scanner
rétinien !).
Sur les côtés de l’image ci-dessus, vous voyez des baies de serveurs.
Les serveurs sont entassés les uns sur les autres (il y en a plusieurs
dizaines par baie !).
Plusieurs serveurs les uns
sur les autres, dans une baie
Vous remarquerez que les serveurs sont souvent des machines "plates"
comme ici, pour pouvoir les entasser plus facilement. Il n’y a pas
d’écran, car personne ne les utilise directement en général. Ils se
contentent de transmettre le contenu des sites web sur le réseau.
Communication entre serveurs et clients
Il faut bien que les serveurs puissent communiquer avec les clients.
Comment cela se passe-t-il ?
Comme vous le voyez, à l’arrière des serveurs, il y a des câbles réseau
qui partent. Ils sont reliés à un câble de fibre optique permettant un
échange ultrarapide. On retrouve cette fibre souvent enterrée sous terre,
mais aussi... au fond de la mer ! En fait, la majorité du trafic d’Internet
passe par des câbles sous-marins comme celui-ci :
Un câble sous-marin
Si vous vous connectez à un site web hébergé aux États-Unis depuis la
France, il y a de très grandes chances pour que les échanges se fassent à
travers l’un de ces câbles sous l’océan Atlantique !
Si les câbles étaient coupés (cela arrive !), le trafic serait redirigé vers
d’autres câbles, quitte à faire un chemin plus long. C’est la magie
d’Internet : les données vont trouver un itinéraire bis toutes seules !
Dans la pratique, on essaie quand même de faire en sorte que les
serveurs soient physiquement proches des clients. Si vous êtes en
France, il vaut mieux pour vous que les serveurs soient en France. Vous
pouvez aller chercher des données aux États-Unis, mais cela prendra au
moins quelques millisecondes de plus (c’est bien trop long, je veux mon
site tout de suite, moi ! 🙀 )
#
Distinguez adresse IP et noms d'hôtes
Comment faire pour retrouver un ordinateur à travers toute la planète ?
C’est une bonne question, non ? 🤔
Par exemple, si vous voulez aller sur Google, comment votre ordinateur
fait-il pour retrouver le bon serveur parmi tous ceux qui existent ?
Il y a plusieurs mécanismes pour que la magie opère...
L’adresse IP
Chaque ordinateur possède une adresse. On parle d’adresse IP. Il s’agit
d’une suite de nombres comme 205.89.177.26. Vous pouvez voir cela
comme une sorte de numéro de téléphone.
En théorie donc, vous pouvez aller sur un site web en tapant directement
l’adresse du serveur dans votre barre d’adresse.
D’accord, mais comment je connais l’adresse IP du serveur de Google,
moi ?
C’est vrai, est-ce que vous connaissez les numéros de téléphone de tous
vos contacts, vous ? Moi pas !
(En plus, Google a des milliers de serveurs...)
Les noms d’hôtes et DNS
DNS signifie 'Domaine Name System' en anglais, en français on peut
dire système de noms de domaine.
On a donc créé des noms d’hôte, comme "google.com", pour pouvoir se
souvenir plus facilement du nom du service que l’on veut contacter.
Et l’on a ensuite créé un service d’annuaire, les DNS, pour faire le lien
entre le nom d’hôte et l’adresse IP :
Schéma représentant la traduction DNS du nom d'hôte en adresse IP
Le DNS permet de traduire le nom d’hôte en adresse IP.
Tout ceci fonctionne heureusement sans que l’on ait besoin d’y penser.
On tape juste "google.com" dans notre navigateur, et le site web
s’affiche ! Cela dit, cela ne peut pas faire de mal de savoir que tous ces
services sont à l’œuvre derrière. 🙂
T
oile représentant les serveurs avec leur adresse IP et nom d'hôte
Découvrez les protocoles
Rentrons encore plus dans le détail : comment les ordinateurs
communiquent-ils entre eux ? Je veux dire, vraiment, au fond, quelle
langue parlent-ils entre eux ?
Ils n’utilisent pas les langages dont je vous ai parlé (HTML, CSS...), car
ceux-ci servent à représenter les sites web.
Il nous manque en fait une langue permettant aux ordinateurs de
communiquer, pour dire par exemple : "Eh, peux-tu me donner cette page web ? Merci !" Si
l’on n’avait pas des "langues communes", les ordinateurs parleraient à
coup sûr un dialogue impossible :
Incompréhension entre deux serveurs parlant des langues différentes
Sans langue commune, ce serait le bazar dans les communications entre
machines !
On a donc inventé des langages de communication pour que les
machines se parlent entre elles. On les appelle les protocoles.
Protocoles bas niveau
À la base d’Internet, on a des protocoles de bas niveau. On les retrouve
dans toutes les communications :
TCP (Transmission Control Protocol)
UDP (User Datagram Protocol)
TCP en particulier est très important. Il a été inventé par Vint Cerf,
considéré aujourd’hui grâce à cela comme le père d’Internet. Sans TCP,
pas de communication réseau... et Tim Berners-Lee n’aurait jamais pu
inventer le Web.
TCP est utilisé pour un peu tout : faire transiter des pages web, des e-
mails, des vidéos...
Photographie de Vincent Cerf,
l'inventeur du protocole TCP
Protocoles haut niveau
Les protocoles dits "haut niveau" sont généralement basés sur TCP (ou
UDP). Ils forment une surcouche qui englobe TCP.
Les noms des protocoles haut niveau devraient vous être un peu plus
familiers pour certains :
HTTP : le protocole qui permet d’échanger des pages web entre le
client et le serveur. En plus du langage HTML, Tim Berners-Lee a
inventé les bases du protocole HTTP qui permet d’échanger les
pages. C’est ce que signifie le "http://" que vous voyez au début
des adresses web !
HTTPS : identique à HTTP, avec le "S" en plus qui signifie
"Secure". Les pages sont chiffrées, pour garantir que personne ne
peut les lire (par exemple quelqu’un qui espionnerait les données
qui transitent dans les câbles sous-marins !).
FTP : permet d’échanger des fichiers.
SMTP : permet d’envoyer des e-mails.
Etc.
Un exemple de protocole : une requête HTTP
Je suis sûr que vous mourez d’envie de voir à quoi ressemble l’une de
ces langues. Et si l’on regardait en particulier une requête avec le
protocole HTTP ?
Voici comment un client demande une page web à un serveur :
GET /page.html HTTP/1.0 Host:GET /page.html HTTP/1.0
Host: example.com
Referer: http://example.com/
User-Agent: CERN-LineMode/2.15 libwww/2.17b3 example.com Referer: http://example.com/ User-Agent: CERN-LineMode/2.15
libwww/2.17b3
On peut traduire ça par : "Hé, toi, le serveur de example.com, peux-tu m’envoyer page.html ? S’il te
plaît ?"
Le serveur va ensuite travailler (en utilisant un langage serveur), puis
renvoyer la page HTML avec une réponse comme ceci :
HTTP/1.0 200 OK
Date: Fri, 31 Dec 1999 23:59:59 GMT
Server: Apache/0.8.4
Content-Type: text/html
Content-Length: 59
Expires: Sat, 01 Jan 2000 00:59:59 GMT
Last-modified: Fri, 09 Aug 1996 14:21:40 GMT
... que l’on pourrait traduire par : "Ho ho ho, j’ai bien la page que tu veux, elle fait cette
taille et elle a été modifiée pour la dernière fois à cette date". Le serveur transmet ensuite le
code HTML de la page.
Cette réponse indique que tout s’est bien passé : le code "200 OK"
signifie que la page existe et que le serveur peut la renvoyer.
Il existe de nombreux codes, mais il y en a un autre au moins que vous
connaissez déjà probablement : 404. Il signifie que la page n’a pas pu
être trouvée sur le serveur.
À vous de jouer !
Je vous propose de vous entraîner à parler avec un serveur web. Vous
allez utiliser le protocole HTTP en utilisant des commandes que je vais
vous apprendre ! Nous allons utiliser un site qui permet d’afficher les
retours HTTP d’un serveur. Nous allons littéralement voir le serveur
nous parler ! Pour ça, rendez-vous sur https://reqbin.com/curl et suivez
les étapes suivantes :
1. Essayez de contacter la page d'accueil de Google en tapant la
commande suivante:
curl https://google.com --head (1).
2. Cliquez sur “Send” (2).
3. Au bout de quelques instants, le serveur répond. Cliquez sur “Raw”
(3) à droite pour lire le résultat “brut”.
4. Vous pouvez alors lire le retour HTTP du serveur de Google. La
première ligne commence par “HTTP/1.1 200 OK” qui signifie que
la page demandée a bien été trouvée (code 200).
5. Essayez maintenant avec une adresse qui n’existe pas. Par exemple
tapez la commande :
https://www.google.com/cudkedpqma --head
6. Cette fois, le serveur répond par “HTTP/1.1 404 Not Found” : la
page demandée n’a pas été trouvée (la fameuse erreur 404 !).
7. Pour l’instant nous n’avons demandé que l’en-tête HTTP. Si on
retire --head , on va récupérer tout le contenu de la page, y compris
son code HTML ! Essayez par exemple :
curl https://www.openclassrooms.com
8. Si vous lisez un peu plus bas dans la section “Raw” vous allez voir
tout le code HTML de la page apparaître !
En résumé
Les serveurs distribuent les sites web depuis les datacenters.
Les ordinateurs sont tous reliés entre eux par des câbles (souvent
sous-marins !).
L’adresse IP permet de retrouver un ordinateur sur la planète.
Le nom d’hôte (ex : google.com) est plus facile à retenir que l’IP.
C’est pour cela que l’on fait une traduction via un annuaire, appelé
le DNS.
Les protocoles indiquent comment les machines doivent
communiquer entre elles.
#
Découvrez les différents professionnels du web
Maintenant que vous en savez plus sur le fonctionnement d’Internet et
du web, vous vous demandez sûrement qui sont les personnes qui
travaillent dans ce domaine. Pour qu’un site Internet ou une application
fonctionne et arrive jusqu’à nous, beaucoup de professionnels aux
compétences variées sont en effet mobilisés…
Les grandes familles de métiers
Je vais vous donner une vision d’ensemble. Voici plusieurs grandes
familles de métiers associés aux web :
Ceux qui développent les sites web : ce sont les développeurs. Ils
utilisent les langages de programmation dont je vous ai parlé, pour
coder le site ou l’application... Évidemment, comme je vous le
disais, il existe plein de spécialités possibles !
Ceux qui coordonnent la production ou l’évolution d’un produit
web : dans cette catégorie, on trouve les chefs de projets digitaux,
les product owners et product managers… Ils ne codent pas
directement, mais sont en lien direct avec les équipes techniques.
Ils ont une vision globale du produit et des fonctionnalités à
développer, et assurent la bonne gestion du projet.
Ceux qui font en sorte que le site soit le plus simple d’utilisation
possible : ce sont les UX designers, les professionnels du design et
de l’ergonomie des pages web ou des applications.
Ceux qui gèrent l’infrastructure du web : ce sont les professionnels
des SI (systèmes d’information). Ils ont la responsabilité des
serveurs, de leur configuration… Bref, sans eux les développeurs
et chefs de projets ne pourraient pas travailler, et le site web ne
répondrait tout simplement pas ! Imaginez que ce sont les
architectes qui permettent à l’ensemble de fonctionner. Des super-
héros de l’ombre, en quelque sorte !
Parmi eux, on compte par exemple le technicien informatique,
qui paramètre les équipements et le réseau, et qui intervient en cas
de question ou de problème.
Bien sûr, cette liste n’est pas exhaustive. J’aurais par exemple pu citer
les métiers en lien avec la data ou l’intelligence artificielle, qui prennent
de plus en plus d’importance ! Ou encore les métiers du marketing et de
la communication, qui mobilisent des canaux web pour interagir avec
les publics. En réalité, tous les métiers sont aujourd’hui liés au web
d’une façon ou d’une autre, et le seront de plus en plus : l’utilisation du
web est devenue incontournable pour évoluer professionnellement.
Envie d’en savoir plus ?
Connaissez-vous Le Joboscope, le podcast d'OpenClassrooms qui parle
du quotidien des professionnels ? Je vous encourage à écouter les
épisodes qui vous intéressent ici.
Découvrez le métier de développeur
Dans les prochains chapitres, je vous invite à entrer dans le quotidien de
trois professionnels : le développeur, l’UX designer et le technicien
informatique. Peut-être que cet aperçu vous donnera envie de vous
lancer dans l’une de ces voies !
Vous êtes curieux et aimeriez savoir à quoi ressemblent les
développeurs et développeuses qui font les sites web ? Vous êtes au bon
endroit !
Le quotidien d’un développeur
Le développeur est une personne qui conçoit, teste, documente et
maintient des applications, des sites Internet ou des logiciels.
Contrairement à ce qu’on peut s’imaginer, le développeur ne passe pas
toute sa journée à écrire des lignes de code. Quelle que soit sa spécialité,
il passe beaucoup de temps à tester son code, à chercher à optimiser ses
méthodes de développement, et à travailler avec les autres ! L’un de ses
plus grands challenges est d’analyser le besoin initial du client ou de
l’utilisateur : le développeur doit comprendre ce besoin pour le traduire
en langage de programmation.
Les différentes spécialités
Voici une introduction à quelques spécialités possibles :
le développeur front-end : le développeur front-end travaille sur
toute la partie apparente du site, ce que nous voyons lorsque nous
allons sur une page web. Il crée l’interface utilisateur de telle sorte
qu’elle soit la plus adaptée au besoin, et la plus simple possible. Il
utilise les langages client tels que HTML, CSS ou JavaScript ;
le développeur back-end : le développeur back-end travaille au
contraire sur toutes les composantes cachées d’un site. Il crée
l’infrastructure adaptée, et coordonne toutes les relations entre le
site et les bases de données. Il gère la “logique” du site web. Il
connaît bien un ou plusieurs langages de programmation (PHP,
Ruby, Python, Java) et le langage des bases de données (SQL),
ainsi que les frameworks qui lui facilitent la tâche ;
le développeur mobile : il développe des applications Android ou
iOS, parfois même les deux, même si c’est plus rare ! Il travaille
sur toutes les étapes de la conception : depuis le cahier des charges
jusqu’à la correction des bugs. Quand on développe sur mobile, on
travaille en général aussi bien sur l’interface (front-end) que sur la
logique (back-end).
Ce qu’il faut savoir sur le métier
Beaucoup de gens pensent que le métier de développeur n’est pas fait
pour eux... et se trompent ! Voici quelques conseils que j’aurais aimé
entendre quand j’ai commencé à m’intéresser au développement :
Pas besoin d’être bon en maths pour être un bon
développeur. Vous avez peur de vous replonger dans l’univers des
mathématiques ? Rassurez-vous ! Pour être développeur, pas
besoin des maths, c’est l’esprit logique qui compte.
Vous pouvez commencer à tout âge... quel que soit votre
parcours. On croit qu’il faut avoir fait des filières scientifiques,
mais non. On croit qu’il faut faire cela depuis que l’on a 3 ans et
passer 10 heures par jour devant l’ordinateur, ce n’est pas vrai non
plus. Le secteur se prête très bien aux autodidactes, avec des
diplômes variés (littéraires, sportifs...), et même sans diplômes.
N’oubliez pas que le secret de l’action, c’est de s’y mettre, alors
lancez-vous !
Il faut apprendre l’anglais : pour progresser, on en a rapidement
besoin. Au minimum, il ne faut pas avoir peur de lire de l’anglais
sur des sites web, car on y retrouve une grande quantité
d’informations qui ne seront probablement jamais traduites en
français.
Ensuite, pour collaborer avec d’autres développeurs, il faut écrire
son code en anglais et donc savoir au moins écrire de l’anglais. En
revanche, parler l’anglais à l’oral est moins indispensable.
Les développeurs aiment résoudre des problèmes complexes et
nouveaux. Répéter des tâches identiques ne les intéresse pas. Étant
donné que la demande pour les développeurs est forte, ce sont
souvent eux qui choisissent leur entreprise et non l’inverse ! Bien
souvent, ce n’est pas le salaire qui les attirera, mais le challenge
que propose l’entreprise. Les développeurs aiment
pouvoir organiser leur temps librement : ils fonctionnent mal
dans des environnements très contraints. Nombre d’entre eux
apprécient le télétravail, que ce soit quelques jours par semaine ou
en continu. Certains très bons développeurs travaillent d’ailleurs
entièrement à distance et bougent de pays en pays (on parle
de digital nomades).
Il est impossible de tout connaître. N’espérez pas apprendre tous
les langages. Soyez raisonnable dans les objectifs que vous vous
fixez. En réalité, connaître un langage serveur comme PHP ou
Python suffit amplement (en plus des bases HTML et CSS).
Personne ne maîtrise tout sur le bout des doigts.
Les meilleurs développeurs se spécialisent dans un langage, savent
que les autres existent et voient de loin à quoi ils peuvent servir,
mais c’est tout. C’est leur capacité d’apprendre rapidement quand
le besoin se fait sentir qui fait la différence.
Enfin, il existe un truc, LE truc qui sauve les développeurs dans 99 %
des cas… et que vous connaissez déjà ! Il est terriblement simple, vous
allez être déçu quand vous allez le lire, et pourtant je vois que les
débutants oublient toujours de s’en servir.
Utilisez un moteur de recherche. Utilisez Google, ou ce que vous
voulez.
N’ayez pas peur de simplement copier le message d’erreur que vous
affiche l’ordinateur (même si c’est du chinois pour vous). Quelqu’un a
déjà eu le même problème que vous avant, c’est sûr. Vous n’êtes pas
seul !
Entrez sur Google le message d’erreur qui s’affiche à l’écran.
Sérieusement, faites-le !
Vous verrez souvent que les conversations au sujet du message d’erreur
sont en anglais. C’est pour cela que je vous incitais un peu plus tôt à
travailler votre anglais si vous en sentez le besoin. Cela va vous sauver
la mise tellement de fois, vous n’avez pas idée. 😁
Les étapes pour vous lancer
Le métier de Web Développeur
Voici quelques étapes que je vous conseille de suivre si vous souhaitez
tenter l’aventure et devenir développeur ou développeuse :
1. Suivre ce cours d’introduction au web. Bon, ça, c’est fait. ✅
2. Apprendre HTML et CSS, car ce sont les langages de base du web.
Vous aurez alors un niveau de développeur front-end junior (ou
intégrateur web), et pourrez commencer déjà à créer des sites web.
3. Apprendre un langage serveur (PHP, Python...).
4. Apprendre JavaScript pour progresser dans les langages front-end
et créer des pages plus complexes.
5. Apprendre la ligne de commande Linux (si vous voulez apprendre
à monter un serveur et devenir sysadmin).
L’ordre est juste indicatif. Commencez au moins par HTML5 et CSS3,
mais sentez-vous libre de suivre un chemin différent. Il n’y a pas de
voie unique toute tracée !
Découvrez le métier d’UX designer
Vous est-il déjà arrivé d’aller sur un site… et de vous énerver de ne pas
trouver le bon bouton ? De passer plusieurs minutes à chercher
l’information ou la fonctionnalité dont vous avez besoin ? Moi oui !
C’est pour éviter ce genre de frustrations qu’il existe des UX designers.
L’UX designer travaille à ce que l’internaute (ou le mobinaute) s’oriente
aisément et trouve ce qu’il est venu chercher de manière efficace. Il fait
en sorte que l’utilisation d’un site ou d’une application soit la plus
simple possible, que la navigation soit fluide et intuitive ; bref, qu’on
prenne plaisir à utiliser le produit.
Le quotidien de l’UX designer
Très concrètement, l’UX designer doit s’assurer que le site ou
l’application réponde aux attentes et besoins de ses utilisateurs, qu’il procure
des émotions positives.
UX signifie expérience utilisateur (user experience). Cela renvoie à tout
ce que l’utilisateur parcourt, vit, ressent, face au site ou à l’application.
Pour réussir sa mission, l’UX designer va utiliser plusieurs méthodes
“centrées utilisateur”. Il va définir le public cible du produit, mener des
“recherches utilisateur” : via des entretiens, des observations in situ, des
analyses de données, il cherche à comprendre et à analyser les attentes
des utilisateurs. Il va créer des prototypes, les tester avec de potentiels
futurs utilisateurs... C’est ce qu’on appelle la conception centrée sur
l’humain ou Human-Centered Design (HCD).
Le quotidien d’un UX designer est donc fait de beaucoup
d’interactions : l’UX designer rencontre régulièrement des utilisateurs et
doit faire preuve d’empathie pour comprendre leurs besoins et attentes.
Aussi, l’UX designer est en lien avec les équipes techniques, dont les
développeurs ! Ces professionnels travaillent tous pour concevoir le
produit, mais sous des angles différents et complémentaires.
La différence entre UX et UI designer
Peut-être avez-vous déjà entendu parler de l’UI ?
UI désigne l’interface utilisateur (user interface). Il s’agit de la partie
visible du produit : son apparence, sa mise en page, son interactivité.
Concrètement, l’UI designer mobilise des méthodologies très proches
de l’UX, centrées sur l’humain. Alors que l’UX designer s’intéresse à
l’expérience globale de l’utilisateur, l’UI designer va se concentrer sur
l’interface. En lien avec les équipes techniques, il donne vie au produit
en mixant des éléments graphiques et des éléments fonctionnels, de telle
sorte que le produit soit le plus attractif, agréable et accessible possible.
Si vous deviez résumer, vous diriez sans doute que l’UI designer et
l’UX designer travaillent sur des missions qui se recoupent… et vous auriez tout à fait
raison ! D’ailleurs, dans certaines structures, on ne différencie pas les deux
métiers et on parle de “Product Designer”. C’est souvent le cas dans les
petites entreprises, qui vont chercher des profils généralistes capables de
travailler sur toutes les dimensions du design d’un produit.
Envie de vous lancer ?
Le métier d'UX Designer
Cette voie est faite pour vous si :
Vous aimez écouter et observer: l’empathie et le sens de l’observation sont
des compétences essentielles de l’UX ou UI designer. Si vous
aimez écouter activement les personnes qui vous entourent,
comprendre leurs comportements, observer ce qui se passe autour
de vous, peut-être avez-vous déjà une fibre à développer ! 😉
Vous aimez la démarche de création : pour devenir UX ou UI designer, vous
n’avez pas forcément besoin d’être artiste. Mais si êtes déjà engagé
dans une pratique créative ou artistique, celle-ci vous sera utile !
En effet, ces deux métiers sont particulièrement créatifs et
polyvalents.
Vous avez un intérêt approfondi pour le web et le graphisme.
Vous adorez passer des
heures à explorer de nouvelles sources d’inspiration graphique ?
Votre curiosité sera un réel atout !
Vous aimez travailler en équipe. L’UX ou l’UI designer travaillent très
étroitement avec les chefs de projets et développeurs, pour
concevoir le meilleur produit possible. Il s’agit de métiers qui
demandent de la collaboration et de la communication.
Découvrez le métier de technicien informatique
Tous les métiers cités précédemment ont besoin de soutien. Par
exemple, les développeurs et UX designers ont besoin de postes de
travail qui fonctionnent correctement, avec les bons outils installés et
configurés. Les techniciens informatiques s’occupent de cela. Ils font partie de la
grande famille des métiers liés aux systèmes d’information (SI).
Si vous avez déjà travaillé en entreprise, il vous est certainement déjà
arrivé de ne pas réussir à accéder à un logiciel, d’avoir besoin de
configurer une visio… Comment vous en êtes-vous sorti ? Vous avez
certainement fait appel à l’expertise du technicien informatique de votre
entreprise !
Le rôle du technicien informatique au sein d'une entreprise est d'assurer
le bon fonctionnement du parc informatique, et de fournir aux utilisateurs
des solutions pour pallier les éventuelles pannes ou difficultés qu’ils peuvent
rencontrer.
Le quotidien du technicien informatique
Le poste du technicien informatique est extrêmement polyvalent ! Voici
notamment ce qu’il est amené à faire :
il gère le parc informatique, c’est-à-dire tout l’équipement nécessaire aux
utilisateurs (ordinateurs, périphériques), mais aussi les systèmes
d’exploitation (Windows, OS X, Linux…). Le technicien informatique
est responsable de la configuration du parc informatique, et de
sa maintenance. Il référence le matériel, gère les stocks, pour s’assurer
que le parc soit toujours opérationnel ;
il gère l’accès aux services réseaux de l’entreprise. Il assure que toutes les
applications et services nécessaires soient accessibles depuis les
postes de travail des utilisateurs. Il met en place l’architecture des
câbles réseaux et du WiFi ;
il assure le support technique et conseille les utilisateurs : les interactions
humaines sont au cœur du métier. Le technicien informatique est
l’interlocuteur privilégié des employés d’une entreprise sur toutes
les questions informatiques. Il doit recueillir les demandes des
utilisateurs, les orienter et intervenir en cas de panne. Il doit trier
les demandes en fonction de leur degré d’urgence, et y répondre de
façon adaptée. Le technicien informatique accompagne aussi ses
utilisateurs pour qu’ils deviennent autonomes avec leurs outils de
travail. C’est un métier qui demande de la patience et de la pédagogie !
Concrètement, si vous étiez technicien informatique, voici à quoi
pourrait ressembler votre journée :
vous arrivez au bureau. Aujourd’hui, de nouveaux collègues
rejoignent l’entreprise ! Vous commencez votre journée en leur
remettant leurs ordinateurs, que vous avez déjà configurés.
Vous installez les logiciels dont ils auront besoin et vous vous
assurez qu’ils ont bien accès aux outils essentiels ;
une fois cette mission accomplie, vous vous connectez sur votre
logiciel qui recense toutes les questions et demandes envoyées par
les utilisateurs. Vous triez les demandes selon leur degré d’urgence
et leur importance ;
on vous indique qu’une des imprimantes ne fonctionne plus : c’est
à vous de jouer ! Vous analysez le problème et trouvez une
solution. Votre objectif est de faire en sorte que toutes les
ressources informatiques soient fonctionnelles ;
un collègue vient vous voir pour vous poser des questions sur le
VPN (Virtual Private Network) : vous lui expliquez pourquoi le
VPN est indispensable pour protéger ses télécommunications
lorsqu’on travaille à distance. Vous vous assurez d’avoir répondu à
toutes ses questions et l’aidez à l’installer.
Vous l’aurez compris : pour être technicien informatique, il faut aimer
avoir des tâches diversifiées et être en contact régulier avec les autres !
Envie de vous lancer ?
Le métier de technicien informatique
Cette voie est faite pour vous si :
vous êtes très intéressé par le domaine de l’informatique et vous
connaissez bien les outils. Ce n’est pas pour rien que c’est toujours
vous qui trafiquez les bécanes de vos proches quand il faut régler
un bug ou changer des composants ;
vous souhaitez avoir un poste généraliste, qui vous permette de
combiner plusieurs tâches ;
vous adorez parler aux gens, et régler leurs problèmes
informatiques vous paraît gratifiant. Un job au contact des personnes qui
travaillent dans votre entreprise ou des clients, cela vous motive.
Comme ça, vous allez rencontrer tout le monde : les comptables,
les développeurs, le marketing, la direction… ;
vous savez rester calme face à une crise et avez des qualités d’empathie qui vous
permettent de calmer et rassurer les gens lors de situations
délicates.