Review of state.md

Signed-off-by: Bruno Lesieur <[email protected]>

Author: MachinisteWeb

docs/fr/getting-started.md

@@ -1,10 +1,10 @@
 # Pour commencer
 
-Au cœur de chaque application Vuex, il y a la **zone de stockage (« store »)**. Un « store » est tout simplement un conteneur avec l'**état** de votre application. Il y a deux choses qui différencient un store Vuex d'un simple objet global :
+Au cœur de chaque application Vuex, il y a la **zone de stockage (« store »)**. Un « store » est tout simplement un conteneur avec l'**état (« state »)** de votre application. Il y a deux choses qui différencient un store Vuex d'un simple objet global :
 
 1. Les stores Vuex sont réactifs. Quand les composants Vue y récupèrent l'état, ils se mettront à jour de façon réactive et efficace si l'état du store a changé.
 
-2. Vous ne pouvez pas muter directement l'état du store. La seule façon de modifier l'état d'un store est d'**acter** explicitement des **mutations**. Cela assure que chaque état laisse un enregistrement traçable, et permet à des outils de nous aider à mieux appréhender nos applications.
+2. Vous ne pouvez pas muter directement l'état du store. La seule façon de modifier l'état d'un store est d'**acter (« commit »)** explicitement des **mutations**. Cela assure que chaque état laisse un enregistrement traçable, et permet à des outils de nous aider à mieux appréhender nos applications.
 
 ### Le store le plus simple
 

docs/fr/intro.md

@@ -56,8 +56,8 @@ Voilà l'idée de base derrière Vuex, inspiré par [Flux](https://facebook.gith
 
 ### Quand l'utiliser ?
 
-Bien que Vuex nous aide à gérer un état global partagé, il apporte aussi le coût de nouveaux concepts et _cas d'utilisation pré-conçu_. C'est un compromis entre la productivité à court terme et à long terme.
+Bien que Vuex nous aide à gérer un état global partagé, il apporte aussi le coût de nouveaux concepts et _abstraction de code_ (« boilerplate »). C'est un compromis entre la productivité à court terme et à long terme.
 
-Si vous n'avez jamais créé une _application monopage_ à grande échelle et que vous sautez directement dans Vuex, cela peut paraître verbeux et intimidant. C'est parfaitement normal ; si votre application est simple, vous vous en sortirez sans doute très bien sans Vuex. Un simple [bus d'évènement global](https://fr.vuejs.org/v2/guide/components.html#Communication-non-parent-enfant) pourrait très bien vous suffire. Mais si vous devez créer une application monopage à moyenne ou grande échelle, il y a des chances que vous vous trouviez dans des situations qui vous feront vous interroger sur une meilleure gestion de l'état global, détaché de votre composant Vue, et Vuex sera naturellement la prochaine étape pour vous. Voici une bonne citation de Dan Abramov, l'auteur de Redux :
+Si vous n'avez jamais créé une _application monopage_ à grande échelle et que vous sautez directement dans Vuex, cela peut paraître verbeux et intimidant. C'est parfaitement normal ; si votre application est simple, vous vous en sortirez sans doute très bien sans Vuex. Un simple [canal d'évènement global](https://fr.vuejs.org/v2/guide/components.html#Communication-non-parent-enfant) pourrait très bien vous suffire. Mais si vous devez créer une application monopage à moyenne ou grande échelle, il y a des chances que vous vous trouviez dans des situations qui vous feront vous interroger sur une meilleure gestion de l'état global, détaché de votre composant Vue, et Vuex sera naturellement la prochaine étape pour vous. Voici une bonne citation de Dan Abramov, l'auteur de Redux :
 
 > « Les librairies Flux, c'est comme les lunettes : vous saurez quand vous en aurez besoin. »

docs/fr/state.md

@@ -1,14 +1,14 @@
 # State
 
-### Single State Tree
+### Arbre d'état unique
 
-Vuex utilise un **single state tree** — cet unique objet contient tout le state au niveau applicatif et sert de "source unique de vérité". Cela signifie également que vous n'aurez qu'un seul store pour chaque application. Un _single state tree_ rend rapide la localisation d'une partie de state spécifique, et nous permet de facilement prendre des instantanés du state actuel de l'application à des fins de debugging.
+Vuex utilise un **arbre d'état unique**, c'est-à-dire que cet unique objet contient tout l'état au niveau applicatif et sert de « source de vérité unique ». Cela signifie également que vous n'aurez qu'un seul store pour chaque application. Un arbre d'état unique rend rapide la localisation d'une partie spécifique de l'état et permet de facilement prendre des instantanés de l'état actuel de l'application à des fins de débogage.
 
-Le _single state tree_ n'entre pas en conflit avec la modularité — dans les prochains chapitres, nous examinerons comment séparer votre state et vos mutations dans des sous-modules.
+L'arbre d'état unique n'entre pas en conflit avec la modularité. Dans les prochains chapitres, nous examinerons comment séparer votre état et vos mutations dans des sous-modules.
 
-### Récupérer le state Vuex dans des composants Vue
+### Récupération d'état Vuex dans des composants Vue
 
-Alors, comment affichons-nous le state du store dans nos composants Vue ? Puisque les stores Vuex sont réactifs, la façon la plus simple d'y "récupérer" le state est de simplement retourner une partie du state depuis une [computed property](http://vuejs.org/guide/computed.html) :
+Alors, comment affichons-nous l'état du store dans nos composants Vue ? Puisque les stores Vuex sont réactifs, la façon la plus simple d'y « récupérer » l'état est tout simplement de retourner une partie de l'état depuis une [une propriété calculée](http://fr.vuejs.org/guide/computed.html) :
 
 ``` js
 // créons un composant Counter
@@ -22,16 +22,16 @@ const Counter = {
 }
 ```
 
-Lorsque `store.state.count` change, cela entraînera la ré-évaluation de la computed property, et déclenchera les actions DOM associées.
+Lorsque `store.state.count` change, cela entraînera la ré-évaluation de la propriété calculée, et déclenchera les actions associées au DOM.
 
-Cependant, ce pattern oblige le composant à compter sur le singleton global du store. Lorsqu'on utilise un système de module, il est nécessaire d'importer le store dans tous les composants qui utilisent le state du store, et il est également nécessaire de créer un mock lorsque l'on teste le composant.
+Cependant, ce modèle oblige le composant à compter sur le singleton global du store. Lorsqu'on utilise un système de module, il est nécessaire d'importer le store dans tous les composants qui utilisent l'état du store, et il est également nécessaire de créer un jeu de test lorsque l'on teste le composant.
 
-Vuex fournit un méchanisme pour "injecter" le store dans tous les composants enfants du composant racine avec l'option `store` (activée par `Vue.use(Vuex)`) :
+Vuex fournit un méchanisme pour « injecter » le store dans tous les composants enfants du composant racine avec l'option `store` (activée par `Vue.use(Vuex)`) :
 
 ``` js
 const app = new Vue({
   el: '#app',
-  // fournit le store avec l'option "store".
+  // fournit le store avec l'option `store`.
   // cela injectera l'instance du store dans tous les composants enfants.
   store,
   components: { Counter },
@@ -43,7 +43,7 @@ const app = new Vue({
 })
 ```
 
-En fournissant l'option `store` à l'instance racine, le store sera injecté dans tous les composants enfants de la racine et sera disponible sur ceux-ci avec `this.$store`. Mettons à jours notre implémentation de `Counter` :
+En fournissant l'option `store` à l'instance racine, le store sera injecté dans tous les composants enfants de la racine et sera disponible dans ces derniers avec `this.$store`. Mettons à jour notre implémentation de `Counter` :
 
 ``` js
 const Counter = {
@@ -56,12 +56,12 @@ const Counter = {
 }
 ```
 
-### Le helper `mapState`
+### La fonction utilitaire `mapState`
 
-Lorsqu'un composant a besoin d'utiliser plusieurs propriétés ou getters du state du store, déclarer toutes ces computed properties peut devenir répétitif et verbeux. Afin de palier à ça, nous pouvons utiliser le helper `mapState` qui génère des fonctions getters pour nous et nous épargne quelques coups de clavier :
+Lorsqu'un composant a besoin d'utiliser plusieurs accesseurs ou propriétés de l'état du store, déclarer toutes ces propriétés calculées peut devenir répétitif et verbeux. Afin de palier à ça, nous pouvons utiliser la fonction utilitaire `mapState` qui génère des fonctions d'accession pour nous et nous épargne quelques coups de clavier :
 
 ``` js
-// dans la version standalone, les helpers sont exposés comme Vuex.mapState
+// dans la version complète, des fonctions utilitaires sont exposées tel que `Vuex.mapState`
 import { mapState } from 'vuex'
 
 export default {
@@ -73,37 +73,37 @@ export default {
     // passer la valeur littérale 'count' revient à écrire `state => state.count`
     countAlias: 'count',
 
-    // pour accéder au state local avec `this`, une fonction normale doit être utilisée
+    // pour accéder à l'état local avec `this`, une fonction normale doit être utilisée
     countPlusLocalState (state) {
       return state.count + this.localCount
     }
   })
 }
 ```
 
-Il est également possible de fournir un tableau de chaînes de caractères à `mapState` lorsque le nom de la propriété du state du store est la même que celui du composant.
+Il est également possible de fournir un tableau de chaînes de caractères à `mapState` lorsque le nom de la propriété de l'état du store est la même que celui du composant.
 
 ``` js
 computed: mapState([
-  // attacher this.count à store.state.count
+  // attacher `this.count` à `store.state.count`
   'count'
 ])
 ```
 
-### Object Spread Operator
+### Opérateur de décomposition
 
-Notez que `mapState` renvoie un objet. Comment l'utiliser en complément des autres computed properties locales ? Normalement, il faudrait utiliser un outil pour fusionner les multiples objets en un seul afin de passer cet objet final à `computed`. Cependant avec le [object spread operator](https://github.com/sebmarkbage/ecmascript-rest-spread) (qui est une proposition stage-3 ECMASCript), nous pouvons grandement simplifier la syntaxe :
+Notez que `mapState` renvoie un objet. Comment l'utiliser en complément des autres propriétés calculées locales ? Normalement, il faudrait utiliser un outil pour fusionner les multiples objets en un seul afin de passer cet objet final à `computed`. Cependant avec l'[opérateur de décomposition](https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateur_de_d%C3%A9composition) (qui est une proposition stage-3 ECMASCript), nous pouvons grandement simplifier la syntaxe :
 
 ``` js
 computed: {
   localComputed () { /* ... */ },
-  // rajouter cet objet dans l'objet `computed` avec l'object spread operator
+  // rajouter cet objet dans l'objet `computed` avec l'opérateur de décomposition
   ...mapState({
     // ...
   })
 }
 ```
 
-### Les composants peuvent toujours avoir un state local
+### Les composants peuvent toujours avoir un état local
 
-Utiliser Vuex ne signifie pas que vous devez mettre **tout** votre state dans Vuex. Bien que le fait de mettre plus de state dans Vuex rende vos mutations de state plus explicites et plus debuggables, parfois il peut aussi rendre le code plus verbeux et indirect. Si une partie de state appartient directement à un seul composant, il est parfaitement sain de la laisser dans le state local. Assurez vous de prendre en compte les avantages et inconvénients d'une telle décision afin de vous adaptez le mieux aux besoins de votre application.
+Utiliser Vuex ne signifie pas que vous devez mettre **tout** votre état dans Vuex. Bien que le fait de mettre plus d'état dans Vuex rende vos mutation d'état plus explicites et plus débogable, parfois il peut aussi rendre le code plus verbeux et indirect. Si une partie de l'état appartient directement à un seul composant, il est parfaitement sain de la laisser dans l'état local. Assurez vous de prendre en compte les avantages et inconvénients d'une telle décision afin de vous adapter au mieux aux besoins de votre application.

docs/fr/structure.md

@@ -1,16 +1,16 @@
-# Structure d'une application
+# Application Structure
 
-Vuex ne vous restreint pas vraiment dans la façon dont vous voulez structurer votre code. Il impose plutôt un set de principes de haut niveau :
+Vuex doesn't really restrict how you structure your code. Rather, it enforces a set of high-level principles:
 
-1. Le state d'application est centralisé dans le store.
+1. Application-level state is centralized in the store.
 
-2. La seule façon de muter le state est de commiter des **mutations**, qui sont des transactions synchrones.
+2. The only way to mutate the state is by committing **mutations**, which are synchronous transactions.
 
-3. La logique asynchrone doit être composée et encapsulée dans des **actions**.
+3. Asynchronous logic should be encapsulated in, and can be composed with **actions**.
 
-Tant que vous suivez ces règles, c'est à vous de structurer votre projet. Si votre fichier de store devient trop gros, commencez simplement par séparer les actions, mutations et getters dans des fichiers séparés.
+As long as you follow these rules, it's up to you how to structure your project. If your store file gets too big, simply start splitting the actions, mutations and getters into separate files.
 
-Pour une application non-triviale, nous aurons probablement besoin de faire appel à des modules. Voici un exemple de structure de projet :
+For any non-trivial app, we will likely need to leverage modules. Here's an example project structure:
 
 ``` bash
 ├── index.html
@@ -21,12 +21,12 @@ Pour une application non-triviale, nous aurons probablement besoin de faire appe
 │   ├── App.vue
 │   └── ...
 └── store
-    ├── index.js          # Là où l'on assemble nos modules et exportons le store
-    ├── actions.js        # Actions racine
-    ├── mutations.js      # Mutations racine
+    ├── index.js          # where we assemble modules and export the store
+    ├── actions.js        # root actions
+    ├── mutations.js      # root mutations
     └── modules
         ├── cart.js       # cart module
         └── products.js   # products module
 ```
 
-Vous pouvez jeter à un œil à [l'exemple Shopping Cart](https://github.com/vuejs/vuex/tree/dev/examples/shopping-cart).
+As a reference, check out the [Shopping Cart Example](https://github.com/vuejs/vuex/tree/dev/examples/shopping-cart).