mirror of https://github.com/sveltejs/svelte
fr: basic glossary (#5)
* fr: basic glossary * Update documentation/docs/07-glossary/01-development.md Co-authored-by: Maxime Dupont <m.dupont103@gmail.com> * fr: glossary fixes * fr: précision sur la doc officielle * fix: indentation in scripts * fr: add empty glossary sections * fix: falsy link * fr: add API cliffhanger * fr: add explication on glossary links * fr: add glossary links in introduction --------- Co-authored-by: Romain Crestey <romain.crestey@radiofrance.com> Co-authored-by: Maxime Dupont <m.dupont103@gmail.com>pull/9156/head
Romain l'Ourson
3 years ago
committed by
Romain Crestey
parent
6d27c31e13
commit
0de4932f6d
@ -0,0 +1,135 @@
|
||||
---
|
||||
title: 'Développement'
|
||||
---
|
||||
|
||||
Voici quelques informations sur les angliscismes usuels utilisés dans un contexte de développement informatique.
|
||||
|
||||
Ces mots n'ont pas de réelle traduction en français, ou alors celle-ci n'est que très rarement utilisée. Nous préférons donc laisser leur version anglaise dans la documentation pour rester au plus près de l'usage courant.
|
||||
|
||||
> Cette section de glossaire est spécifique à la documentation française de Svelte, et n'existe pas dans la documentation officielle.
|
||||
|
||||
## API
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Callback
|
||||
|
||||
Un _callback_ (ou fonction de rappel) est une fonction qui sera appelée lorsqu'un certain travail est terminé.
|
||||
|
||||
C'est en général une fonction passée en argument à une autre fonction pour que cette dernière s'en serve lorsque nécessaire.
|
||||
|
||||
Par exemple on peut utiliser un _callback_ pour afficher un message lorsqu'un téléchargement est terminé.
|
||||
```ts
|
||||
function afficheCoucou() {
|
||||
console.log('Coucou');
|
||||
}
|
||||
|
||||
function chargeLaDonnée(callback: () => void) {
|
||||
// je charge la donnée, peu importe comment, puis...
|
||||
callback();
|
||||
}
|
||||
|
||||
// ici, afficheCoucou est utilisée en tant que callback
|
||||
chargeLaDonnée(afficheCoucou);
|
||||
```
|
||||
|
||||
## Getter / Setter
|
||||
|
||||
Un _getter_ est une fonction qui permet de lire une valeur.
|
||||
Un _setter_ est une fonction qui permet d'écrire une valeur.
|
||||
|
||||
Ils vont souvent de pair, mais peuvent exister indépendamment de l'autre.
|
||||
Ils sont en général utilisés pour éviter d'exposer les propriétés internes d'un objet et permet à l'objet de faire des vérifications ou des supplémentaires sur les valeurs.
|
||||
|
||||
Un _setter_ pourrait être utilisé pour la propriété `nom` pour forcer la mise en majuscule
|
||||
```ts
|
||||
class Personne {
|
||||
#nom = 'Marie';
|
||||
|
||||
// setter
|
||||
set nom(n: string) {
|
||||
this.#nom = n.toUpperCase()
|
||||
}
|
||||
|
||||
// getter
|
||||
get nom() {
|
||||
return this.nom
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Vous trouverez plus de détails sur les [getters](https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Functions/get) et [setters](https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Functions/set) en JavaScript dans la documentation de MDN.
|
||||
|
||||
## IDE
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Issue
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Namespace
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Parser
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Payload
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Plugin
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Pull Request
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Race conditions
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Runtime
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Scope
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Template
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Tooltip
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Wrapper
|
||||
|
||||
Un _wrapper_ est une fonction qui "enveloppe" une autre fonction afin de lui apporter des fonctionnalités supplémentaires.
|
||||
|
||||
On peut également le voir comme une fonction qui crée et renvoie une fonction qui se sert de la fonction d'origine.
|
||||
|
||||
Un _wrapper_ pourrait être utilisé pour aggrémenter un message d'accueil :
|
||||
```ts
|
||||
// Fonction d'origine
|
||||
const bonjour = function (name: string): string {
|
||||
return `Bonjour ${name}!`
|
||||
}
|
||||
bonjour("Jean") // "Bonjour Jean!"
|
||||
|
||||
// Wrapper de la fonction
|
||||
function bonjourWrapper(original: (name: string) => string): (name: string) => string {
|
||||
return function (name: string) {
|
||||
return original(name) + " Comment vas-tu ?"
|
||||
}
|
||||
}
|
||||
const nouveauBonjour = bonjourWrapper(bonjour)
|
||||
nouveauBonjour("Jean") // "Bonjour Jean! Comment vas-tu?"
|
||||
```
|
||||
|
||||
> Par extension, un _wrapper_ désigne également un composant qui "enveloppe" une autre composant afin de lui apporter des fonctionnalités supplémentaires (style, comportement, etc.).
|
||||
@ -0,0 +1,61 @@
|
||||
---
|
||||
title: 'Web'
|
||||
---
|
||||
|
||||
Voici quelques informations sur les angliscismes usuels utilisés dans le contexte web.
|
||||
|
||||
Ces mots n'ont pas de réelle traduction en français, ou alors celle-ci n'est que très rarement utilisée. Nous préférons donc laisser leur version anglaise dans la documentation pour rester au plus près de l'usage courant.
|
||||
|
||||
> Cette section de glossaire est spécifique à la documentation française de Svelte, et n'existe pas dans la documentation officielle.
|
||||
|
||||
## Bundler / Packager
|
||||
|
||||
Un _bundler_ (ou _packager_) est un outil de développement qui permet à une application web répartie sur plusieurs fichiers sources d'être ramenée à un nombre réduit de fichiers (voir en un unique fichier).
|
||||
|
||||
L'étape de _bundling_ est donc une sorte de compilation spécifique au contexte du web. C'est souvent lors de cette étape que l'on transforme notre code source pour l'optimiser pour le navigateur.
|
||||
|
||||
Les transformations classiques effectuées lors d'un _bundling_ sont :
|
||||
- Typescript => Javascript
|
||||
- JSX => Javascript
|
||||
- Svelte => Javascript, HTML et CSS
|
||||
- Minification
|
||||
- ES20XX => ES6
|
||||
- Réorganisation des dossiers et fichiers
|
||||
|
||||
> Vite et Rollup sont des exemples de _bundler_.
|
||||
|
||||
## DOM
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Framework
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Lazy loading
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Markup
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Routing
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Sourcemaps
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Server-side rendering
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Web component
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## XSS
|
||||
|
||||
> Bientôt...
|
||||
@ -0,0 +1,110 @@
|
||||
---
|
||||
title: 'JavaScript'
|
||||
---
|
||||
|
||||
Voici quelques informations sur les angliscismes usuels utilisés dans le contexte de JavaScript.
|
||||
|
||||
Ces mots n'ont pas de réelle traduction en français, ou alors celle-ci n'est que très rarement utilisée. Nous préférons donc laisser leur version anglaise dans la documentation pour rester au plus près de l'usage courant.
|
||||
|
||||
> Cette section de glossaire est spécifique à la documentation française de Svelte, et n'existe pas dans la documentation officielle.
|
||||
|
||||
## Bubble / Capture
|
||||
|
||||
### Bubble
|
||||
|
||||
> Bientôt...
|
||||
|
||||
### Capture
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Event listener
|
||||
|
||||
Un _event listener_ est une fonction conçue pour être exécutée lorsqu'un événement est déclenché.
|
||||
|
||||
Par exemple, on peut utiliser un _event listener_ pour **changer la couleur d'un bouton** (fonction) lorsqu'on **clique** dessus.
|
||||
|
||||
```html
|
||||
<!-- HTML -->
|
||||
<button onclick="() => console.log('Click !')">
|
||||
Clic
|
||||
</button>
|
||||
```
|
||||
|
||||
```ts
|
||||
// JavaScript
|
||||
const element = document.createElement('button');
|
||||
|
||||
element.onclick = () => console.log('Click !')
|
||||
// ou
|
||||
element.addEventListener('click', () => console.log('Click !'))
|
||||
```
|
||||
|
||||
```svelte
|
||||
<!-- Svelte -->
|
||||
<button on:click={() => console.log('Click !')}>
|
||||
Clic
|
||||
</button>
|
||||
```
|
||||
|
||||
Plus d'infos sur les _event listeners_ sur [le site de MDN](https://developer.mozilla.org/fr/docs/Web/API/EventTarget/addEventListener).
|
||||
|
||||
## Event dispatcher
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Falsy / Truthy
|
||||
|
||||
### Falsy
|
||||
|
||||
Une valeur est dite _falsy_ si celle-ci peut être interprétée comme équivalente (et non pas égale) à `false`.
|
||||
|
||||
Les valeurs _falsy_ sont:
|
||||
- `false`
|
||||
- `0`
|
||||
- `-0`
|
||||
- `0n` (`0` en BigInt)
|
||||
- `""` (chaîne de caractère vide)
|
||||
- `null`
|
||||
- `undefined`
|
||||
- `NaN`
|
||||
- `document.all`
|
||||
|
||||
Si une valeur est _falsy_, alors sa double négation renvoie la valeur `false`.
|
||||
|
||||
```ts
|
||||
!!0 // false
|
||||
!!null // false
|
||||
!!undefined // false
|
||||
// ...
|
||||
```
|
||||
|
||||
Plus d'infos sur les valeurs _falsy_ sur [le site de MDN](https://developer.mozilla.org/en-US/docs/Glossary/Falsy) (en anglais).
|
||||
|
||||
### Truthy
|
||||
|
||||
Une valeur est dite _truthy_ si celle-ci n'est pas <span class="vo">[falsy](/docs/javascript#falsy-truthy-falsy)</span>. Toutes les valeurs qui ne sont pas celles listées juste au-dessus sont donc _truthy_.
|
||||
|
||||
Si une valeur est _truthy_, alors sa double négation renvoie la valeur `true`.
|
||||
|
||||
```ts
|
||||
!!1 // true
|
||||
!!{} // true
|
||||
!!'dsds' // true
|
||||
// ...
|
||||
```
|
||||
|
||||
Plus d'infos sur les valeurs _truthy_ sur [le site de MDN](https://developer.mozilla.org/fr/docs/Glossary/Truthy).
|
||||
|
||||
## Inline
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Nullish
|
||||
|
||||
Une valeur _nullish_ est une valeur qui est `null` ou `undefined`.
|
||||
|
||||
`null` et `undefined` sont deux valeurs qui représentent toutes les deux l'absence de valeur. Ce sont des valeurs différentes (`null !== undefined`), mais équivalentes (`null == undefined`). Pour pouvoir faire référence aux deux, on utilise le terme _nullish_.
|
||||
|
||||
Pour en savoir plus sur la différence entre `null` et `undefined`, vous pouvez par exemple lire [ceci](https://stackoverflow.com/questions/5076944/what-is-the-difference-between-null-and-undefined-in-javascript) (en anglais).
|
||||
|
||||
@ -0,0 +1,36 @@
|
||||
---
|
||||
title: 'Svelte'
|
||||
---
|
||||
|
||||
Voici quelques informations sur les angliscismes classiques utilisés dans le contexte de Svelte.
|
||||
|
||||
Ces mots n'ont pas de réelle traduction en français, ou alors celle-ci n'est que très rarement utilisée. Nous préférons donc laisser leur version anglaise dans la documentation pour rester au plus près de l'usage courant.
|
||||
|
||||
> Cette section de glossaire est spécifique à la documentation française de Svelte, et n'existe pas dans la documentation officielle.
|
||||
|
||||
## Binding
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Hooks
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Props
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Slot
|
||||
|
||||
> Bientôt...
|
||||
|
||||
## Store
|
||||
|
||||
> Bientôt...
|
||||
|
||||
Un _store_ est un concept au sein de Svelte qui permet de stocker une valeur, et de notifier n'importe quel module au sein de l'application de ses changements de valeur.
|
||||
|
||||
Plus d'infos sur [les stores Svelte dans la documentation](/docs/svelte-store).
|
||||
|
||||
|
||||
|
||||
@ -0,0 +1,3 @@
|
||||
{
|
||||
"title": "Glossaire"
|
||||
}
|
||||
Loading…
Reference in new issue