Skip to content

[Translation WIP] Official French Translation from Vuejs-FR #787

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 106 commits into from
Closed
Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
106 commits
Select commit Hold shift + click to select a range
2760a53
Création de la branch working
MachinisteWeb May 5, 2017
f506497
installation.md review.
MachinisteWeb May 8, 2017
bc901f4
Result from review https://github.com/vuejs-fr/vue-router/pull/3/
MachinisteWeb May 8, 2017
42ed911
Update from `en` version
MachinisteWeb May 8, 2017
59a355b
Add _intro branch
MachinisteWeb May 8, 2017
1c7d8fe
Merge pull request #4 from vuejs-fr/working_installation
MachinisteWeb May 9, 2017
e142ad3
Add propositions by haeresis and kocal
MachinisteWeb May 10, 2017
adeb362
Merge pull request #5 from vuejs-fr/working_intro
MachinisteWeb May 10, 2017
065b339
Change « ponctuation »
MachinisteWeb May 10, 2017
ef2b6df
Merge remote-tracking branch 'upstream/dev' into working
MachinisteWeb May 10, 2017
3139afc
Branche pour la revue de getting-started.md
MachinisteWeb May 10, 2017
36f8d63
Update from @haeresis and @kokal review.
MachinisteWeb May 18, 2017
b693198
Merge pull request #6 from vuejs-fr/getting-started
MachinisteWeb May 18, 2017
7c35cd4
Merge remote-tracking branch 'upstream/dev' into working
MachinisteWeb May 18, 2017
a129a55
FR review of getting-started.md
MachinisteWeb May 18, 2017
6b6e41f
`_` with `**` usage to separate italic from bold.
MachinisteWeb May 18, 2017
678edd3
`_` with `**` usage to separate italic and bold at same position.
MachinisteWeb May 18, 2017
714409a
Last intro.md review before PR
MachinisteWeb May 18, 2017
8ceff1e
Remove repetition from intro.md
MachinisteWeb May 18, 2017
c839f84
Update website
MachinisteWeb May 18, 2017
5124dc7
Update state.md with haeresis and kocal review
MachinisteWeb May 19, 2017
c80c83b
Update asked by @posva
MachinisteWeb May 19, 2017
b998fca
Merge pull request #8 from vuejs-fr/state
MachinisteWeb May 20, 2017
3a5a270
Review of state.md
MachinisteWeb May 20, 2017
ef3609f
Revert "Review of state.md"
MachinisteWeb May 20, 2017
9ce9f2b
Review of state.md
MachinisteWeb May 20, 2017
6e43e28
Update SUMMARY.md because of state.md review
MachinisteWeb May 20, 2017
4850dda
SUMMARY.md update
MachinisteWeb May 20, 2017
fb8f0c4
update SUMMARY.md
MachinisteWeb May 20, 2017
4ba4208
Start getters.md review
MachinisteWeb May 20, 2017
6ed64c7
Remove first line
MachinisteWeb May 20, 2017
55cb40a
Add new english part
MachinisteWeb May 20, 2017
92f578b
Translate a new example
MachinisteWeb May 20, 2017
7222212
Starting structure.md review
MachinisteWeb May 20, 2017
6fec9e4
Starting structure.md review
MachinisteWeb May 20, 2017
30816d5
Update des petits changements
MachinisteWeb May 20, 2017
dff200a
Remove structure.md traduction from this PR
MachinisteWeb May 20, 2017
fefc19e
Relecture de getters.md après review de @Kokal et @Haeresis
MachinisteWeb May 20, 2017
73c8d0f
Starting review for mutations.md
MachinisteWeb May 20, 2017
c11e884
Merge pull request #10 from vuejs-fr/structure
MachinisteWeb May 20, 2017
5283090
Merge pull request #9 from vuejs-fr/getters
MachinisteWeb May 20, 2017
900e65f
Add a proposition by @posva
MachinisteWeb May 20, 2017
f37b667
Add review of getters.md and structure.md
MachinisteWeb May 20, 2017
a943210
Merge remote-tracking branch 'upstream/dev' into working
MachinisteWeb May 22, 2017
0f73e76
Merge branch 'working' into mutation
MachinisteWeb May 22, 2017
102eb49
Add changes after @haeresis and @kokal review.
MachinisteWeb May 22, 2017
7a15c65
Translate Vue images
MachinisteWeb May 22, 2017
91b50b4
Translate Vuex images
MachinisteWeb May 22, 2017
2ad1901
Start review of actions.md
MachinisteWeb May 22, 2017
e17989a
Merge pull request #11 from vuejs-fr/mutation
MachinisteWeb May 22, 2017
11e1e29
Merge branch 'working' into actions
MachinisteWeb May 22, 2017
131acb2
New line
MachinisteWeb May 22, 2017
65f8e11
New lines
MachinisteWeb May 22, 2017
f8d117f
map to attacher
MachinisteWeb May 22, 2017
4230cf5
modules.md review
MachinisteWeb May 22, 2017
261e918
Ajout des nouveaux textes partiellement traduit.
MachinisteWeb May 22, 2017
365a982
Review and translation de modules.md
MachinisteWeb May 22, 2017
47f5ef0
Review de plugins.md
MachinisteWeb May 22, 2017
ccdc719
Add review of @kokal and @haeresis
MachinisteWeb May 23, 2017
6bc5043
Review of @kokal and @haeresis
MachinisteWeb May 23, 2017
3e5bec2
Review from @kokal et @haeresis
MachinisteWeb May 23, 2017
0f0b968
Translate comment from plugins.md
MachinisteWeb May 23, 2017
ae44a29
Merge pull request #12 from vuejs-fr/actions
MachinisteWeb May 23, 2017
26aef80
Merge pull request #13 from vuejs-fr/modules
MachinisteWeb May 23, 2017
8902f83
Merge pull request #14 from vuejs-fr/plugins
MachinisteWeb May 23, 2017
737b013
Merge remote-tracking branch 'upstream/dev' into dev
MachinisteWeb May 23, 2017
3afd7a8
Add french review of actions.md, modules.md, mutations.md and plugins.md
MachinisteWeb May 23, 2017
dda4b44
Merge remote-tracking branch 'upstream/dev' into working
MachinisteWeb May 27, 2017
4e0828c
Update getting-started.md example
MachinisteWeb May 27, 2017
a8bfa60
Merge remote-tracking branch 'upstream/dev' into dev
MachinisteWeb May 27, 2017
d72d70c
Merge remote-tracking branch 'upstream/dev' into working
MachinisteWeb Jun 12, 2017
fcd43b6
Merge remote-tracking branch 'upstream/dev' into dev
MachinisteWeb Jun 12, 2017
020c644
Update french content with EN changes
MachinisteWeb Jun 12, 2017
8120f79
Merge branch 'dev' into dev
MachinisteWeb Jun 16, 2017
540d633
Merge remote-tracking branch 'upstream/dev' into working
MachinisteWeb Jun 17, 2017
d74d646
Review of strict.md
MachinisteWeb Jun 17, 2017
6f2e805
Review haeresis
MachinisteWeb Jun 17, 2017
a30286e
Traduction de forms.md
MachinisteWeb Jun 17, 2017
a07b01f
Update forms.md
MachinisteWeb Jun 17, 2017
4dc4b9d
Traduction de testing.md
MachinisteWeb Jun 17, 2017
1f4b52b
Update testing.md
MachinisteWeb Jun 17, 2017
dddd4c3
Relecture de hot-reload.md
MachinisteWeb Jun 17, 2017
b120a02
Update hot-reload.md
MachinisteWeb Jun 17, 2017
9c9dbd8
Relecture api.md
MachinisteWeb Jun 17, 2017
7a49e01
Line alignment.
MachinisteWeb Jun 17, 2017
cfa1fac
aligment options
MachinisteWeb Jun 17, 2017
aa5bf46
Api aligments
MachinisteWeb Jun 17, 2017
315d454
New line addition
MachinisteWeb Jun 17, 2017
d244645
Next
MachinisteWeb Jun 17, 2017
684de06
Dernier ajout.
MachinisteWeb Jun 17, 2017
15d78d8
Relecture @haeresis complète.
MachinisteWeb Jun 17, 2017
82111eb
Update SUMMARY.md
MachinisteWeb Jun 19, 2017
d00c872
Add @haeresis and @kocal review.
MachinisteWeb Jun 22, 2017
e132a58
virifier => vérifier
MachinisteWeb Jun 22, 2017
81afea1
Proposition of @kokal added.
MachinisteWeb Jun 22, 2017
c7d2caf
Merge pull request #17 from vuejs-fr/testing
Kocal Jun 22, 2017
7638407
Merge pull request #16 from vuejs-fr/form
Kocal Jun 23, 2017
e8ead88
Merge pull request #18 from vuejs-fr/hot-reload
MachinisteWeb Jun 28, 2017
3275349
Merge branch 'working' into strict
MachinisteWeb Jun 28, 2017
2ec05fd
Merge branch 'working' into api
MachinisteWeb Jun 28, 2017
3ca4122
Review de @Kocal
MachinisteWeb Jun 29, 2017
d2a9cb0
Review de @Kocal ajoutée
MachinisteWeb Jun 29, 2017
236e54f
Merge pull request #15 from vuejs-fr/strict
Kocal Jun 29, 2017
22b85dd
Merge pull request #19 from vuejs-fr/api
Kocal Jun 29, 2017
d53f837
Merge branch 'dev' of https://github.com/vuejs-fr/vuex into dev
MachinisteWeb Jun 29, 2017
44bcc98
FR review with officials terms done.
MachinisteWeb Jun 29, 2017
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion docs/fr/SUMMARY.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
- [Release Notes](https://github.com/vuejs/vuex/releases)
- [Installation](installation.md)
- [Qu'est-ce que Vuex ?](intro.md)
- [Débuter](getting-started.md)
- [Pour commencer](getting-started.md)
- Concepts de base
- [State](state.md)
- [Getters](getters.md)
Expand Down
22 changes: 11 additions & 11 deletions docs/fr/getting-started.md
Original file line number Diff line number Diff line change
@@ -1,19 +1,19 @@
# Débuter
# Pour commencer

Au cœur de chaque application Vuex, il y a le **store**. Un "store" est tout simplement un conteneur avec le **state** 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** de votre application. Il y a deux choses qui différencient un store Vuex d'un simple objet global :
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

autant rajouter aussi state entre parentheses

Copy link
Contributor Author

@MachinisteWeb MachinisteWeb May 19, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Merci Posva pour tes retours !

Nous traquons l'état des traductions des termes ici : vuejs-fr/v2.vuejs.org#4

  • Quand un terme générique existe dans la culture française nous le reprenons (ex : portée pour scope).
  • Cependant quand le terme est spécifique à une techno, nous nous référons à la documentation française. Si elle n'existe pas, nous gardons le terme anglais (ex : scope pour scope) avec angular.
  • Quand le terme générique n'existe pas, nous cherchons une équivalence anglaise (ex : état pour state),
  • Si cela n'est pas possible, nous conservons le terme original (ex : store, props, slot).
  • Si le terme traduit ne reflète pas assez ce qu'il signifiait en anglais, nous ajoutons la version originale entre parenthèse après pour lever l’ambiguïté.

Nous avons ajouté « store » entre parenthèse car nous ne réutilisons pas le terme zone de stockage pour chaque itération de store faute de traduction plus probante, et nous avons le sentiment que « zone de stockage » ne porte pas tout le sens du mot « store ».

En ce qui concerne les termes « État », « État local », « État global » nous envisageons dans faire les termes usuels.

De la même manière que (par exemple) le moyen de connaître la version anglaise du terme opérateur de décomposition est d'aller sur la version anglaise Spread Operator nous ne souhaitons pas accoler le terme original pour chaque terme traduit sauf si nous envisageons plus loin dans la documentation de le réutiliser.

À mon sens, s'il y a quelque chose à mettre en place pour faciliter la mise en relation des termes traduit/originaux ; c'est de pouvoir permuter de version de langue depuis la page courante pour connaître les termes usuels d'un concept dans chaque langue plutôt que de forcer, pour chaque première occurrence de chaque page, la répétition original d'un concept traduit.

Aussi sachant cela,

  • Penses-tu qu'il soit toujours nécessaire de préciser « state » entre parenthèse sachant que si la documentation n'est pas lu dans le sens de lecture, l'utilisateur ne croisera pas se terme.
  • Penses-tu que nous ne devrions pas traduire le terme ?
  • Penses-tu que ça « ne mange pas de pain » même en respectant notre philosophie de tout de même le traduire.

Un bon argument en faveur de laisser le terme original entre parenthèse est qu'il permet de faire le lien avec la syntaxe des exemples de code, certe, mais l’exercice de traduction est également d'assumer ses choix de traduction comme MDN le fait très bien. Nous sommes donc en grande discussion pour savoir s'il faut traduire ou non les noms de variable : vuejs-fr/v2.vuejs.org#54

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

C'est suffisant de le faire une fois, c'est attendu que les personnes commencent par getting started 😄
Ne traduisez par les nom de variables dans les exemples si c'est ça ce que tu veux dire


1. Les stores Vuex sont réactifs. Quand les composants Vue y récupèrent le state, ils modifieront efficacement et de façon réactive si le state du store change.
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 le state du store. La seule façon de modifier le state d'un store est de **commiter** explicitement des **mutations**. Cela assure que chaque état laisse un enregistrement traçable, et permette à des outils de mieux nous aider à comprendre 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** 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.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

idem pour acter

Copy link
Contributor Author

@MachinisteWeb MachinisteWeb May 19, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Petit exemple : nous croisons le mot « commit » faisant référence au commit de Github. Je regarde donc dans la documentation française par quoi cela est traduit. Les traducteurs ont pris le parti de conserver le terme « commit ». Nous utiliserons donc le mot « commit ». Nous croisons maintenant le mot commit pour Vuex. Se terme n'existe pas encore en français puisque nous sommes entrain de créer la version française. Nous décidons d'utiliser le verbe « acter », ce terme sera usuel pour « commit » dans la littérature française de Vue. Dois t-on pour autant en préciser le terme original à chaque fois ?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

l'intérêt de mettre state et commit entre parenthèse est pour faire le lien avec les vrai propriétés et qui sont dans les examples


### Le store le plus simple

> **NOTE:** Nous allons utiliser la syntaxe ES2015 dans les exemples de code pour le reste de la documentation. Si vous ne vous êtes pas encore penché dessus, [vous devriez](https://babeljs.io/docs/learn-es2015/) !

Après [avoir installé](installation.md) Vuex, nous allons créer un store. C'est assez simple — définissez juste un objet state initial et quelques mutations :
Après [avoir installé](installation.md) Vuex, nous allons créer un store. C'est assez simple ; définissez juste un objet d'état initial et quelques mutations :

``` js
// Make sure to call Vue.use(Vuex) first if using a module system
// Assurez vous d'appeler `Vuex.use(Vuex)` en premier lieu si vous utilisez un système de module

const store = new Vuex.Store({
state: {
Expand All @@ -27,18 +27,18 @@ const store = new Vuex.Store({
})
```

Maintenant, vous pouvez accéder à l'objet state avec `store.state`, et déclencher un changement de state avec la méthode `store.commit` :
Maintenant, vous pouvez accéder à l'objet d'état avec `store.state`, et déclencher un changement d'état avec la méthode `store.commit` :

``` js
store.commit('increment')

console.log(store.state.count) // -> 1
```

Encore une fois, la raison pour laquelle nous committons une mutation au lieu de modifier `store.state.count` directement, c'est parce que nous voulons le tracer explicitement. Cette simple convention rend votre intention plus explicite, ainsi vous pouvez raisonner plus facilement les changements de state en lisant votre code. De plus, cela nous donne l'opportunité d'implémenter des outils qui peuvent enregistrer chaque mutation, prendre des instantanés du state, ou même procéder à du debugging dans le temps.
Encore une fois, la raison pour laquelle nous actons une mutation au lieu de modifier `store.state.count` directement, c'est parce que nous voulons le tracer explicitement. Cette simple convention rend votre intention plus explicite, ainsi vous pouvez raisonner plus facilement les les changements d'état en lisant votre code. De plus, cela nous donne l'opportunité d'implémenter des outils qui peuvent enregistrer chaque mutation, prendre des instantanés de l'état, ou même procéder à de la visualisation d'état dans le temps.

Utiliser le state du store dans un composant implique simplement de retourner le state dans une *computed property*, car le state du store est réactif. Déclencher des changements signifie simplement commiter des mutations dans les méthodes du composant.
Utiliser l'état du store dans un composant implique simplement de retourner l'état dans une *propriété calculée*, car l'état du store est réactif. Déclencher des changements signifie simplement d'acter des mutations dans les méthodes du composant.

Voici un exemple de la [plus basique app Vuex de compteur](https://jsfiddle.net/n9jmu5v7/341/).
Voici un exemple de l'[application de comptage Vuex la plus basique](https://jsfiddle.net/n9jmu5v7/341/).

Ensuite, nous allons examiner chaque concept de base plus en détails, et commençons avec le [State](state.md).
Ensuite, nous allons examiner chaque concept de base plus en détails, et commençons avec l'[État](state.md).
44 changes: 21 additions & 23 deletions docs/fr/intro.md
Original file line number Diff line number Diff line change
@@ -1,20 +1,20 @@
# Qu'est-ce que Vuex ?
# Vuex, qu'est-ce que c'est ?

Vuex est un ***state management pattern* et une bibliothèque** pour des applications Vue.js. Il sert de store centralisé pour tous les composants dans une application, avec des règles pour s'assurer que l'état ne peut subir des mutations que d'une manière prévisible. Il s'intègre également avec [l'extension officielle](https://github.com/vuejs/vue-devtools) de Vue afin de fournir des fonctionnalités avancées comme voir l'état dans le temps et débugger sans configuration, ainsi que de prendre des instantanés, importer et exporter l'état.
Vuex est un **_gestionnaire d'état (« state management pattern »)_ et une bibliothèque** pour des applications Vue.js. Il sert de zone de stockage de données centralisée pour tous les composants dans une application, avec des règles pour s'assurer que l'état ne puisse subir de mutations que d'une manière prévisible. Il s'intègre également avec [l'extension officielle](https://github.com/vuejs/vue-devtools) de Vue afin de fournir des fonctionnalités avancées comme de la visualisation d'état dans le temps et des exports et imports d’instantanés (« snapshot ») d'état.

### Qu'est-ce qu'un "State Management Pattern"?
### Un « gestionnaire d'état », qu'est-ce que c'est ?

Commençons avec une simple application Vue de compteur :
Commençons par une simple application de comptage avec Vue :

``` js
new Vue({
// state
// état
data () {
return {
count: 0
}
},
// view
// vue
template: `
<div>{{ count }}</div>
`,
Expand All @@ -27,39 +27,37 @@ new Vue({
})
```

C'est une app auto-contenue avec les parties suivantes :
C'est une application auto-suffisante avec les parties suivantes :

- L'**État** (_state_), qui est la source de vérité qui dirige notre app;
- La **Vue** (_view_), qui est juste un mapping déclaratif du **state**;
- Les **actions**, qui sont les façons possibles pour le state de changer en réaction aux actions de l'utilisateur depuis la **vue**.
- L'**état**, qui est la source de vérité qui pilotant votre application,
- La **vue**, qui est une réflexion déclarative de l'**état**,
- Les **actions**, qui sont les façons possibles pour l'état de changer en réaction aux actions utilisateurs depuis la **vue**.

Voici une représentation extrèmement simple du concept de "one-way data flow" (_flux de données unidirectionnel_) :
Voici une représentation extrèmement simple du concept de « flux de donnée unidirectionnel » :

<p style="text-align: center; margin: 2em">
<img style="max-width:450px;" src="./images/flow.png">
</p>

Cependant, la simplicité s'évapore rapidement lorsque nous avons **de multiples composants qui partagent le même state** :
Cependant, la simplicité s'évapore rapidement lorsque nous avons **de multiples composants qui partagent un même état global** :

- Plusieurs vues peuvent dépendre de la même partie du state.
- Des actions dans différentes vues peuvent avoir besoin de muter la même partie du state.
- Plusieurs vues peuvent dépendre de la même partie de l'état global.
- Des actions dans différentes vues peuvent avoir besoin de muter la même partie de l'état global.

Pour le premier problème, passer des propriétés peut être fastidieux pour les composants profondément imbriqués, et ça ne fonctionne tout simplement pas pour les composants d'un même parent. Pour le deuxième problème, on se retrouve souvent à se rabattre sur des solutions telles qu'accéder aux références d'instance du parent/enfant direct ou essayer de muter et synchroniser de multiples copies du state via des events. Ces deux patterns sont fragiles et posent rapidement des problèmes de maintenabilité du code.
Pour le premier problème, passer des props peut être fastidieux pour les composants profondément imbriqués, et ça ne fonctionne tout simplement pas pour les composants d'un même parent. Pour le deuxième problème, on se retrouve souvent à se rabattre sur des solutions telles qu'accéder aux références d'instance du parent/enfant direct ou essayer de muter et synchroniser de multiples copies de l'état via des évènements. Ces deux modèles sont fragiles et posent rapidement des problèmes de maintenabilité du code.

Alors pourquoi ne pas extraire le state partagé des composants, et le gérer dans un singleton global ? De cette manière, notre arbre de composant devient une grosse "view", et n'importe-quel composant peut accéder au state ou déclencher des actions, peu importe où il se trouve dans l'arbre !
Alors pourquoi ne pas extraire l'état global partagé des composants, et le gérer dans un singleton global ? De cette manière, notre arbre de composant devient une grosse « vue », et n'importe quel composant peut accéder à l'état global ou déclencher des actions, peu importe où il se trouve dans l'arbre !

De plus, en définissant et en séparant les concepts impliqués dans la gestion d'un state et en appliquant certaines règles, on donne aussi une structure et une maintenabilité à notre code.
De plus, en définissant et en séparant les concepts impliqués dans la gestion de l'état global et en appliquant certaines règles, on donne aussi une structure et une maintenabilité à notre code.

Voilà l'idée de base derrière Vuex, inspiré par [Flux](https://facebook.github.io/flux/docs/overview.html), [Redux](http://redux.js.org/) et [l'Architecture Elm](https://guide.elm-lang.org/architecture/). À l'inverse des autres patterns, Vuex est aussi une bibliothèque d'implémentation conçue spécialement pour Vue.js afin de bénéficier de son système de réactivité granulaire pour des modifications efficaces.
Voilà l'idée de base derrière Vuex, inspiré par [Flux](https://facebook.github.io/flux/docs/overview.html), [Redux](http://redux.js.org/) et [l'architecture Elm](https://guide.elm-lang.org/architecture/). À l'inverse des autres modèles, Vuex est aussi une bibliothèque d'implémentation conçue spécialement pour Vue.js afin de bénéficier de son système de réactivité granulaire pour des modifications efficaces.

![vuex](./images/vuex.png)

### Quand l'utiliser ?

Bien que Vuex nous aide à gérer une state partagé, il apporte aussi le coût de nouveaux concepts et _boilerplate_. 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 _cas d'utilisation pré-conçu_. C'est un compromis entre la productivité à court terme et à long terme.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

boilerplate entre parantheses me semble une bonne idee vu le mot traduit 😄

Copy link
Contributor Author

@MachinisteWeb MachinisteWeb May 19, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Là nous sommes dans le cas suivant : « Si le terme traduit ne reflète pas assez ce qu'il signifiait en anglais, nous ajoutons la version originale entre parenthèse après pour lever l’ambiguïté. »

Aussi cela peut-être intéressant de préciser (« boilerplate ») même si fondamentalement je ne suis pas sur que ça ajoute « du sens » à la phrase. Tu n'aurais pas une meilleure alternative pour « boilerplate » dans ce contexte @posva ?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Je n'ai pas d'autre mot, mais c'est la première fois que je vois cas d'utilisation pré-conçu et personne dans mon entourage connaît ce mot ou préfère largement le mot Boilerplate qui parle à tout le monde

Copy link
Contributor Author

@MachinisteWeb MachinisteWeb May 19, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tu as l'air de t'en amuser :)

Je t'assure que « boilerplate » ne voulait rien dire pour moi petit français quand je l'ai croisé dans la documentation.

Peut-être « abstraction de code » ? C'est bien ce que ça veut dire non ? On abstrait du code dans un « package » tout prêt pour nous éviter d'avoir à comprendre ce qu'il y a dedans ?

Proposition :

abstraction de code (« boilerplate »)

Le truc avec les cadors en anglais c'est que pour eux tout devrait être anglais. Je ne traduis pas la documentation de Vue pour faire plaisir aux anglophones. Cependant si la prochaine fois qu'un français croise le mot « boilerplate » il peut se dire « ah ouais c'est une abstraction de code » j'avais vu ça entre parenthèse sur Vue, je serais content :)

Idem donc pour tes propositions de état (« state ») et acter (« commit »).


Si vous n'avez jamais créé une _Single Page Application_ à grande échelle et que vous sautez directement dans Vuex, cela peut paraître verbeux et intimidant. C'est parfaitement normal &mdash; si votre application est simple, vous vous en sortirez sans doute très bien sans Vuex. Un simple [bus d'event global](http://vuejs.org/guide/components.html#Non-Parent-Child-Communication) pourrait très bien vous suffire. Mais si vous devez créer une SPA à moyenne ou grande échelle, il y a des chances que vous vous trouviez dans des situations qui vous feront penser à une meilleure façon de gérer le state en-dehors 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 [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 :

> Flux libraries are like glasses: you’ll know when you need them.
>
> _Les librairies Flux, c'est comme les lunettes : vous saurez quand vous en aurez besoin._
> « Les librairies Flux, c'est comme les lunettes : vous saurez quand vous en aurez besoin. »