Fiche de révision : Évolution et développement web

📋 Plan du Cours

1. Origines et évolution d’Internet
2. Adressage et infrastructures réseau
3. Neutralité et usages d’Internet
4. Naissance et essor du Web
5. Transaction client-serveur
6. Technologies front-end
7. Bibliothèques et frameworks
8. Backend et bases de données
9. API et application To-Do
10. Sécurité des applications web
11. Menaces et protection des données
12. Ergonomie et enjeux sociaux

📖 1. Origines et évolution d’Internet

★ À maîtriser

• Dans les années 1940, Alan Turing pose les bases théoriques de l’informatique avec la machine universelle et conçoit une machine capable de tester automatiquement des clés du chiffrement Enigma.

📌 Cyclades explore un réseau s’appuyant sur X.25 et le Minitel, tandis qu’ARPANET adopte une approche de réseau distribué pour améliorer la fiabilité.

• En 1983, le protocole TCP/IP est inventé et devient une base essentielle du fonctionnement d’Internet.

Compléments

• Unix sort en 1969 et permet notamment le temps partagé, donnant un accès multi-utilisateurs aux ordinateurs via des terminaux.

💡 Astuce mémo

Turing → Unix → ARPANET → TCP/IP → Internet

📖 2. Adressage et infrastructures réseau

★ À maîtriser

• Une adresse IPv4 est codée sous la forme de quatre nombres compris entre 0 et 255, ce qui représente environ 4,3 milliards d’adresses possibles.

• IPv6 offre environ $3.4 \times 10^{38}$ adresses possibles.

Compléments

• Tous les ordinateurs et les routeurs possèdent des adresses, et les réseaux sont regroupés au sein de systèmes autonomes appelés AS.

• Internet compte environ 80 000 systèmes autonomes dans le monde, dont Orange est un exemple avec l’AS3215.

💡 Astuce mémo

IPv4 limité, IPv6 immense

📖 3. Neutralité et usages d’Internet

🔑 Notions clés & Définitions

• Neutralité du net : Principe selon lequel Internet achemine les paquets sans que le réseau interprète leur contenu ni agisse de manière discriminatoire sur le trafic.

📝 Points essentiels

📌 Le Web est présenté comme un réseau centralisé, tandis que le pair-à-pair (P2P) est un réseau décentralisé.

💡 Astuce mémo

Web centralisé contre P2P décentralisé

📖 4. Naissance et essor du Web

🔑 Notions clés & Définitions

• HTTP : Protocole permettant aux navigateurs de télécharger et d’afficher des pages web depuis des serveurs distants.

★ À maîtriser

• En 1989, Tim Berners-Lee invente le World Wide Web, un système de pages reliées par des liens hypertextes.

• Dans les années 1990, la croissance du Web s’accélère avec l’apparition de sites web, de forums, de courriels électroniques et de moteurs de recherche.

Compléments

• Le premier navigateur web, nommé WorldWideWeb, a été développé par Tim Berners-Lee.

💡 Astuce mémo

WWW → HTTP → navigateur → moteurs de recherche

📖 5. Transaction client-serveur

🔑 Notions clés & Définitions

• Transaction client-serveur : Échange dans lequel un client envoie une requête à un serveur, qui la traite puis renvoie une réponse affichée par le navigateur.

★ À maîtriser

• 🔄 Une transaction web suit quatre étapes principales:

  1. Le client génère une requête
  2. Le navigateur envoie la requête au serveur
  3. Le serveur traite la requête et répond
  4. Le navigateur interprète et affiche la réponse

• Les codes HTTP indiquent respectivement:

  • 200 : une réussite
  • 403 : un accès refusé
  • 404 : une page introuvable
  • 500 : une erreur côté serveur

Compléments

• Une requête peut être déclenchée par:
  • une URL
  • un lien hypertexte
  • la validation d’un formulaire

💡 Astuce mémo

Requête → traitement serveur → réponse → affichage

📖 6. Technologies front-end

🔑 Notions clés & Définitions

• HTML : Langage de base qui structure le contenu des pages web, mais ce n’est pas un langage de programmation.
• CSS : Permet de contrôler la couleur, la police, l’alignement et la disposition des éléments web, dans le HTML ou dans un fichier indépendant.
• JavaScript : Langage de programmation côté client qui exécute des scripts, gère des événements et permet d’interagir avec une page déjà chargée, mais il peut aussi s’exécuter côté serveur avec Node.js.

📝 Points essentiels

📌 HTML structure le contenu d’une page web, CSS définit son apparence et JavaScript ajoute son interactivité.

💡 Astuce mémo

HTML structure, CSS habille, JavaScript anime

📖 7. Bibliothèques et frameworks

🔑 Notions clés & Définitions

• Bibliothèque : Ensemble de fonctions, de méthodes et de composants prêts à l’emploi qui permet de réutiliser du code testé pour résoudre des problèmes courants.
• Framework : Ensemble d’outils, de bibliothèques et de conventions proposant une structure préétablie pour accélérer le développement d’applications.

📝 Points essentiels

• React, Vue.js et Angular sont utilisés côté frontend, tandis qu’Express.js, Django et Spring Boot sont utilisés côté backend.

💡 Astuce mémo

Code réutilisé → développement plus rapide et maintenable

📖 8. Backend et bases de données

🔑 Notions clés & Définitions

• Base de données : Système organisé permettant de stocker, gérer, créer, lire, mettre à jour et supprimer des données de manière structurée et persistante.

📝 Points essentiels

📌 Le frontend correspond à ce que l’utilisateur voit et manipule, tandis que le backend regroupe les processus en arrière-plan, les serveurs, les bases de données et les API.

📌 Les bases SQL sont adaptées aux données structurées et aux relations complexes, tandis que les bases NoSQL offrent davantage de flexibilité pour les données non structurées ou semi-structurées.

• Le backend gère notamment:
  • les requêtes HTTP
  • la persistance des données
  • l’authentification
  • l’autorisation
  • la logique métier

💡 Astuce mémo

Requête → logique métier → base de données → réponse

📖 9. API et application To-Do

🔑 Notions clés & Définitions

• API : Ensemble de règles et de protocoles permettant à différents logiciels de communiquer en échangeant des requêtes et des réponses.

★ À maîtriser

• L’application To-Do utilise Node.js, Express.js et MariaDB pour fournir une API REST de gestion de tâches.

• Les opérations CRUD de l’API sont:

  • Create : POST /tasks
  • Read : GET /tasks
  • Update : PATCH /tasks/:id
  • Delete : DELETE /tasks/:id

Compléments

• 🔄 La création de l’API To-Do consiste à:
  1. initialiser le projet
  2. installer les dépendances
  3. créer la base et la table
  4. configurer Express et la connexion MariaDB
  5. lancer le serveur

💡 Astuce mémo

CRUD : Create, Read, Update, Delete

📖 10. Sécurité des applications web

🔑 Notions clés & Définitions

• Sécurité backend : Protège les applications contre les menaces en sécurisant les communications, les accès, les données et les points d’attaque.

★ À maîtriser

📌 L’authentification vérifie l’identité d’un utilisateur ou d’une application, tandis que l’autorisation détermine les ressources auxquelles cette identité peut accéder.

📌 La validation côté client améliore l’expérience utilisateur mais ne suffit pas à sécuriser une application, tandis que la validation côté serveur est indispensable pour filtrer les entrées avant traitement.

Compléments

• Les méthodes d’authentification citées sont:
  • les identifiants et mots de passe
  • OAuth avec des services tiers
  • les JSON Web Tokens (JWT)

💡 Astuce mémo

Authentification : qui es-tu ? Autorisation : que peux-tu faire ?

📖 11. Menaces et protection des données

★ À maîtriser

📌 Le chiffrement symétrique utilise une seule clé, tandis que le chiffrement asymétrique utilise une clé publique et une clé privée.

• Les algorithmes sécurisés cités sont:
  • bcrypt
  • Argon2
  • scrypt

📌 L’injection SQL manipule une base de données par du code injecté dans une entrée, tandis que le XSS injecte du JavaScript malveillant dans une page web.

Compléments

• Les requêtes paramétrées et les ORM protègent contre l’injection SQL, tandis que l’échappement du contenu sortant et la politique CSP protègent contre le XSS.

💡 Astuce mémo

Faille exploitée → données volées ou système compromis

📖 12. Ergonomie et enjeux sociaux

🔑 Notions clés & Définitions

• Ergonomie utilisateur : Vise à rendre les applications faciles, efficaces et agréables à utiliser, ce qui réduit les erreurs et améliore la satisfaction.

★ À maîtriser

• Les dérives d’Internet citées comprennent:
  • les fuites et reventes de données
  • la manipulation de l’information
  • les deepfakes
  • les cyberattaques automatisées
  • le contrôle social

Compléments

• Selon la formule attribuée à Benjamin Bayart, « l’ordinateur est fatal » parce qu’il exécute exactement ce qui lui est demandé sans tolérer les erreurs humaines.

• Le dark web utilise souvent des adresses en .onion, accessibles avec le réseau Tor et non avec les navigateurs classiques dans leur mode normal.

📊 Tableaux de synthèse

Technologies du développement web

Principales menaces web