Le geektionnaire : Le lexique du développeur

• HTML = HyperText Marquee Language
• CSS = Cascading Style Sheets
• HTTP = HyperText Transport Protocol
• s = secure

Dans les pages que l’on voit sur les sites Web :

• Le HTML constitue le fond
• Le CSS constitue la forme
• HTTP est un “tuyau” :
• Dans sa forme habituelle, ce tuyau est “transparent”, on peut voir ce qui transite
• Dans sa forme sécurisée (https), ce tuyau est opaque, on ne peut pas décrypter les informations qui transitent

• DNS = Domain Name System

Le DNS est l’annuaire d’internet : il permet de faire la correspondance entre un nom (de domaine) et l’emplacement du serveur qui est un nombre et que l’on appelle “Adresse IP”

Au début d’Internet, les serveurs n’avaient pas de noms et les utilisateurs contactaient directement les serveurs en utilisant leur adresse IP. Mais la popularité grandissante d’Internet a nécessité l’ajout du DNS pour utiliser des noms, plus simples à retenir, plutôt que des adresses IP

Un proxy est une application qui est placée entre un utilisateur et un serveur.

Voici quelques exemples d’utilisations de proxy :

• Conserver une copie des pages ou des images qui ont été téléchargées pour éviter de solliciter le serveur et la bande passante. Pour l’utilisateur ceci permet de voir des pages plus rapidement
• Bloquer l’accès à certaines pages, par exemple des sites de streaming ou des sites adultes

• PHP = PHP Hyper Text Preprocess

Le PHP est un langage de programmation qui est principalement utilisé pour construire des pages HTML dynamiques.

Il est souvent couplé avec MySQL, une base de données relationnelle libre et gratuite pour ajouter, par exemple, des données utilisateurs dans le contenu des pages.

PHP et MySQL sont très populaires en Europe.

• Open Source = Source Ouverte

Dans un programme dit Open Source, le code source de l’application est disponible.

L’accès au code source est généralement gratuit mais ce n’est pas systématiquement le cas.

On veillera donc à faire une distinction entre “Open Source” et “Free”

Cependant, le terme “Open Source” est souvent utilisé pour parler du mouvement “Open Source” pour lequel les programmes doivent avoir un code source disponible, gratuit et modifiable.

• CMS = Content Management System
• Framework = Cadriciel en Français (mais souvent les français préfèrent malgré tout utiliser “Framework”)

Un CMS est un outil, généralement Web, de gestion de contenu qui simplifie la publication de contenu pour des utilisateurs non techniques. Le plus connu et le plus utilisé est WordPress 5.

Un framework est un ensemble de composants logiciels conçus pour s’interfacer entre eux et qui sert de fondation pour la création d’une application. Les composants sont pensés pour capitaliser sur les meilleures pratiques de développement et évite de “réinventer la roue”. Au final, le temps de dévelopement est raccourci.

Quelques exemples de framework Web : Symfony, Code Igniter, Django

• OWASP = Open Web Application Security Project

L’OWASP est une communauté en ligne travaillant sur la sécurité des applications Web.

Elle recense en particulier les 10 failles de sécurité les plus importantes, on parle donc de “Top 10 OWASP”.

Le TOP 10 OWASP 2017 est disponible à l’adresse suivante

React est une librairie Javascript qui permet de créer des applications Web Mono Page (SPA = Single Page Application). Elle a été créée par Facebook et est connue pour sa performance. Elle est proche, dans ses concepts, de 2 autres libraires connues : Angular et VueJS

Node est un programme qui permet d’executer du Javascript en dehors du navigateur, il est principalement utilisé pour créer des serveur Web, il s’appuie sur la version V8 du moteur Javascript de Chrome dont les performances sont proches de langages compilés (Type C, C++, Pascal)

Un CMS Headless permet de gérer des contenus indépendamment de la plateforme sur lesquels ils sont affichés.

L’utilisation de CMS Headless permet de centraliser et rationnaliser la production, puis la diffusion de contenus. On pourra par exemple gérer tous les contenus et les diffuser sur :

• Son site Web
• Son application Mobile
• Sa page Facebook
• Sa page Twitter
• Les réseaux sociaux en général

Ces plateformes ayant des formes très différentes, on utilisera généralement des éditeurs de contenus focalisés sur la sémantique plutôt que sur l’aspect.

Exemple d’éditeur focalisé sur la sémantique : EditorJS : les contenus sont gérés par blocs dont chacun est typé (paragraphe, image, liste d’items, …)

A comparer avec un éditeur wysiwig focalisé sur la forme : CK Editor

La transmission des contenus est généralement faite via des formats standard type Json ou XML

Un script est une suite d’opérations lues et executées les unes après les autres.

On fait le distingo entre un script qui utilise généralement un langage interprété (PHP, Python, Javascript) et une application qui est, souvent, compilée et qui s’appuie sur un langage bas niveau (C, C++, Pascal).

Ceci décrit un mode de communication dans lequel un client émet une requête, par exemple : “je veux voir la page d’accueil du site www.castoretpollux.com et un serveur (le serveur Web de Castor & Pollux en l’occurence) répond en envoyant la page.

Ce mode de fonctionnement est celui utilisé dans le protocole HTTP :

• Le client est le navigateur
• Le serveur est le serveur Web
• La requête ressemble à GET / HTTP/1.0
• La réponse contient le html de la page (+ quelques informations “méta” additionnelles : taille de la page, date de dernière modification, type de contenu, etc…)

Les systèmes de cache constituent des éléments importants de l’optimisation des performances.

Le principe est simple : quand j’ai déjà obtenu une information, autant la garder en mémoire dans l’hypothèse où je pourrais en avoir besoin à nouveau.

Cette information peut être de nature diverse : contenu d’une page, résultat d’un calcul, contenu d’une image… La complexité survient quand le “cache expire” soit quand la donnée que l’on a conservé en mémoire est différente de sa dernière version.

Les navigateurs Web possèdent un cache pour éviter de faire des requêtes réseaux potentiellement inutiles mais ceci peut avoir comme inconvénient que la page vue n’est pas forcément la dernière version. “Vider le cache” permet de repartir de zéro et de s’assurer que lorsqu’on affiche une page, c’est bien la plus récente qui apparait.

Git est un système qui permet de gérer les différentes versions de fichiers de façon décentralisée.

C’est un outil particulièrement utile pour les équipes de développement puisqu’il permet à plusieurs développeurs de travailler **en même temps** sur les mêmes fichiers.

Les modifications peuvent être ”conflictuelles” quand 2 personnes ont modifié de façon divergente les mêmes lignes d’un fichier donné.

Git (comme d’autres système de gestion de version) permet de résoudre les “conflits” en montrant les 2 versions et en mettant à disposition des outils pour fusionner les modifications et/ou pour choisir la meilleure version.

• API : Application Programming Interface

Une API est une méthode explicitée permettant de s’interfacer avec une application.

Sont explicités :

• la méthode d’appel
• les arguments autorisés
• le type de la réponse

Un exemple concret sera plus parlant :

• Wikipedia propose une API dont on peut voir la doc à l’adresse suivante : https://fr.wikipedia.org/w/api.php
• Dans cette API, on peut trouver, entre autre, la méthode opensearch dont voici la doc dédiée
• Dans cette doc, on voit que pour appeler cette API, on peut passer un argument “search” et appeler l’url : https://fr.wikipedia.org/w/api.php?action=opensearch&search=<terme_a_chercher>

Exemples de recherches avec cette API :

• https://fr.wikipedia.org/w/api.php?action=opensearch&search=API
• https://fr.wikipedia.org/w/api.php?action=opensearch&search=DNS

Un certificat SSL est en fait composé de 2 fichiers : une clé publique et une clé privée.

Il répond à 2 objectifs :

• Crypter les communications
• Identifier le serveur en s’appuyant sur des tiers de confiance

Il sert pour le “grand public” à :

• Avoir l’icone “cadenas”
• Avoir un site en https

Pour obtenir un certificat, vous devez :

• Générer un fichier CSR (Certificate Signing Request) et la clé privée
• Envoyer le fichier CSR à un vendeur de certificat
• (Payer)
• Recevoir le certificat public ET le fichier intermédiaire
• Installer le certificat public, le certificat intermédiare et la clé privée sur le serveur

Sur un site Web, on trouve généralement 3 environnements :

• La partie publique, accessible sans identification préalable → le front
• Une partie “connectée” accessible aux “membres” → l’espace connecté
• Une partie “privée” permettant de gérer la configuration et les contenus du site, cette partie n’est généralement accessible qu’aux utilisateurs internes (pas au grand public, même si la personne est connectée) → le back

• XML : eXtensible Markup Language

Le XML est, comme le HTML, un langage s’appuyant sur des balises.

Mais là où le HTML définit une liste finie de balises utilisables, le XML autorise un nombre illimitée de balises custom.

On peut donc utiliser la syntaxe du xml pour représenter tout type de données, par exemple une personne :

<person>
    <name>Dupont</name>
    <firstname>Michel</firstname>
    <age>42</age>
    <gender>M</gender>
    <size_cm>180</size_cm>
</person>
        

• IP : Internet Protocol

Souvent quand on parle d’IP, on parle plutôt d’adresse IP, c’est-à-dire l’identifiant sur Internet de votre carte réseau (ou Wifi)

Il y a 2 types d’adresses IP :

• IP version 4 : un identifiant dont la valeur maximale est 4 294 967 296
• IP version 6 : créé pour pallier les manques d’adresses IPv4, l’identifiant maximal est : 340 282 366 920 938 463 463 374 607 431 768 211 456

Il y a suffisamment d’IPv6 pour que chaque personne et objet (cf “IoT” : Internet Of Things) ait son propre identifiant

Les adresses IP ne sont généralement pas notées sous forme d’identifiants mais sous forme de groupes séparés par des points :

• Ex IP v4 : 123.231.017.142
• Ex IP v6 : 2001:0db8:0000:85a3:0000:0000:ac1f:8001

• iframe = inline frame

Une iframe permet, dans une page HTML, d’inclure le contenu d’une autre page.

Cette autre page peut être hébergée sur un domaine différent.

Les cas d’usages sont nombreux :

• Affichage d’un jeu
• Affichage d’un outil
• Affichage de carte
• …

Point important de sécurité : la page contenue dans l’iframe n’a pas accès au contenu de la page “hôte”, elle n’a pas non plus “conscience” d’être affichée dans une iframe.

Un plugin est un composant logiciel additionnel et optionnel permettant d’étendre les fonctionnalités d’un logiciel donné. On trouve des plugins pour les logiciels suivants par exemple :

• Des navigateurs Web : Chrome et Firefox
• Des Outils de Gestion de Contenu (CMS) comme WordPress et Drupal

Une erreur 404 correspond à une ressource non disponible. Cette ressource peut être une page, une image, un fichier CSS ou Javascript ou tout autre ressource.

C’est un des codes d’erreur existant dans le protocole HTTP.

• Une erreur commençant par 4 est une erreur due au “client” (le navigateur), dans le cas d’une erreur 404, le serveur considère donc que le navigateur a demandé une ressource qui n’existe pas.
• Les erreurs commençant par 5 sont des erreurs côté serveur.

• Un cookie est une information transmise par un site Web et stockée pendant une durée limitée dans votre navigateur

Ce dépot peut se produire à chaque fois qu’un élément du site Web est téléchargé :

• Page
• Image
• CSS
• Script
• Document

Les attributs principaux d'un cookie :

• la clé
• la valeur
• le domaine
• l'expiration

Le cookie, un mécanisme simple mais puissant qui permet de :

• stocker dans votre navigateur des préférences, ex : TarteAuCitron
• maintenir une session
• suivre les navigations d'un utilisateur de site en site
• de faire du retargeting
• vous identifier (du moins, votre navigateur)

Cookie et RGPD

Les 3 derniers usages sont encadrés par le RGPD

Dans le jargon informatique, un crawl est une opération visant à télécharger l’ensemble des pages d’un ou plusieurs sites. On peut pratiquer un crawl dans les buts suivants (liste non exhaustive) :

• Copie locale d’un site pour consultation offline
• Analyse SEO des liens internes et externes
• Détection des erreurs
• Collecte de page par des bots de moteurs de recherche dans un but d’indexation

WYSIWYG = What You See Is What You Get

Cet acronyme a été popularisé par les premiers traitements de texte qui étaient capables d’afficher des pages identiques à la version imprimée. Dans le Web, on parle de WYSIWYG généralement pour les éditeurs de texte en Back Office dans lesquels il est possible de saisir des textes et de les mettre en forme avec un rendu similaire voire identique au rendu côté Front.

Ces éditeurs reprennent fréquemment les barres d’outils des traitements de texte.

cron est le diminutif de crontab, lui même une abbréviation de chrono table (de Chronos, le temps en grec).

Sur les systèmes Unix/Linux/BSD/Mac, la crontab liste les programmes à exécuter de façon périodique.

• SSO = Single Sign On

Un SSO est une fonctionnalité d’optimisation des systèmes d’informations qui permet à un utilisateur déjà authentifié dans un “annuaire central” de ne pas avoir à s’authentifier à chaque fois lorsqu’il se connecte sur des systèmes satellites.

On peut voir les boutons “Se connecter avec Google” ou “Se connecter avec Facebook” comme des SSO partiels = il n’est pas nécessaire de resaisir ses identifiants MAIS il faut quand même cliquer sur un ou plusieurs CTA

Dans un outil de gestion de version comme Git, SVN, Mercurial, CVS, un commit est une opération de validation des modifications locales réalisées par un développeur.

Pour mieux comprendre à quel moment un commit survient, prenons l’exemple d’un workflow git classique :

• “git pull” : le développeur récupére (pull = tirer) les dernières versions de code source d’un serveur central (le “repository” ou dépot en français)
• il modifie localement les fichiers qu’il souhaite
• “git add” : le développeur “marque” les fichiers modifiés qui vont faire partie du prochain lots de modifications à envoyer vers le repository
• “git commit” : le développeur valide les fichiers ajoutés par “git add”, la liste de modifications se verra attribué un numéro de lot aussi nommé “identifiant de commit”
• “git push” : le développeur envoie (push = pousse) ses différents commits vers le repository et les mets à disposition de l’équipe de développement qui peut les récupérer (via “git pull”)

Une pull request est une notification envoyée au mainteneur d’un projet informatique pour l’inviter à récupérer les modifications que l’on vient de faire et **éventuellement** les intégrer à la version officielle du projet

Dans une méthodologie classique de développement, le staging correspond aux différents environnements dans lequel exécute un programme donné. On trouve fréquemment 4 environnements :

• dev : environnement de développement, correspond à la configuration du poste de développement d’un développeur
• recette : environnement de test interne, permet aux chefs de projets d’une agence de tester les fonctionnalités d’un programme et détecter les bugs éventuels
• preprod : environnement de test externe, généralement proche en terme de configuration matérielle de l’environnement final (la production) → permet aux clients de tester les fonctionnalités d’un programme avant une mise en production
• production : environnement de production, en théorie, le programme est totalement fonctionnel et exempt de bugs, en pratique, il peut subsister des bugs qui nécessite de faire de nouvelles modifications en respectant l’ordre de staging

• JS = Javascript

Le Javascript est un langage de script introduit par Netscape pour dynamiser les pages Web et permettre la modification en temps réel de la structure des pages. Son nom initial était “LiveScript” ce qui était plus intelligible et correspondait plus à la réalité.

Mais le langage Java devenant plus populaire, il a été décidé de surfer sur la vague et de changer le nom en “Javascript” ce qui a introduit une certaine confusion entre les 2 langages. Confusion qui existe encore aujourd’hui alors que les 2 langages ont finalement peu de points communs au niveau de leur syntaxe ou même de leur conception.

A l’heure actuelle, le Javascript en est à sa 8ème version.

Google a créé une implémentation particulièrement rapide de ce langage ce qui a permis son utilisation en tant que langage côté serveur, soit assez loin de son objectif initial de dynamisation des pages internet.

Historiquement, un Web Service est un ensemble de méthode permettant d’executer et de retourner le résultat d’une fonction en s’appuyant sur les protocoles du Web.

Vous ne voyez pas le concept ? c’est normal, ça mobilise beaucoup de concepts

Prenons un exemple en imaginant que vous voulez calculer le résultat de l’opération 1+1 en utilisant un web service créé pour faire des calculs.

Vous aller alors faire les opérations suivantes :

• Préparer un fichier XML qui contient les termes (ou opérandes) de votre calcul
• Appeler l’url du web service “addition” et lui envoyer le fichier préparé
• Récupérer le résultat de l’appel, également sous forme XML
• Extraire le résultat dans la réponse XML

Ca a l’air compliqué pour par grand chose, non ?

Et oui, du calcul mental ou une calculatrice aurait été plus simple.

Mais l’intérêt des Web Service est ailleurs : les Web Services normalisent :

• La façon de transmettre des paramètres
• La façon d’appeler le Web Service
• La façon de transmettre les résultats

Autrement dit : si une société met à disposition un Web Service qui respecte les standards, une autre société pourra faire appel à ce Web Service.

Ceci permet la création d’architectures orientées services (SOA = Service Oriented Architecture) où on interroge plusieurs fournisseurs de Web Services.

Les Web Services s’appuient sur les 3 protocoles suivants :

• SOAP (Simple Object Access Protocol) : pour la transmission des arguments en XML
• WSDL (Web Service Description Language) : pour la description des services Web, les arguments et types d’arguments acceptés, les résultats et types de résultats acceptés
• UDDI (Universal Description Discovery and Integration) : pour fabriquer des annuaires de Web Services

Ces 3 protocoles sont rigides et assez verbeux (beaucoup d’informations transmises) et on voit depuis plusieurs années progresser une alternative : les API REST

Les principes fondamentaux sont les mêmes :

• Utilisation d’un standard pour encoder les paramètres ou les résultats (on utilise JSON de préférence à XML, car JSON est plus léger et beaucoup moins verbeux)
• Norme de facto pour l’appel des fonctions

Il manque cependant :

• la possibilité de récupérer de façon automatique les descriptions des fonctions ou les arguments, réponses et types (mais des outils comme “swagger” essayent de compenser ce manque)
• un annuaire centralisé d’API REST

La similarité fonctionnelle entre les Web Service historiques et les API REST font que l’on entend de plus en plus souvent parler de Web Service lorsqu’en fait on parle d’API REST. Ceci est un abus de langage mais peut se comprendre…

• SVN = Abbréviation de Subversion

Subversion est comme Git un outil de gestion de version.

Il en diffère car il s’appuie sur un serveur centralisé là où Git est par nature décentralisé.

Ce système de version est de moins en moins utilisé et Git devient le système de gestion de version principal dans les équipes de développement.

→ On pourra donc regarder les entrées “Git” et “Commit” de ce geektionnaire pour comprendre à quoi sert un système de version et comment il est utilisé.