Le fonctionnement d'internet à l'usage des développeurs web : formation ludique

Ce billet détaille un module de formation que j'ai conçu afin de transmettre à des développeurs web en devenir les bases théoriques du fonctionnement d'internet.

Ce module dure une journée et est composé :

  • D'une partie théorique ;
  • d'une mise en application sous forme de jeu de rôle.

Si vous êtes intéressé·e par cette journée de formation au sein de votre structure, n'hésitez pas à me contacter. J'ai déjà eu l'occasion d'animer ce module à plusieurs reprises dans le cadre de formations continues.

  • Effectif : max 20 participants
  • Pré-requis : être utilisateur·ice régulier·e de services internet

L'ensemble des ressources de cette formation sont publiées selon les termes de la Licence Creative Commons Attribution - Partage dans les Mêmes Conditions 3.0 France.

Suggestions et corrections bienvenues !

Objectifs pédagogiques

  • Comprendre les différentes technologies réseau (IP, HTTP, DNS…) qui entrent en jeu sur internet, notamment sur le web ;
  • avoir une vision d'ensemble sur ce qui se passe dans les échanges entre navigateur et du serveur web (exemple : pouvoir investiguer le dysfonctionnement d'un site web) ;
  • être à même d'échanger avec un administrateur système.

En aucun cas il ne s'agit d'une formation à l'administration de réseaux ; ce module s'autorise d'ailleurs quelques raccourcis et simplifications.

A. Partie théorique (⌚ 4h30)

Cette partie alterne exposé théorique et participations du groupe. Internet étant un outil quotidien pour les stagiaires, l'expérience personnelle de chacun n'est jamais très loin des notions abordées.

Toutes les couches réseau sont évoquées, mais l'accent est mis sur les protocoles manipulés de près par les développeurs web, notamment HTTP et DNS.

Supports de présentation

B. Jeu de rôle (⌚ 2h30)

« On dirait que tu serais la box et puis moi, je serais Firefox. »

Réinvestit physiquement les notions abordées dans la partie théorique.

Existe actuellement en 2 versions : 17 ou 19 joueurs (déclinable pour d'autres effectifs).

Cette mise en pratique répond à la question : Comment « vivre » et comprendre les échanges de données sur internet ; alors qu'ils nous sont masqués d'une part par l'abstraction offerte par les machines et d'autre part par l'étalement géographique des réseaux.

Scénario

Chaque participant·e incarne un logiciel ou une machine sur le réseau internet (routeur, système d'exploitation, navigateur web, « box internet », serveur web…).

Situation : l'utilisateur·ice final·e (qui peut être joué par le/la formateur·ice) a reçu un email contenant un lien hypertexte pointant sur une petite annonce en ligne.

On déroule ensuite « physiquement » tous les échanges ayant lieu sur le réseau entre le clic sur ce lien et le moment où l'utilisateur·ice a sous les yeux la page web demandée.

Plan du réseau mis en scène Le réseau à reproduire par les participant·e·s

Matériel

À vidéo-projeter :

  • Présentation du jeu complète la présente page sur certains points, inclut notamment la carte du réseau.

À imprimer :

  • Fiches rôle, une par joueur·euse, (fichier odt) ;
  • Différents éléments de la page web, à découper (fichier xcf),

Autre :

  • Une salle spacieuse avec du mobilier déplaçable facilement
  • vidéo-projecteur
  • pelotes de laine
  • ciseaux
  • enveloppes pour les protocoles
    • IPv6
    • TCP
    • UDP
    • ICMP
    • HTTP requête
    • HTTP réponse

Les enveloppes de protocoles sont annotées avec les champs principaux de chaque protocole. Les enveloppes utilisées pour le jeu

Mise en place

  1. On présente chaque rôle au fur et à mesure que l'on remet les fiches aux participant·e·s ;
  2. Les participant·e·s reproduisent le schéma réseau :
    • chaque élément de mobilier correspond à une machine du réseau2 ;
    • on tend des fils de laine qui représentent les liens réseau entre les machines du réseau.

Principe de jeu

Les messages voyagent dans des enveloppes représentant les en-têtes des protocoles réseau ; on met les enveloppes les unes dans les autres pour matérialiser l'empilement protocolaire.

Chacun sa responsabilité. Par exemple : le navigateur web construit son paquet sa requête HTTP, et donne l'enveloppe au système d'exploitation1, qui construit les en-têtes TCP et IP, les imbrique les unes dans les autres et les remet à la box internet en suivant un lien réseau….

Coup d'essai : ping

Effectuer un ping (ICMP) entre 2 machines du réseau permet de faire un galop d'essai (astuce : le faire entre 2 machines qui n'interviennent pas tôt dans le scénario de la page web).

La grande requête : chargement de la page web

Scénario principal, initié par le clic de l'utilisateur sur un lien hypertexte qui implique :

  • Une requête DNS, qui en déclenchera plusieurs autres, en fonction de ce qui est en cache dans les différents serveurs DNS (cf. fiches rôle) ;
  • trois requêtes HTTP (page, image d'illustration, image publicitaire), dont les deux dernières pourront se dérouler en parallèle.

Quelques conseils pédagogiques

  • Couper un lien réseau (fil de laine) pour montrer que les paquets passent alors par un autre chemin ;
  • inciter les participant·e·s à énoncer à haute voix ce qu'ils font et pourquoi, ce qui permet aussi aux autres de les aider ;
  • une des difficultés de cet atelier est que souvent, une seule personne est active à la fois ;
  • Les premières requêtes seront lentes, c'est normal.

Pour conclure

Je publie cet article dans une démarche de partage similaire à celle du logiciel libre à laquelle j'adhère. J'espère que cette formation puisse inspirer d'autres formateur·ices, qu'elle questionne des développeur·euses, et qu'elle participe, pourquoi pas à la promotion de mon activité de formation.

Certains fichiers sources (ex: sources des présentations, au format org-mode) ne sont pas publiées avec le reste car pas suffisament propres pour être diffusées ; mais je peux faire l'effort si on me le demande.

Ça ne sont que des supports de formation, il ne s'agit pas d'un cours en ligne, ces documents ne sont qu'un appui à l'animation et la narration d'un/une formateur·ice.

Pourquoi cet module de formation ? J'ai constaté qu'internet, d'un point de vue global était assez peu enseigné, même dans les formations supérieures, et encore moins dans les formations techniques spécialisées, Cependant, avoir un peu de perspective sur le sujet me semble indispensable, même pour ne faire « que » du développement.

PS : si vous animez un atelier similaire, je serais preneur de photographies pour illustrer la partie jeu de rôle, n'ayant eu moi-même la possibilité matérielle d'en prendre.

Références

Pour aller plus loin

Inspiration


  1. On considère le système d'exploitation au sens large, ne se limitant pas au noyau de l'OS. 

  2. Plusieurs participant·e·s peuvent donc se situer au niveau d'un même élément de mobilier, par exemple l'OS et un logiciel.