recursal/MDN huggingface dataset:
Conteneur flexible
==================

Une mise en page flexbox est définie en utilisant les valeurs `flex` ou `inline-flex` de la propriété `display` sur l'élément parent. Cet élément devient alors un **conteneur flexible** et chacun de ses enfants un élément flexible.

Une valeur `flex` fait que l'élément devient un conteneur flexible de niveau bloc et `inline-flex`, un conteneur flexible de niveau en ligne. Ces valeurs créent un **contexte de mise en forme flexible** pour l'élément, qui est similaire à un contexte de mise en forme de bloc dans la mesure où les flottants ne s'introduiront pas dans le conteneur et les marges du conteneur ne s'effondreront pas avec celles des articles.

Voir aussi
----------

### Références de la propriété

* `align-content`
* `align-items`
* `flex`
* `flex-direction`
* `flex-flow`
* `flex-wrap`
* `justify-content`
### En lire plus

* Guide Flexbox CSS : *Les concepts de base pour flexbox*
* Guide Flexbox CSS : *Aligner des éléments dans un conteneur flexible*
* Guide Flexbox CSS : *Maîtriser le passage à la ligne des éléments flexibles*
Condition
=========

Une **condition** est un ensemble de règles qui peut interrompre ou modifier l'exécution normale du code, selon que la condition est remplie ou non.

Une instruction, ou un ensemble d'instructions, est démarrée si une condition spécifique est remplie. Dans le cas contraire, d'autres instructions sont exécutées. Il est également possible de répéter l'exécution d'une instruction, ou ensemble d'instructions, tant qu'une condition n'est pas encore remplie.

Pour approfondir
----------------

### Culture générale

* Structure de contrôle sur Wikipédia
### Référence technique

* Contrôle de flux sur MDN
### Apprendre

* Contrôle du flux d'instructions et gestion des erreurs en JavaScript sur MDN
Cercle chromatique
==================

Un **cercle chromatique** (*color wheel* en anglais), est un graphique représentant une palette de couleurs dans un cercle. Un cercle chromatique peut afficher des couleurs identifiées par deux coordonnées polaires, l'*angle* et la *distance* depuis l'origine, le centre du cercle.

Les cercles chromatiques sont pratiques pour comparer les couleurs exprimées en coordonnées polaires ou cylindriques, comme `hsl()`, `hwb()`, ou `lch()`.

Dans de tels cas, les *couleurs complémentaires* sont diamétralement opposées sur le cercle. De même, les *couleurs monochromatiques* – des couleurs du même *ton* mais de *nuances* différentes – sont situées sur le même rayon, et les *couleurs triadiques* – trois couleurs régulièrement espacées autour de la roue chromatique qui conduisent à des couleurs qui fonctionnent bien ensemble – sont également faciles à trouver.

Les roues chromatiques sont utilisées dans la vraie vie lorsque nous voulons choisir entre différentes teintes. Par exemple, lors du choix de la peinture murale ou de la couleur d'un meuble.

 Dans le monde numérique, les cercles chromatiques sont utilisées dans les *sélecteurs de couleurs*, comme celui disponible par défaut sur macOS :
 ![Le sélecteur de couleur par défaut pour macOS Monterey](/fr/docs/Glossary/Color_wheel/color_wheel_macos.png)

Voir aussi
----------

* Guide du cercle chromatique d'Adobe
* Comment utiliser le cercle chromatique
* Cercle chromatique sur Wikipédia
* `<color>`, le type de données pour les couleurs en CSS
UDP
===

**UDP** (User Datagram Protocol) est un protocole de longue date utilisé avec IP pour envoyer des données lorsque la vitesse de transmission et l'efficacité importent davantage que la sécurité et la fiabilitié.

Pour en savoir plus
-------------------

### Culture générale

* UDP sur Wikipédia
### Référence technique

* Spécification
Privilégié
==========

Un utilisateur est dit **privilégié** lorsqu'il se voit attribuer des droits supplémentaires sur un système, ou se voit donner des accès à des données avec un niveau de priorité supérieur à celui des utilisateurs normaux.

Pour en savoir plus
-------------------

### Culture générale

* Privilège sur Wikipédia
### Apprendre sur ce sujet

* Tutoriel sur la sécurité informatique
En-tête de requête sûr pour le CORS
===================================

Un en-tête de requêtes sûr pour le CORS (*CORS-safelisted request header*) est l'un des en-têtes HTTP suivants :

* `Accept`
* `Accept-Language`
* `Content-Language`
* `Content-Type`
* `Range` (en-US)

Lorsqu'une requête ne contient que ces en-têtes (et répond aux critères indiqués après), il n'y a pas besoin d'une requête préalable (*preflight request*) dans le contexte du CORS.

Il est possible d'indiquer d'autres en-têtes comme sûrs à l'aide de l'en-tête `Access-Control-Allow-Headers` (en-US). `Access-Control-Allow-Headers` permet également de lister les en-têtes précédents pour contourner les restrictions supplémentaires décrites ensuite.

Restrictions supplémentaires
----------------------------

Les en-têtes sûr pour le CORS doivent également respecter ces critères :

* Les valeurs pour `Accept-Language` et `Content-Language` ne peuvent contenir que les caractères `0-9`, `A-Z`, `a-z`, espace ou `*,-.;=`.
* `Accept` et `Content-Type` ne peuvent pas contenir un octet d'en-tête non-sûr : `0x00-0x1F` (exception faite de `0x09 (HT)` qui est autorisé), `"():<>?@[\]{}`, et `0x7F (DEL)`.
* `Content-Type` doit être un type MIME qui (lorsqu'on ignore les paramètres) vaut `application/x-www-form-urlencoded`, ou `multipart/form-data`, ou `text/plain`.
* La valeur de `Range` (en-US) doit être un seul intervalle d'octets sous la forme `bytes=[0-9]+-[0-9]*`. Voir la documentation de `Range` (en-US) pour plus de détails.
* Pour n'importe quel en-tête, la longueur de la valeur ne peut excéder 128.
Voir aussi
----------

* En-tête de réponse sûr pour le CORS
* Nom d'en-tête interdit
* En-tête de requête
Polyfill
========

Un polyfill est un bout de code (généralement en JavaScript sur le web) utilisé pour fournir des fonctionnalités récentes sur d'anciens navigateurs qui ne les supportent pas nativement.

Par exemple, un polyfill pourrait être utilisé pour imiter la fonctionnalité d'un élément HTML Canvas sur Microsoft Internet Explorer 7 avec un plugin Silverlight, ou imiter le support des unités de mesure en rem ou ce que vous voulez.

Voir aussi
----------

### Connaissance général

* Qu'est ce qu'un polyfill? (article par Remy Sharp, créateur du terme)
CORS
====

CORS (Partage de ressource cross-origin) est un mécanisme qui consiste à transmettre des entêtes HTTP qui déterminent s'il faut ou non bloquer les requêtes à des ressources restreintes sur une page web qui se trouve sur un domaine externe au domaine dont la ressource est originaire.

 La politique de sécurité de même origine interdit les requêtes d'origines différentes par défaut et ce pour des raisons de sécurité.
 CORS permet de contourner cette limitation en permettant au serveur d'avoir le contrôle sur les ressources partagés et offre un mécanisme sécurisé pour permettre l'échange de données qui ne partagent pas le même domaine d'origine (d'où le terme "*cross-origin*").

Voir aussi
----------

### Culture générale

* Contrôle d'accès HTTP (CORS) sur MDN
* Cross-origin resource sharing sur Wikipédia (anglais)
### En-têtes liés au CORS

`Access-Control-Allow-Origin`

Indique le ou les domaines pour lesquels la ressource peut être partagée.

`Access-Control-Allow-Credentials` (en-US)

Indique si la réponse peut ou non être exposée si le flag est à "*true*".

`Access-Control-Allow-Headers` (en-US)

Utilisé en réponse à une requête de pré-vérification pour indiquer quels sont les en-têtes qui peuvent être utilisés dans la requête courante.

`Access-Control-Allow-Methods`

Utilisé en réponse à une requête de pré-vérification pour indiquer quels sont les méthodes allouées pour accéder à une ressource.

`Access-Control-Expose-Headers` (en-US)

Indique quels en-têtes peuvent être exposés dans le cadre de la réponse en énumérant leurs noms.

`Access-Control-Max-Age` (en-US)

Indique combien de temps le résultat d'une pré-vérification peut être gardé en cache par le demandeur de la pré-vérification.

`Access-Control-Request-Headers`

Utilisé lors de l'émission d'une demande de contrôle en amont, pour indiquer au serveur quels en-têtes HTTP seront utilisés lors de la demande.

`Access-Control-Request-Method` (en-US)

Utilisé lors de l'émission d'une demande de contrôle en amont permettant au serveur de savoir quelle méthode HTTP sera utilisée lors de la création de la requête.

`Origin`

Indique quelle est l'origine d'une récupération.

### Référence technique

* Spécification fetch
HTTP/3
======

**HTTP/3** est la prochaine révision majeure du protocole réseau HTTP, succédant à HTTP/2. Le point majeur de HTTP/3 est qu'il utilise un nouveau protocole UDP nommé QUIC, au lieu de TCP.

Voir aussi
----------

* HTTP sur MDN
* HTTP/3 sur Wikipédia
* HTTP
* HTTP 2
* Latency
CalDAV
======

CalDAV (extensions de gestion de calendrier pour WebDAV) est un protocole normalisé par l'IETF utilisé pour accéder à distance à des données d'agendas stockées sur un serveur.

Pour en savoir plus
-------------------

### Culture générale

* CalDAV sur Wikipédia
### Référence technique

* RFC 4791: Calendaring extensions to WebDAV (CalDAV)
* RFC 6638: Scheduling Extensions to CalDAV
Structure de données
====================

Une **structure de données** est une façon particulière d'organiser des *données* afin de pouvoir les utiliser efficacement.

Voir aussi
----------

* Structure de données sur Wikipédia
Usenet
======

Usenet est un système de discussion sur internet où chaque message est dupliqué sur plusieurs serveurs. Équivalent aux forums Internet actuels, Usenet fonctionnait comme un bulletin board system.

Voir aussi
----------

### Culture générale

* Usenet sur Wikipédia
Opération composite
===================

En CSS, la valeur d'une propriété dans une règle CSS est la *valeur sous-jacente* de cette propriété, pour cette même propriété, la valeur dans une étape d'animation (*keyframe*) est sa *valeur effective*.

L'*opération composite* est l'opération qui permet de combiner la valeur effective et la valeur sous-jacente pour produire la valeur effective finale pour l'étape d'animation. Il existe trois types d'opérations composites :

Remplacement

La valeur effective remplace la valeur sous-jacente. La valeur effective finale correspond à la valeur effective originelle.

Ajout

La valeur effective est ajoutée à la valeur sous-jacente.

Accumulation

La valeur effective est combinée à la valeur sous-jacente.


**Note :** En CSS, l'opération composite s'applique uniquement aux opérations.

Voir aussi
----------

* `animation-composition`
* `KeyframeEffect.composite` (en-US)
SVN
===

**SVN** (pour Apache Subversion) est un logiciel libre de gestion du contrôle de système (SCM). Il permet aux développeurs de conserver un historique des modifications de texte et de code. Bien que SVN puisse également gérer les fichiers binaires, nous ne vous recommandons pas de l'utiliser pour de tels fichiers.

Voir aussi
----------

### Culture générale

* Site officiel
* Apache Subversion sur Wikipédia
### Apprendre sur ce sujet

* Guide SVN pour localiseurs sur MDN
HSTS
====

**HTTP Strict Transport Security** permet à un site web d'informer le navigateur que son accès ne devrait pas se faire en HTTP et qu'il devrait donc convertir toute tentative de connexion en HTTP en connexion HTTPS. HSTS est un en-tête HTTP, `Strict-Transport-Security` (en-US), il est donc envoyé par le serveur au début de la réponse à une requête d'un client.

En d'autres termes, cela informe le navigateur que basculer d'HTTP à HTTPS dans l'url fonctionnera (et sera plus sécurisé) et lui demande de le faire systématiquement.

Voir aussi
----------

* `Strict-Transport-Security` (en-US)
* Article OWASP : HTTP Strict Transport Security
* *HTTP Strict Transport Security* sur Wikipédia
TLD
===

Un domaine de premier niveau ou TLD (*top-level domain*) est le domaine le plus générique de toute la hiérarchie DNS (système de noms de domaine) d'Internet. Un TLD est la composante finale d'un nom de domaine, par exemple, le "org" dans `developer.mozilla.org`.

L'ICANN (Internet Corporation for Assigned Names and Numbers) désigne des organisations pour gérer chaque TLD. En fonction des contraintes que peuvent imposer ces organisations d'administration, le TLD apporte souvent une indication sur le but, le propriétaire ou la nationalité d'un site web.

 Considérons par exemple l'adresse Internet : `https://developer.mozilla.org`
 Ici, org est le TLD ; mozilla.org est le nom de domaine de deuxième niveau ; et developer est un nom de sous-domaine. Ensemble, ces éléments constituent un nom de domaine pleinement qualifié ; l'ajout de https:// permet d'obtenir une URL complète.

De nos jours, IANA divise les domaines de premier niveau en plusieurs groupes :

country-code top-level domains (ccTLD)

Domaines sur deux caractères attribués aux pays et territoires. Exemple : *.us* pour les États-Unis.

internationalized country code top-level domains (IDN ccTLD)

ccTLDs qui utilisent des jeux de caractères non-latin (e.g., arabe ou chinois).

generic top-level domains (gTLD)

Domaines de premier niveau sur trois caractères ou plus.

unsponsored top-level domains

Domaines qui agissent pour la communauté globale d'Internet directement sous des stratégies établies les processus de l'ICANN, par exemple "com" et "edu".

sponsored top-level domains (sTLD)

Ces domaines sont proposés et sponsorisés par des organisations privées qui décident si un candidat est autorisé ou non à utiliser le TLD, compte-tenu des thématiques de la communauté concernée.

infrastructure top-level domain

Ce groupe consiste en un seul domaine, l'ARPA (Address and Routing Parameter Area).

Voir aussi
----------

### Culture générale

* Domaine de premier niveau sur Wikipédia
* Liste de domaines de premier niveau
Instruction
===========

Dans un langage de programmation informatique, une **instruction** est une ligne de code dictant une tâche. Tout programme consiste en une séquence d'instructions.

Pour en savoir plus
-------------------

### Culture générale

* Instruction informatique sur Wikipédia
### Référence technique

* Instructions et déclarations JavaScript
Propriété
=========

Le terme **propriété** peut avoir plusieurs significations selon le contexte. Il peut s'agir de :

Propriété (CSS)
Une **propriété CSS** est une caractéristique (telle que `color`) dont la valeur associée définit un aspect de la manière dont le navigateur doit afficher l'élément.
Propriété (JavaScript)
Une propriété est une caractéristique d'un objet qui décrit souvent des attributs associés à une structure de données. Il existe deux sortes de propriétés : les *Propriétés d'Instance* qui contiennent des données spécifiques à une instance d'objet donnée, et les *Propriétés Statiques* qui contiennent les données partagées par toutes les instances d'objet.
Chaîne de caractères
====================

Dans les langages de programmation, le terme chaîne de caractères *(String*) est utilisé pour représenter du texte.

En JavaScript, une chaîne de caractères est l'une des valeurs primitives et l'objet `String` est un wrapper enveloppant une primitive String.

Voir aussi
----------

### Culture générale

* Chaîne de caractères sur Wikipédia
* Structures et types de données en JavaScript
Fonction
========

Une **fonction** est une portion de code qui peut être appelée par d'autres codes ou par elle-même ou par une variable qui se réfère à la fonction. Lorsqu'une fonction est appelée, des arguments lui sont généralement donnés en entrée. La fonction peut également retourner une valeur de sortie. En JavaScript, une fonction est aussi un objet.

Un nom de fonction est un identifiant déclaré dans le cadre d'une déclaration de fonction ou d'une expression de fonction. Le fait que le nom de fonction soit déclaré ou exprimé impacte la portée du nom de fonction.

### Différents types de fonctions

Une **fonction anonyme** est une fonction sans nom de fonction. Seules les expressions de fonction peuvent être anonymes. Les déclarations de fonctions doivent avoir un nom :


```js
// Fonction anonyme créée comme expression de fonction
(function () {});

// Fonction anonyme créée comme fonction fléchée
() => {};
```


Les termes qui suivent ne sont pas utilisés dans la spécification du langage ECMAScript, il s'agit d'un jargon souvent utilisé pour faire référence aux différents types de fonction.

Une **fonction nommée** est une fonction avec un nom de fonction :


```js
// Déclaration de fonction
function toto() {}

// Expression de fonction nommée
(function truc() {});

// Fonction fléchée nommée
const machin = () => {};
```


Une **fonction imbriquée (ou fonction interne)** est une fonction à l'intérieur d'une autre fonction (`carre` dans l'exemple suivant). Une **fonction englobante** est une fonction qui contient une fonction (`ajouteCarres` dans l'exemple suivant) :


```js
function ajouteCarres(a, b) {
  function carre(x) {
    return x \* x;
  }
  return carre(a) + carre(b);
}

// Fonction fléchée
const ajouteCarres2 = (a, b) => {
  const carre = (x) => x \* x;
  return carre(a) + carre(b);
};
```


Une **fonction récursive** est une fonction qui fait appel à elle-même. Voir la page du glossaire sur la récursion.


```js
function boucle(x) {
  if (x >= 10) return;
  boucle(x + 1);
}

// Fonction fléchée
const boucle2 = (x) => {
  if (x >= 10) return;
  boucle2(x + 1);
};
```


Une **expression de fonction invoquée immédiatement** (IIFE pour *Immediately Invoked Function Expressions* en anglais) est une fonction appelée directement après le chargement de la fonction dans le compilateur du navigateur. Pour identifier une IIFE, on cherchera les parenthèses gauche et droite supplémentaires à la fin de la déclaration de la fonction.

Les expressions de fonction, nommées ou anonymes, peuvent être appelées immédiatement.


```js
(function toto() {
  console.log("Coucou Toto");
})();

(function toutou() {
  console.log("Coucou Toutou");
})();

(() => console.log("Bonjour le monde"))();
```


Les fonctions créées avec des déclarations ne peuvent pas être appelées immédiatement ainsi. Les IIFE doivent être des *expressions* de fonction.


```js
function toto() {
  console.log("Coucou toto");
}();
```


Voir la page du glossaire sur les IIFE pour en savoir plus.

Voir aussi
----------

* Les fonctions JavaScript
* Les fonctions fléchées JavaScript
MVC
===

**MVC** (Model-View-Controller ou *Modèle-Vue-Contrôleur*) est un modèle dans la conception de logiciels. Il met l'accent sur la séparation entre la logique métier et l'affichage du logiciel. Cette «séparation des préoccupations» permet une meilleure répartition du travail et une maintenance améliorée. Certains autres modèles de conception sont basés sur MVC, tels que MVVM (Model-View-Viewmodel), MTP (Model-View-Presenter) et MVW (Model-View-Whatever).

Les 3 parties du modèle de conception de logiciel MVC peuvent être décrites comme suit :

1. Model (*modèle*) : gère les données et la logique métier.
2. View (*vue*) : gère la disposition et l'affichage.
3. Controller (*contrôleur*) : achemine les commandes des parties "model" et "view".
Voir aussi
----------

### Culture générale

* Modèle-vue-contrôleur sur Wikipédia
### Apprentissage de MVC

* MVC architecture
UX
==

**UX** est un acronyme signifiant User eXperience (expérience utilisateur). Il s'agit de l'étude de l'interaction entre des utilisateurs et un système. Son objectif est de rendre l'interaction avec un système plus simple du point de vue de l'utilisateur.

Le système peut être n'importe quel type de produit ou d'application avec lequel un utilisateur final est censé intéragir. Les études UX entreprises sur une page web par exemple peuvent servir à démontrer s'il est simple pour les utilisateurs de comprendre la page, naviguer dans différentes zones, réaliser des tâches simples et ainsi détecter où ce genre de processus pourrait être moins problématique.

Approfondir
-----------

### Culture générale

* Expérience utilisateur sur Wikipédia
Ligne de base
=============

La **ligne de base** (*baseline* en anglais) est une expression utilisée en typographie européenne et ouest-asiatique pour désigner une ligne imaginaire sur laquelle les caractères d'une police reposent.

Les jambages des caractères tels que *g* et *p* s'étendent en dessous de cette ligne. Les glyphes avec des extensions supérieure et inférieure arrondies — comme le C ou le 3 — s'étendent légèrement en dessous de la ligne de base.

Les écritures est-asiatique n'ont pas de ligne de base. Leurs glyphes sont placés dans une boite carrée sans jambage inférieur ou supérieur.

Voir aussi
----------

### Culture générale

* Ligne de base sur Wikipédia
### Référence technique

* Alignement des boites en CSS sur MDN
La division du code
===================

La **division du code** (« *code splitting* » en Anglais) est le fractionnement du code en divers bundles ou composants qui peuvent ensuite être chargés à la demande ou en parallèle.

Au fur et à mesure qu'une application devient de plus en plus complexe ou est maintenue, la taille en octets des fichiers ou bundles CSS et JavaScripts augmente, en particulier à mesure que le nombre et la taille des bibliothèques tierces incluses augmentent. Pour éviter d'avoir à télécharger des fichiers gigantesques, les scripts peuvent être divisés en plusieurs fichiers plus petits. Ensuite, les fonctionnalités requises au chargement de la page peuvent être téléchargées immédiatement avec des scripts supplémentaires chargés passivement une fois que la page ou l'application soit interactive, améliorant ainsi les performances. Bien que la quantité totale de code soit la même (et peut-être même quelques octets plus grands), la quantité de code nécessaire lors du chargement initial peut être réduite.

Le code splitting est une fonctionnalité prise en charge par les contructeurs (bundlers) comme Webpack et Browserify qui peut créer plusieurs bundles pouvant être chargés dynamiquement au moment de l'exécution.

Voir aussi
----------

* Regroupement
* Lazy loading
* HTTP/2
* Tree shaking
Opérande
========

Un **opérande** est la partie d'une instruction qui représente la donnée manipulée par l'opérateur. Par exemple, lors de l'ajout de deux nombres, les nombres sont les opérandes et "+" est l'opérateur.

Pour en savoir plus
-------------------

* Opérande sur Wikipédia
PDF
===

**PDF** (*Portable Document Format*) est un format de fichiers utilisé pour partager des documents sans dépendre d'un logiciel particulier, d'une plateforme ou d'un système d'exploitation. Le format PDF fournit une image numérique d'un document, qui conserve la même apparence une fois imprimé.

Pour en savoir plus
-------------------

### Connaissances générales

* PDF sur Wikipédia