From 94c43e44391865631ae726156f788fd16052e9d9 Mon Sep 17 00:00:00 2001 From: Sid Bentifraouine Date: Sun, 10 Mar 2019 12:08:06 +0100 Subject: [PATCH 1/5] react-without-es6: french translation --- content/docs/react-without-es6.md | 72 +++++++++++++++---------------- 1 file changed, 36 insertions(+), 36 deletions(-) diff --git a/content/docs/react-without-es6.md b/content/docs/react-without-es6.md index 8b54d0981..29fded5a7 100644 --- a/content/docs/react-without-es6.md +++ b/content/docs/react-without-es6.md @@ -1,10 +1,10 @@ --- id: react-without-es6 -title: React Without ES6 +title: React sans ES6 permalink: docs/react-without-es6.html --- -Normally you would define a React component as a plain JavaScript class: +En temps normal, pour définir un composant React, vous utilisez une classe Javascript: ```javascript class Greeting extends React.Component { @@ -14,7 +14,7 @@ class Greeting extends React.Component { } ``` -If you don't use ES6 yet, you may use the `create-react-class` module instead: +Si vous n'utilisez pas encore ES6, vous pouvez utiliser le module `create-react-class`: ```javascript @@ -26,11 +26,11 @@ var Greeting = createReactClass({ }); ``` -The API of ES6 classes is similar to `createReactClass()` with a few exceptions. +À quelques exceptions près, l'API des classes ES6 est similaire a `createReactClass()`. -## Declaring Default Props {#declaring-default-props} +## Déclaration de Props par défaut {#declaring-default-props} -With functions and ES6 classes `defaultProps` is defined as a property on the component itself: +Dans les fonctions et les classes ES6, `defaultProps` est défini en tant que propriété a l'intérieur du composant: ```javascript class Greeting extends React.Component { @@ -38,17 +38,17 @@ class Greeting extends React.Component { } Greeting.defaultProps = { - name: 'Mary' + name: 'Marie' }; ``` -With `createReactClass()`, you need to define `getDefaultProps()` as a function on the passed object: +Avec `createReactClass()`, vous aurez besoin de définir `getDefaultProps()` en tant que fonction dans l'objet passé en paramètre: ```javascript var Greeting = createReactClass({ getDefaultProps: function() { return { - name: 'Mary' + name: 'Marie' }; }, @@ -57,9 +57,9 @@ var Greeting = createReactClass({ }); ``` -## Setting the Initial State {#setting-the-initial-state} +## Définir l'état initial {#setting-the-initial-state} -In ES6 classes, you can define the initial state by assigning `this.state` in the constructor: +Dans les classes ES6, vous pouvez définir l'état initial en affectant `this.state` dans le constructeur: ```javascript class Counter extends React.Component { @@ -71,7 +71,7 @@ class Counter extends React.Component { } ``` -With `createReactClass()`, you have to provide a separate `getInitialState` method that returns the initial state: +Avec `createReactClass()`, vous devez fournir une méthode `getInitialState` qui retourne l'état initial ```javascript var Counter = createReactClass({ @@ -84,14 +84,14 @@ var Counter = createReactClass({ ## Autobinding {#autobinding} -In React components declared as ES6 classes, methods follow the same semantics as regular ES6 classes. This means that they don't automatically bind `this` to the instance. You'll have to explicitly use `.bind(this)` in the constructor: +Dans les composants React déclarés en tant que classe ES6, les méthodes suivent la même sémantique tout comme les classes ES6 régulières. Cela veut dire qu'elles ne vont pas lier le `this` a l'instance de classe. Pour ce faire, devez utiliser `.bind(this)` dans le constructeur: ```javascript class SayHello extends React.Component { constructor(props) { super(props); this.state = {message: 'Hello!'}; - // This line is important! + // La ligne ci-dessous est importante! this.handleClick = this.handleClick.bind(this); } @@ -100,17 +100,17 @@ class SayHello extends React.Component { } render() { - // Because `this.handleClick` is bound, we can use it as an event handler. + // Nous pourrons utiliser `this.handleClick` pour gérer un événement, car il est lié a l'instance de classe return ( ); } } ``` -With `createReactClass()`, this is not necessary because it binds all methods: +Ce ne sera pas nécessaire dans `createReactClass()`, car elle lie toutes les méthodes: ```javascript var SayHello = createReactClass({ @@ -125,16 +125,16 @@ var SayHello = createReactClass({ render: function() { return ( ); } }); ``` -This means writing ES6 classes comes with a little more boilerplate code for event handlers, but the upside is slightly better performance in large applications. +L'écriture de classes ES6 inclue un peu plus de code générique pour les gestionnaires d'événements, mais ceci améliore légèrement les performances pour les grosses applis. -If the boilerplate code is too unattractive to you, you may enable the **experimental** [Class Properties](https://babeljs.io/docs/plugins/transform-class-properties/) syntax proposal with Babel: +Si vous ne trouvez pas le code générique très attirant, vous pouvez activer la proposition de syntaxe **expérimentale** avec Babel [Propriétés de Classe](https://babeljs.io/docs/plugins/transform-class-properties/) : ```javascript @@ -143,8 +143,8 @@ class SayHello extends React.Component { super(props); this.state = {message: 'Hello!'}; } - // WARNING: this syntax is experimental! - // Using an arrow here binds the method: + // ATTENTION: cette syntaxe est expérimentale! + // L'utilisation d'une fonction flechée va lier la méthode a l'instance de classe: handleClick = () => { alert(this.state.message); } @@ -152,34 +152,34 @@ class SayHello extends React.Component { render() { return ( ); } } ``` -Please note that the syntax above is **experimental** and the syntax may change, or the proposal might not make it into the language. +Il faut prendre note du fait que la syntaxe ci-dessus est **expérimentale** et qu'elle pourrait être amenée à changer, ou que la proposition de syntaxe ne soit pas intergrée au langage. -If you'd rather play it safe, you have a few options: +Si vous préférez la prudence, quelques options s'offrent à vous: -* Bind methods in the constructor. -* Use arrow functions, e.g. `onClick={(e) => this.handleClick(e)}`. -* Keep using `createReactClass`. +* Lier les méthodes à l'instance de classe dans le constructeur. +* Utiliser des fonctions fléchées, e.g. `onClick={(e) => this.handleClick(e)}`. +* Continuer à utiliser `createReactClass`. ## Mixins {#mixins} >**Note:** > ->ES6 launched without any mixin support. Therefore, there is no support for mixins when you use React with ES6 classes. +>ES6 a été lancé sans support pour les mixins. C'est pour cette raison qu'il n'y a pas de support pour les mixins quand vous utilisez React avec les classes ES6. > ->**We also found numerous issues in codebases using mixins, [and don't recommend using them in the new code](/blog/2016/07/13/mixins-considered-harmful.html).** +>**Nous avons aussi trouvé pas mal de problèmes dans les bases de code utilisant les mixins, [nous recommandons de na pas les utiliser dans vos nouvelles applis](/blog/2016/07/13/mixins-considered-harmful.html).** > >This section exists only for the reference. -Sometimes very different components may share some common functionality. These are sometimes called [cross-cutting concerns](https://en.wikipedia.org/wiki/Cross-cutting_concern). `createReactClass` lets you use a legacy `mixins` system for that. +Des composants très différents les uns des autres peuvent partager des fonctionalites communes. Ce sont des [pré-occupations transversales](https://en.wikipedia.org/wiki/Cross-cutting_concern). `createReactClass` vous permet d'utiliser un système de `mixins` de patrimoine (???). -One common use case is a component wanting to update itself on a time interval. It's easy to use `setInterval()`, but it's important to cancel your interval when you don't need it anymore to save memory. React provides [lifecycle methods](/docs/react-component.html#the-component-lifecycle) that let you know when a component is about to be created or destroyed. Let's create a simple mixin that uses these methods to provide an easy `setInterval()` function that will automatically get cleaned up when your component is destroyed. +Un cas d'utilisation courant est un composent qui veut se mettre à jour par intervalle de temps. C'est facile d'utiliser `setInterval()`, mais c'est important d'annuler votre intervalle si vous n'en avez plus besoin afin d'economiser de la mémoire. React fournit des [méthodes de cycle de vie](/docs/react-component.html#the-component-lifecycle), celles-si vous font savoir quand est-ce qu'un composant va être crée ou détruit. Créons une simple mixin qui utilise ces méthodes afin de fournir une simple fonction `setInterval()` qui va se nettoyer automatiquement lorsque le composant est détruit. ```javascript var SetIntervalMixin = { @@ -197,12 +197,12 @@ var SetIntervalMixin = { var createReactClass = require('create-react-class'); var TickTock = createReactClass({ - mixins: [SetIntervalMixin], // Use the mixin + mixins: [SetIntervalMixin], // Utiliser la mixin getInitialState: function() { return {seconds: 0}; }, componentDidMount: function() { - this.setInterval(this.tick, 1000); // Call a method on the mixin + this.setInterval(this.tick, 1000); // Appeler un méthode dans la mixin }, tick: function() { this.setState({seconds: this.state.seconds + 1}); @@ -210,7 +210,7 @@ var TickTock = createReactClass({ render: function() { return (

- React has been running for {this.state.seconds} seconds. + Votre composant React tourne depuis {this.state.seconds} secondes.

); } @@ -222,4 +222,4 @@ ReactDOM.render( ); ``` -If a component is using multiple mixins and several mixins define the same lifecycle method (i.e. several mixins want to do some cleanup when the component is destroyed), all of the lifecycle methods are guaranteed to be called. Methods defined on mixins run in the order mixins were listed, followed by a method call on the component. +Si un composant utilise plusieurs mixins et que nombreuses mixins définissent la même méthode de cycle de vie(C-à-d que de nombreuses mixins veulent faire un nettoyage lorsque le composant est détruit), vous avez la garantie que toutes ces méthodes de cycle de vie vont être appelées. Les méthodes définies dans les mixins se lancent dans l'ordre dans le lequel les mixins ont été listées, suivies par un appel de méthode dans le composant. From 0fcde4236769fa8dac7da01a45237dedf765f115 Mon Sep 17 00:00:00 2001 From: Christophe Porteneuve Date: Sun, 17 Mar 2019 12:40:30 +0100 Subject: [PATCH 2/5] Apply suggestions from code review First translation PR fixes Co-Authored-By: sidbentifraouine --- content/docs/react-without-es6.md | 69 ++++++++++++++++--------------- 1 file changed, 35 insertions(+), 34 deletions(-) diff --git a/content/docs/react-without-es6.md b/content/docs/react-without-es6.md index 29fded5a7..fd2d3d305 100644 --- a/content/docs/react-without-es6.md +++ b/content/docs/react-without-es6.md @@ -4,7 +4,7 @@ title: React sans ES6 permalink: docs/react-without-es6.html --- -En temps normal, pour définir un composant React, vous utilisez une classe Javascript: +En temps normal, pour définir un composant React, vous utilisez une simple classe Javascript : ```javascript class Greeting extends React.Component { @@ -14,7 +14,7 @@ class Greeting extends React.Component { } ``` -Si vous n'utilisez pas encore ES6, vous pouvez utiliser le module `create-react-class`: +Si vous n'utilisez pas encore ES6, vous pouvez utiliser le module `create-react-class` : ```javascript @@ -28,9 +28,9 @@ var Greeting = createReactClass({ À quelques exceptions près, l'API des classes ES6 est similaire a `createReactClass()`. -## Déclaration de Props par défaut {#declaring-default-props} +## Déclarer des props par défaut {#declaring-default-props} -Dans les fonctions et les classes ES6, `defaultProps` est défini en tant que propriété a l'intérieur du composant: +Dans les fonctions et les classes ES6, `defaultProps` est défini en tant que propriété sur le composant lui-même : ```javascript class Greeting extends React.Component { @@ -42,7 +42,7 @@ Greeting.defaultProps = { }; ``` -Avec `createReactClass()`, vous aurez besoin de définir `getDefaultProps()` en tant que fonction dans l'objet passé en paramètre: +Avec `createReactClass()`, vous aurez besoin de définir `getDefaultProps()` en tant que fonction dans l'objet passé en argument : ```javascript var Greeting = createReactClass({ @@ -59,7 +59,7 @@ var Greeting = createReactClass({ ## Définir l'état initial {#setting-the-initial-state} -Dans les classes ES6, vous pouvez définir l'état initial en affectant `this.state` dans le constructeur: +Dans les classes ES6, vous pouvez définir l'état local initial en affectant `this.state` dans le constructeur : ```javascript class Counter extends React.Component { @@ -71,7 +71,7 @@ class Counter extends React.Component { } ``` -Avec `createReactClass()`, vous devez fournir une méthode `getInitialState` qui retourne l'état initial +Avec `createReactClass()`, vous devez fournir une méthode `getInitialState` qui retourne l'état initial : ```javascript var Counter = createReactClass({ @@ -82,16 +82,16 @@ var Counter = createReactClass({ }); ``` -## Autobinding {#autobinding} +## Liaison automatique des méthodes {#autobinding} -Dans les composants React déclarés en tant que classe ES6, les méthodes suivent la même sémantique tout comme les classes ES6 régulières. Cela veut dire qu'elles ne vont pas lier le `this` a l'instance de classe. Pour ce faire, devez utiliser `.bind(this)` dans le constructeur: +Dans les composants React déclarés en tant que classes ES6, les méthodes suivent la même sémantique que dans toute classe ES6. Ça signifie qu'elles ne vont pas automatiquement lier `this` a l'instance. Pour ce faire, vous devez utiliser `.bind(this)` dans le constructeur : ```javascript class SayHello extends React.Component { constructor(props) { super(props); - this.state = {message: 'Hello!'}; - // La ligne ci-dessous est importante! + this.state = {message: 'Bonjour !'}; + // La ligne ci-dessous est importante ! this.handleClick = this.handleClick.bind(this); } @@ -100,17 +100,18 @@ class SayHello extends React.Component { } render() { - // Nous pourrons utiliser `this.handleClick` pour gérer un événement, car il est lié a l'instance de classe + // Nous pouvons utiliser `this.handleClick` comme gestionnaire d’événements, + // car il est lié a l'instance courante. return ( ); } } ``` -Ce ne sera pas nécessaire dans `createReactClass()`, car elle lie toutes les méthodes: +Tout ça n’est pas nécessaire avec `createReactClass()`, car elle lie toutes les méthodes : ```javascript var SayHello = createReactClass({ @@ -125,26 +126,26 @@ var SayHello = createReactClass({ render: function() { return ( ); } }); ``` -L'écriture de classes ES6 inclue un peu plus de code générique pour les gestionnaires d'événements, mais ceci améliore légèrement les performances pour les grosses applis. +L'écriture de classes ES6 nécessite un peu plus de code générique pour les gestionnaires d'événements, mais en contrepartie ça améliore légèrement les performances pour les grosses applications. -Si vous ne trouvez pas le code générique très attirant, vous pouvez activer la proposition de syntaxe **expérimentale** avec Babel [Propriétés de Classe](https://babeljs.io/docs/plugins/transform-class-properties/) : +Si vous n’arrivez pas à tolérer ce code générique, vous pouvez activer dans Babel la proposition de syntaxe **expérimentale** [Propriétés de classes](https://babeljs.io/docs/plugins/transform-class-properties/) : ```javascript class SayHello extends React.Component { constructor(props) { super(props); - this.state = {message: 'Hello!'}; + this.state = {message: 'Bonjour !'}; } - // ATTENTION: cette syntaxe est expérimentale! - // L'utilisation d'une fonction flechée va lier la méthode a l'instance de classe: + // ATTENTION : cette syntaxe est expérimentale ! + // Recourir à une fonction fléchée va lier la méthode à l'instance : handleClick = () => { alert(this.state.message); } @@ -152,34 +153,34 @@ class SayHello extends React.Component { render() { return ( ); } } ``` -Il faut prendre note du fait que la syntaxe ci-dessus est **expérimentale** et qu'elle pourrait être amenée à changer, ou que la proposition de syntaxe ne soit pas intergrée au langage. +Remarquez bien que la syntaxe ci-dessus est **expérimentale** et qu'elle pourrait être amenée à changer, ou que la proposition de syntaxe ne soit pas intégrée au langage. -Si vous préférez la prudence, quelques options s'offrent à vous: +Si vous préférez la prudence, quelques options s'offrent à vous : -* Lier les méthodes à l'instance de classe dans le constructeur. -* Utiliser des fonctions fléchées, e.g. `onClick={(e) => this.handleClick(e)}`. +* Lier les méthodes à l'instance dans le constructeur. +* Utiliser des fonctions fléchées, ex. `onClick={(e) => this.handleClick(e)}`. * Continuer à utiliser `createReactClass`. ## Mixins {#mixins} ->**Note:** +>Remarque > ->ES6 a été lancé sans support pour les mixins. C'est pour cette raison qu'il n'y a pas de support pour les mixins quand vous utilisez React avec les classes ES6. +>ES6 est sorti sans prise en charge des *mixins*. C'est pour cette raison qu'ils ne sont pas pris en charge quand vous utilisez React avec les classes ES6. > ->**Nous avons aussi trouvé pas mal de problèmes dans les bases de code utilisant les mixins, [nous recommandons de na pas les utiliser dans vos nouvelles applis](/blog/2016/07/13/mixins-considered-harmful.html).** +>**Nous avons aussi trouvé pas mal de problèmes dans les bases de code utilisant les mixins, du [nous recommandons de ne pas les utiliser à l’avenir](/blog/2016/07/13/mixins-considered-harmful.html).** > ->This section exists only for the reference. +>Cette section n’existe qu’à titre de référence. -Des composants très différents les uns des autres peuvent partager des fonctionalites communes. Ce sont des [pré-occupations transversales](https://en.wikipedia.org/wiki/Cross-cutting_concern). `createReactClass` vous permet d'utiliser un système de `mixins` de patrimoine (???). +Des composants très différents les uns des autres peuvent partager des fonctionnalités communes. On parle souvent de [questions transversales](https://en.wikipedia.org/wiki/Cross-cutting_concern) *(cross-cutting concerns, NdT)*. `createReactClass` vous permet d'utiliser un système historique de `mixins` pour ça. -Un cas d'utilisation courant est un composent qui veut se mettre à jour par intervalle de temps. C'est facile d'utiliser `setInterval()`, mais c'est important d'annuler votre intervalle si vous n'en avez plus besoin afin d'economiser de la mémoire. React fournit des [méthodes de cycle de vie](/docs/react-component.html#the-component-lifecycle), celles-si vous font savoir quand est-ce qu'un composant va être crée ou détruit. Créons une simple mixin qui utilise ces méthodes afin de fournir une simple fonction `setInterval()` qui va se nettoyer automatiquement lorsque le composant est détruit. +Un cas d'usage courant concerne un composant qui veut se mettre à jour à intervalle régulier. C'est facile d'utiliser `setInterval()`, mais il est important de désactiver l’horloge quand vous n'en avez plus besoin afin d'économiser la mémoire. React fournit des [méthodes de cycle de vie](/docs/react-component.html#the-component-lifecycle) qui vous notifient quand un composant est sur le point d’être créé ou détruit. Créons un *mixin* basique qui utilise ces méthodes afin de fournir une fonction `setInterval()` simple d'emploi, qui se nettoiera automatiquement lorsque le composant est détruit. ```javascript var SetIntervalMixin = { @@ -197,12 +198,12 @@ var SetIntervalMixin = { var createReactClass = require('create-react-class'); var TickTock = createReactClass({ - mixins: [SetIntervalMixin], // Utiliser la mixin + mixins: [SetIntervalMixin], // Utiliser le mixin getInitialState: function() { return {seconds: 0}; }, componentDidMount: function() { - this.setInterval(this.tick, 1000); // Appeler un méthode dans la mixin + this.setInterval(this.tick, 1000); // Appelle la méthode du mixin }, tick: function() { this.setState({seconds: this.state.seconds + 1}); @@ -222,4 +223,4 @@ ReactDOM.render( ); ``` -Si un composant utilise plusieurs mixins et que nombreuses mixins définissent la même méthode de cycle de vie(C-à-d que de nombreuses mixins veulent faire un nettoyage lorsque le composant est détruit), vous avez la garantie que toutes ces méthodes de cycle de vie vont être appelées. Les méthodes définies dans les mixins se lancent dans l'ordre dans le lequel les mixins ont été listées, suivies par un appel de méthode dans le composant. +Si un composant utilise plusieurs mixins et que de nombreux mixins définissent la même méthode de cycle de vie (par exemple pour effectuer un nettoyage à la destruction du composant), vous avez la garantie que toutes ces méthodes de cycle de vie seront appelées. Les méthodes définies dans les mixins sont exécutées dans l'ordre dans lequel les mixins ont été listés, suivies par l’appel de la méthode homonyme éventuelle du composant lui-même. From 3a7255ba9877728a3cd070c58e5b50c94fe2f8fa Mon Sep 17 00:00:00 2001 From: Sid Bentifraouine Date: Sun, 17 Mar 2019 12:42:30 +0100 Subject: [PATCH 3/5] Hello to bonjours --- content/docs/react-without-es6.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/content/docs/react-without-es6.md b/content/docs/react-without-es6.md index fd2d3d305..440e5cc59 100644 --- a/content/docs/react-without-es6.md +++ b/content/docs/react-without-es6.md @@ -9,7 +9,7 @@ En temps normal, pour définir un composant React, vous utilisez une simple clas ```javascript class Greeting extends React.Component { render() { - return

Hello, {this.props.name}

; + return

Bonjour, {this.props.name}

; } } ``` @@ -21,7 +21,7 @@ Si vous n'utilisez pas encore ES6, vous pouvez utiliser le module `create-react- var createReactClass = require('create-react-class'); var Greeting = createReactClass({ render: function() { - return

Hello, {this.props.name}

; + return

Bonjour, {this.props.name}

; } }); ``` @@ -116,7 +116,7 @@ Tout ça n’est pas nécessaire avec `createReactClass()`, car elle lie toutes ```javascript var SayHello = createReactClass({ getInitialState: function() { - return {message: 'Hello!'}; + return {message: 'Bonjour!'}; }, handleClick: function() { From c85bd794395b12df1949c781a545132eb0d13bca Mon Sep 17 00:00:00 2001 From: Sid Bentifraouine Date: Sun, 17 Mar 2019 12:43:38 +0100 Subject: [PATCH 4/5] Missing space --- content/docs/react-without-es6.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/react-without-es6.md b/content/docs/react-without-es6.md index 440e5cc59..4cface80b 100644 --- a/content/docs/react-without-es6.md +++ b/content/docs/react-without-es6.md @@ -116,7 +116,7 @@ Tout ça n’est pas nécessaire avec `createReactClass()`, car elle lie toutes ```javascript var SayHello = createReactClass({ getInitialState: function() { - return {message: 'Bonjour!'}; + return {message: 'Bonjour !'}; }, handleClick: function() { From 046fa102c45854c3bb1e1279475cd10612a991a1 Mon Sep 17 00:00:00 2001 From: Christophe Porteneuve Date: Sun, 17 Mar 2019 15:01:40 +0100 Subject: [PATCH 5/5] Final tweaks --- content/docs/react-without-es6.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/content/docs/react-without-es6.md b/content/docs/react-without-es6.md index 4cface80b..8b5d56a07 100644 --- a/content/docs/react-without-es6.md +++ b/content/docs/react-without-es6.md @@ -4,7 +4,7 @@ title: React sans ES6 permalink: docs/react-without-es6.html --- -En temps normal, pour définir un composant React, vous utilisez une simple classe Javascript : +En temps normal, pour définir un composant React, vous utilisez une classe Javascript ordinaire : ```javascript class Greeting extends React.Component { @@ -71,7 +71,7 @@ class Counter extends React.Component { } ``` -Avec `createReactClass()`, vous devez fournir une méthode `getInitialState` qui retourne l'état initial : +Avec `createReactClass()`, vous devez fournir une méthode `getInitialState` qui renvoie l'état initial : ```javascript var Counter = createReactClass({ @@ -116,7 +116,7 @@ Tout ça n’est pas nécessaire avec `createReactClass()`, car elle lie toutes ```javascript var SayHello = createReactClass({ getInitialState: function() { - return {message: 'Bonjour !'}; + return {message: 'Bonjour !'}; }, handleClick: function() { @@ -174,7 +174,7 @@ Si vous préférez la prudence, quelques options s'offrent à vous : > >ES6 est sorti sans prise en charge des *mixins*. C'est pour cette raison qu'ils ne sont pas pris en charge quand vous utilisez React avec les classes ES6. > ->**Nous avons aussi trouvé pas mal de problèmes dans les bases de code utilisant les mixins, du [nous recommandons de ne pas les utiliser à l’avenir](/blog/2016/07/13/mixins-considered-harmful.html).** +>**Nous avons aussi trouvé pas mal de problèmes dans les bases de code utilisant les mixins, du coup [nous recommandons de ne pas les utiliser à l’avenir](/blog/2016/07/13/mixins-considered-harmful.html).** > >Cette section n’existe qu’à titre de référence.