Traduction du Guide de style #105

MachinisteWeb · 2017-10-09T10:04:19Z

Je me lance dans la traduction du Guide de style.

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

MachinisteWeb · 2017-10-09T10:05:00Z

Je vais nommer cette partie « Conventions » en français car le mot « Guide » est déjà utilisé et qu'un Guide de style se réfère, en français, au « style » graphique. On ne parle pas de « style de codage » même si ça se comprend aisément mais de « Conventions de codage »

Et ici le mot Guide n'est plus utile (et ne ferra pas doublons avec le « Guide ») principal.

Des alternatives ?

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

MachinisteWeb · 2017-10-09T10:21:08Z

Quelqu'un a une traduction pour bikeshedding ?

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

forresst · 2017-10-09T12:39:05Z

bike shed => garage à vélo
https://fr.wikipedia.org/wiki/Loi_de_futilit%C3%A9_de_Parkinson

Je pense donc à "futilité". Mais c'est un début, à débattre

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

MachinisteWeb · 2017-10-31T16:47:33Z

Monsieurs, faites vos jeux ! J'ai refait une passe rapide mais vos yeux seront plus utiles que les miens.

rspt · 2017-10-31T20:33:12Z

src/v2/style-guide/index.md


-This is the official style guide for Vue-specific code. If you use Vue in a project, it's a great reference to avoid errors, bikeshedding, and anti-patterns. However, we don't believe that any style guide is ideal for all teams or projects, so mindful deviations are encouraged based on past experience, the surrounding tech stack, and personal values.
+Ceci est le guide des conventions officielles pour du code spécifique à Vue. Si vous utilisez Vue dans vos projets, c'est la référence pour éviter les erreurs, les mauvaises décisions ou les mauvais usage de code. Nous ne pensons cependant pas qu'un guide de conventions soit pertinent pour toutes les équipes ou tous les projets. Ce que nous encourageons ici est basé sur nos expériences passées, les technologies que nous côtoyons ainsi que nos valeurs personnelles.


"les mauvais usages"

En rapport à bikeshedding, => chipotage / pinaillage / tatillonnage

rspt · 2017-10-31T20:33:43Z

src/v2/style-guide/index.md


-For the most part, we also avoid suggestions about JavaScript or HTML in general. We don't mind whether you use semicolons or trailing commas. We don't mind whether your HTML uses single-quotes or double-quotes for attribute values. Some exceptions will exist however, where we've found that a particular pattern is helpful in the context of Vue.
+Nous allons en grande partie éviter les conventions à propos du JavaScript ou du HTML en eux-même. Nous ne nous soucions pas de votre utilisation des points-virgules ou de la place de la virgule en début de ligne. Nous ne nous soucierons pas non plus de savoir si votre HTML utilise des apostrophes ou des guillemets pour les valeurs des attributs. Quelques exceptions seront faites cependant, quand nous trouvons qu'une utilisation de code spécifique est utile dans le contexte de Vue.


"eux-mêmes" -> Invariable

J'aurais gardé suggestions pour la traduction, au lieu de conventions ? Ou proposition.

rspt · 2017-10-31T20:34:56Z

src/v2/style-guide/index.md


-These rules help prevent errors, so learn and abide by them at all costs. Exceptions may exist, but should be very rare and only be made by those with expert knowledge of both JavaScript and Vue.
+Ces règles aident à éviter les erreurs, donc apprenez les et respectez les à tout prix. Des exceptions peuvent exister, mais elles devraient être rares et prises uniquement avec un œil expert sur le JavaScript et Vue.


"apprenez-les"

"respectez-les"

rspt · 2017-10-31T20:35:22Z

src/v2/style-guide/index.md


-These rules have been found to improve readability and/or developer experience in most projects. Your code will still run if you violate them, but violations should be rare and well-justified.
+Ces règles ont été établies pour améliorer la lisibilité et / ou l'expérience des développeurs dans la majorité des projets. Votre code fonctionnera toujours si vous ne les suivez pas, mais ces écarts doivent être rares et justifiés.


"et/ou" selon moi

Actuellement, partout dans la documentation les choix multiples sont séparé par des espaces. Je sais pas si c'est la convention. Pour le moment je laisse comme ça.

Ok. Je serais plus pour le changer je t'avoue mais laissons comme ça :)

rspt · 2017-10-31T20:35:36Z

src/v2/style-guide/index.md


-Where multiple, equally good options exist, an arbitrary choice can be made to ensure consistency. In these rules, we describe each acceptable option and suggest a default choice. That means you can feel free to make a different choice in your own codebase, as long as you're consistent and have a good reason. Please do have a good reason though! By adapting to the community standard, you will:
+Là où de multiples et équivalentes options existes, un choix arbitraire a été fait pour assurer la consistance. Dans ces règles, nous décrivons chaque option acceptable et suggérons un choix par défaut. Cela signifie que vous pouvez faire des choix différent sur votre propre base de code, aussi longtemps que vous êtes cohérent et avez de bonnes raisons. Mais gardez toujours les bonnes raisons à l'esprit ! En vous alignant sur les standards de la communauté vous :


"options existent"

"des choix différents"

rspt · 2017-10-31T21:47:08Z

src/v2/style-guide/index.md


-Prefer class selectors over element selectors in `scoped` styles, because large numbers of element selectors are slow.
+Préférez les sélecteurs de classes plutôt que les sélecteurs de nom dans des styles `scoped` car utiliser un large nombre de sélecteur par nom de balise est lent.


"de sélecteurs par nom"

rspt · 2017-10-31T21:47:36Z

src/v2/style-guide/index.md

 </summary>
 {% endraw %}

-To scope styles, Vue adds a unique attribute to component elements, such as `data-v-f3f3eg9`. Then selectors are modified so that only matching elements with this attribute are selected (e.g. `button[data-v-f3f3eg9]`).
+Dans les styles avec portée, Vue ajoute un attribut unique à l'élément du composant, comme `data-v-f3f3eg9`. Quand les sélecteurs sont modifiés ils ne concordent que avec les éléments avec l'attribut en question (par ex. `button[data-v-f3f3eg9]`).


"Quand les sélecteurs sont modifiés, ils ne concordent qu'avec"

rspt · 2017-10-31T21:48:13Z

src/v2/style-guide/index.md


-An ideal Vue application is props down, events up. Sticking to this convention makes your components much easier to understand. However, there are edge cases where prop mutation or `this.$parent` can simplify two components that are already deeply coupled.
+Une application Vue idéale est une application où les props descendent et où les évènements remontent. Rester dans cette convention rend vos composants plus simple à comprendre. Cependant, il y a quelques cas où la mutation des props ou `this.$parent` peut simplifier l'utilisation de deux composants qui sont fortement couplés.


"vos composants plus simples à"

rspt · 2017-10-31T21:49:00Z

src/v2/style-guide/index.md

@@ -1723,16 +1723,16 @@ Vue.component('TodoItem', {



-### Non-flux state management <sup data-p="d">use with caution</sup>
+### Non gestion de l'état par flux <sup data-p="d">faire attention</sup>


"Non-gestion de"

rspt · 2017-10-31T21:49:09Z

src/v2/style-guide/index.md


-Managing state on `this.$root` and/or using a [global event bus](https://vuejs.org/v2/guide/migration.html#dispatch-and-broadcast-replaced) can be convenient for very simple cases, but are not appropriate for most applications. Vuex offers not only a central place to manage state, but also tools for organizing, tracking, and debugging state changes.
+Gérer l'état avec `this.$root` et / ou utiliser un [canal d'évènement global](https://fr.vuejs.org/v2/guide/migration.html#dispatch-et-broadcast-remplaces) peut faciliter la tâche dans des cas vraiment simple. Cependant cela n'est pas approprié pour la plupart des applications. Vuex n'offre pas seulement une place centrale pour gérer l'état mais également des outils pour organiser, tracer et déboguer les changements d'états.


dans des cas vraiment simples

mdartic · 2017-11-02T08:46:57Z

Pour le mot bikeshedding, je le traduirais en chipotage, pinaillage, mais je ne suis pas sûr que ce soit un français correct.

cf http://catb.org/jargon/html/B/bikeshedding.html

L'idée que je retiens de cette définition, c'est qu'on s'occuperait à discuter d'éléments insignifiants, donc ce guide / ces conventions sont pratiques pour éviter de perdre du temps sur ces sujets...

MachinisteWeb · 2017-11-02T10:35:28Z

Je comprends l'idée.

Je vais mettre « les discussions futiles ». Qu'en pensez vous ?

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

forresst

Quelques erreurs, mais dans dans l'ensemble c'est du super boulot !!!!!

forresst · 2017-11-02T10:58:39Z

src/v2/style-guide/index.md


-Finally, we've split rules into four categories:
+Et donc, voici les quatre catégories de règles que nous avons retenues :


Et donc, voici les quatre catégories de règles que nous avons retenues : => Et donc, nous avons divisé les règles en quatre catégories:

C'est une proposition plus claire, plus concise et plus en adéquation avec l'originale

forresst · 2017-11-02T11:01:30Z

src/v2/style-guide/index.md


-These rules help prevent errors, so learn and abide by them at all costs. Exceptions may exist, but should be very rare and only be made by those with expert knowledge of both JavaScript and Vue.
+Ces règles aident à éviter les erreurs, donc apprenez-les et respectez-les à tout prix. Des exceptions peuvent exister, mais elles devraient être rares et prises uniquement avec un œil expert sur le JavaScript et Vue.


rares et prises uniquement avec un œil expert sur le JavaScript et Vue. => rares et seulement faites par ceux qui ont une connaissance experte à la fois de JavaScript et de Vue.

forresst · 2017-11-02T11:57:29Z

src/v2/style-guide/index.md

-// It's OK to use an object directly in a root
-// Vue instance, since only a single instance
-// will ever exist.
+// Par contre l'utilisation par objet est possible dans


Par contre l'utilisation par objet est possible dans => Par contre l'utilisation directe d'un ~~par~~ objet est possible dans

correspond plus à l'original

forresst · 2017-11-02T12:00:20Z

src/v2/style-guide/index.md

- They document the API of the component, so that it's easy to see how the component is meant to be used.
- In development, Vue will warn you if a component is ever provided incorrectly formatted props, helping you catch potential sources of error.
+- Elles documentent l'API du composant, il est ainsi possible de voir comment le composant est prévu d'être utilisé.
+- En développement, Vue vous avertira si le composant fournit un type de prop incorrectement formaté et vous aidant ainsi à trouver des sources d'erreur.


ainsi à trouver des sources d'erreur. => ainsi à trouver des sources potentielles d'erreur.

forresst · 2017-11-02T12:02:14Z

src/v2/style-guide/index.md

      }
    ]
  }
 }
 ```

-Then you sort them alphabetically. When updating the DOM, Vue will optimize rendering to perform the cheapest DOM mutations possible. That might mean deleting the first todo element, then adding it again at the end of the list.
+Puis nous les trions par ordre alphabétique. Quand le DOM est mis à jour, Vue va optimiser le rendu en exécutant les mutations les moins couteuses possibles dans le DOM. Cela signifie de supprimer le premier élément de la liste, puis de l'ajouter de nouveau à la fin de la liste.


Vue va optimiser le rendu => Vue optimisera le rendu

forresst · 2017-11-02T12:29:18Z

src/v2/style-guide/index.md

- `<MyComponent>` is more visually distinct from a single-word HTML element than `<my-component>`, because there are two character differences (the two capitals), rather than just one (a hyphen).
- If you use any non-Vue custom elements in your templates, such as a web component, PascalCase ensures that your Vue components remain distinctly visible.
+- Les éditeurs peuvent automcompléter un nom de composant dans les templates car la PascalCase est également utilisée en JavaScript.
+- `<MyComponent>` est visuellement plus distinct qu'un élément HTML d'un seul mot comme `<my-component>` car il y a deux caractères de différenciation (les deux capitales) plutôt que juste un (l'hyphène).


l'hyphène => le trait d'union

le trait d'union me parle plus

forresst · 2017-11-02T12:30:30Z

src/v2/style-guide/index.md


-**Component names in JS/[JSX](../guide/render-function.html#JSX) should always be PascalCase, though they may be kebab-case inside strings for simpler applications that only use global component registration through `Vue.component`.**
+**Les noms de composant en JS / [JSX](../guide/render-function.html#JSX) devrait toujours être en PascalCase, cependant ils peuvent être en kebab-case à l'intérieur des chaines de caractères pour de simples applications qui utilise seulement des composants globaux avec `Vue.component`.**


devrait => devraient
utilise = > utilisent

forresst · 2017-11-02T12:32:22Z

src/v2/style-guide/index.md

- It's rare that global components are ever referenced in JavaScript, so following a convention for JavaScript makes less sense.
- These applications always include many in-DOM templates, where [kebab-case **must** be used](#Component-name-casing-in-templates-strongly-recommended).
+- Il est rare que les composants globaux soient référencés en JavaScript, donc suivre les conventions du JavaScript a moins de sens.
+- Ces applications inclus beaucoup de templates depuis le DOM, ou là [kebab-case **doit** être utilisée](#Casse-des-noms-de composant-dans-les-templates-fortement-recommande).


inclus => incluent
ou là => où la

(#Casse-des-noms-de composant-dans-les-templates-fortement-recommande) => (#Casse-des-noms-de-composant-dans-les-templates-fortement-recommande)

il manque un trait d'union, je pense que le lien ne fonctionne pas

forresst · 2017-11-02T12:35:27Z

src/v2/style-guide/index.md

@@ -1014,14 +1015,14 @@ export default {



-### Full-word component names <sup data-p="b">strongly recommended</sup>
+### Nom de composant à nom complet <sup data-p="b">fortement recommandé</sup>


Nom de composant avec mot complet

forresst · 2017-11-02T12:36:11Z

src/v2/style-guide/index.md


-**Component names should prefer full words over abbreviations.**
+**Les noms de composant devraient préférer des noms complets à des abréviations.**


des mots complets

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

MachinisteWeb · 2017-11-02T13:45:37Z

Merci @forresst pour tout tes retours ! C'est dans la boîte !

mdartic

Super boulot @haeresis
J'ai essayé d'être constructif dans mes propositions, mais sens toi libre de les prendre / modifier / refuser !

mdartic · 2017-11-02T11:06:52Z

src/v2/style-guide/index.md


-For the most part, we also avoid suggestions about JavaScript or HTML in general. We don't mind whether you use semicolons or trailing commas. We don't mind whether your HTML uses single-quotes or double-quotes for attribute values. Some exceptions will exist however, where we've found that a particular pattern is helpful in the context of Vue.
+Nous allons en grande partie éviter les conventions à propos du JavaScript ou du HTML en eux-même. Nous ne nous soucions pas de votre utilisation des points-virgules ou de la place de la virgule en début de ligne. Nous ne nous soucierons pas non plus de savoir si votre HTML utilise des apostrophes ou des guillemets pour les valeurs des attributs. Quelques exceptions seront faites cependant, quand nous trouvons qu'une utilisation de code spécifique est utile dans le contexte de Vue.


J'aurais gardé suggestions pour la traduction, au lieu de conventions ? Ou proposition.

mdartic · 2017-11-02T11:11:16Z

src/v2/style-guide/index.md


-### Priority A: Essential
+### Priorité A : essentiel


Essentielle ? Il s'agit d'une catégorie ?
Je respecterai aussi la casse, il utilise une maj => on utilise une maj ?

mdartic · 2017-11-02T11:11:50Z

src/v2/style-guide/index.md


-### Priority B: Strongly Recommended
+### Priorité B : fortement recommandée


Ah, là c'est accordé au féminin => du coup on est d'accord sur l'accord :-) ?

mdartic · 2017-11-02T13:04:16Z

src/v2/style-guide/index.md


-Some features of Vue exist to accommodate rare edge cases or smoother migrations from a legacy code base. When overused however, they can make your code more difficult to maintain or even become a source of bugs. These rules shine a light on potentially risky features, describing when and why they should be avoided.
+Certaines fonctionnalités de Vue existent pour régler des cas exceptionnels ou rendre la migration d'une vieille version de code plus simple. Mais utiliser sans parcimonie, elles rendront votre code difficile à maintenir et même deviendront une source de bogues. Ces règles mettent en lumière des fonctionnalités potentiellement risquées, décrivant quand et pourquoi elles doivent être évitées.


Mais utiliser sans parcimonie => Mais utilisées avec excès

sans parcimonie => avec excès ?

me paraîtrait plus simple / commun à la compréhension ?
à accorder néanmoins pour utilisées

je prends ;)

mdartic · 2017-11-02T14:02:24Z

src/v2/style-guide/index.md

@@ -106,9 +106,9 @@ data: {
 }
 ```

-We might want to reuse this component, allowing users to maintain multiple lists (e.g. for shopping, wishlists, daily chores, etc). There's a problem though. Since every instance of the component references the same data object, changing the title of one list will also change the title of every other list. The same is true for adding/editing/deleting a todo.
+Nous voudrions réutiliser ce composant pour permettre aux utilisateurs de maintenir plusieurs listes (par ex. une liste de course, une liste de souhait, une liste de tâche, etc.). Il y a cependant un problème. Comme toutes les instances du composant font référence au même objet de donnée, changer le titre de l'une des listes va aussi changer le titre de toutes les autres. Et c'est également vrai pour l'ajout, l'édition ou la suppression dans la liste.


Nous voudrions => nous pourrions vouloir ?

Et c'est également vrai pour l'ajout, l'édition ou la suppression d 'un élément de la liste ?

mdartic · 2017-11-02T21:43:16Z

src/v2/style-guide/index.md


-Prefer class selectors over element selectors in `scoped` styles, because large numbers of element selectors are slow.
+Préférez les sélecteurs de classes plutôt que les sélecteurs de nom dans des styles `scoped` car utiliser un large nombre de sélecteurs par nom de balise est lent.


un large nombre => un nombre important ?

mdartic · 2017-11-02T21:44:53Z

src/v2/style-guide/index.md

 </summary>
 {% endraw %}

-To scope styles, Vue adds a unique attribute to component elements, such as `data-v-f3f3eg9`. Then selectors are modified so that only matching elements with this attribute are selected (e.g. `button[data-v-f3f3eg9]`).
+Dans les styles avec portée, Vue ajoute un attribut unique à l'élément du composant, comme `data-v-f3f3eg9`. Quand les sélecteurs sont modifiés, ils ne concordent qu'avec les éléments avec l'attribut en question (par ex. `button[data-v-f3f3eg9]`).


Les sélecteurs sont ainsi modifiés afin qu'ils ne concordent qu'avec les éléments dont l'attribut est sélectionné.

mdartic · 2017-11-02T21:46:51Z

src/v2/style-guide/index.md


-**Props and events should be preferred for parent-child component communication, instead of `this.$parent` or mutating props.**
+**Les évènements et props devraient être préférés pour la communication entre composants parent-enfant, au lieu de l'utilisation de `this.$parent` ou les props mutées.**


au lieu de l'utilisation de this.$parent ou la mutation des props

mdartic · 2017-11-02T21:48:29Z

src/v2/style-guide/index.md


-The problem is, there are also many _simple_ cases where these patterns may offer convenience. Beware: do not be seduced into trading simplicity (being able to understand the flow of your state) for short-term convenience (writing less code).
+Le problème est qu'il y a beaucoup de _cas simples_ où leur utilisation offre de la facilité. Attention : ne vous laissez pas séduire par la simplicité (rester capable de comprendre le flux de votre état) par l'utilisation de code plus simple (plus court).


Attention: ne vous laissez pas séduire par une [apparente] simplicité (être capable de comprendre le flux de votre état) pour une vision court-termiste (écrire moins de code).

pas sûr de apparente

mdartic · 2017-11-02T21:55:22Z

src/v2/style-guide/index.md


-Managing state on `this.$root` and/or using a [global event bus](https://vuejs.org/v2/guide/migration.html#dispatch-and-broadcast-replaced) can be convenient for very simple cases, but are not appropriate for most applications. Vuex offers not only a central place to manage state, but also tools for organizing, tracking, and debugging state changes.
+Gérer l'état avec `this.$root` et / ou utiliser un [canal d'évènement global](https://fr.vuejs.org/v2/guide/migration.html#dispatch-et-broadcast-remplaces) peut faciliter la tâche dans des cas vraiment simple. Cependant cela n'est pas approprié pour la plupart des applications. Vuex n'offre pas seulement une place centrale pour gérer l'état mais également des outils pour organiser, tracer et déboguer les changements d'états.


dans des cas vraiment simples

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

MachinisteWeb · 2017-11-03T15:58:34Z

Merci @mdartic pour tes retours ! C'est dans la boite !

mdartic

Ma dernière contrib' mais je valide :-)
Merci pour ta super trad° !

mdartic · 2017-11-03T20:07:53Z

src/v2/style-guide/index.md

@@ -106,7 +106,7 @@ data: {
 }
 ```

-Nous voudrions réutiliser ce composant pour permettre aux utilisateurs de maintenir plusieurs listes (par ex. une liste de course, une liste de souhait, une liste de tâche, etc.). Il y a cependant un problème. Comme toutes les instances du composant font référence au même objet de donnée, changer le titre de l'une des listes va aussi changer le titre de toutes les autres. Et c'est également vrai pour l'ajout, l'édition ou la suppression dans la liste.
+nous pourrions vouloir réutiliser ce composant pour permettre aux utilisateurs de maintenir plusieurs listes (par ex. une liste de course, une liste de souhait, une liste de tâche, etc.). Il y a cependant un problème. Comme toutes les instances du composant font référence au même objet de donnée, changer le titre de l'une des listes va aussi changer le titre de toutes les autres. Et c'est également vrai pour l'ajout, l'édition ou la suppression dans la liste.


petite majuscule pour le 'nous'

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

Traduction du Guide de style

d2f7c7b

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

MachinisteWeb added the Traduction en cours label Oct 9, 2017

MachinisteWeb self-assigned this Oct 9, 2017

Usage of bikeshedding

8f3ad0c

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

MachinisteWeb mentioned this pull request Oct 9, 2017

Pages en cours de traduction #3

Open

MachinisteWeb added 2 commits October 9, 2017 13:46

Nom de composant multiples mots

7c3cc86

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

capitale -> essentiel

3bda18c

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

MachinisteWeb added 8 commits October 9, 2017 18:24

Props part done

955ea9d

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

In progress

51dec6c

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

Partie A de style-guide/index.md faites !

694851f

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

Merge branch 'master' into styleguide

b99bc43

Priority B done

edcbd91

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

Styleguide traduit !

c1903f2

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

Fix line number

2ac2915

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

Relecture Bruno

40de6e7

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

MachinisteWeb added Relecture nécessaire and removed Traduction en cours labels Oct 31, 2017

MachinisteWeb requested review from forresst, yann-yinn, sylvainpolletvillard, atinux, darenju, mdartic, Kocal and rspt October 31, 2017 16:47

rspt suggested changes Oct 31, 2017

View reviewed changes

MachinisteWeb added 2 commits November 2, 2017 11:35

Revue de @rspt

10f79ea

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

fix typo

728d61c

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

rspt approved these changes Nov 2, 2017

View reviewed changes

forresst requested changes Nov 2, 2017

View reviewed changes

Revue de @ForrestT !

0fc9ac4

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

forresst approved these changes Nov 2, 2017

View reviewed changes

mdartic requested changes Nov 2, 2017

View reviewed changes

MachinisteWeb added 2 commits November 3, 2017 16:54

Revue de mdartic

86daed9

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

Remove extra line

d00dea8

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

mdartic approved these changes Nov 3, 2017

View reviewed changes

MachinisteWeb added 2 commits November 4, 2017 09:46

Fix typo

c7426df

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

Correct line numbers

da25e53

Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com>

MachinisteWeb merged commit 9f26827 into master Nov 6, 2017

MachinisteWeb deleted the styleguide branch November 6, 2017 10:22


		This is the official style guide for Vue-specific code. If you use Vue in a project, it's a great reference to avoid errors, bikeshedding, and anti-patterns. However, we don't believe that any style guide is ideal for all teams or projects, so mindful deviations are encouraged based on past experience, the surrounding tech stack, and personal values.
		Ceci est le guide des conventions officielles pour du code spécifique à Vue. Si vous utilisez Vue dans vos projets, c'est la référence pour éviter les erreurs, les mauvaises décisions ou les mauvais usage de code. Nous ne pensons cependant pas qu'un guide de conventions soit pertinent pour toutes les équipes ou tous les projets. Ce que nous encourageons ici est basé sur nos expériences passées, les technologies que nous côtoyons ainsi que nos valeurs personnelles.


		For the most part, we also avoid suggestions about JavaScript or HTML in general. We don't mind whether you use semicolons or trailing commas. We don't mind whether your HTML uses single-quotes or double-quotes for attribute values. Some exceptions will exist however, where we've found that a particular pattern is helpful in the context of Vue.
		Nous allons en grande partie éviter les conventions à propos du JavaScript ou du HTML en eux-même. Nous ne nous soucions pas de votre utilisation des points-virgules ou de la place de la virgule en début de ligne. Nous ne nous soucierons pas non plus de savoir si votre HTML utilise des apostrophes ou des guillemets pour les valeurs des attributs. Quelques exceptions seront faites cependant, quand nous trouvons qu'une utilisation de code spécifique est utile dans le contexte de Vue.


		These rules help prevent errors, so learn and abide by them at all costs. Exceptions may exist, but should be very rare and only be made by those with expert knowledge of both JavaScript and Vue.
		Ces règles aident à éviter les erreurs, donc apprenez les et respectez les à tout prix. Des exceptions peuvent exister, mais elles devraient être rares et prises uniquement avec un œil expert sur le JavaScript et Vue.


		These rules have been found to improve readability and/or developer experience in most projects. Your code will still run if you violate them, but violations should be rare and well-justified.
		Ces règles ont été établies pour améliorer la lisibilité et / ou l'expérience des développeurs dans la majorité des projets. Votre code fonctionnera toujours si vous ne les suivez pas, mais ces écarts doivent être rares et justifiés.


		Where multiple, equally good options exist, an arbitrary choice can be made to ensure consistency. In these rules, we describe each acceptable option and suggest a default choice. That means you can feel free to make a different choice in your own codebase, as long as you're consistent and have a good reason. Please do have a good reason though! By adapting to the community standard, you will:
		Là où de multiples et équivalentes options existes, un choix arbitraire a été fait pour assurer la consistance. Dans ces règles, nous décrivons chaque option acceptable et suggérons un choix par défaut. Cela signifie que vous pouvez faire des choix différent sur votre propre base de code, aussi longtemps que vous êtes cohérent et avez de bonnes raisons. Mais gardez toujours les bonnes raisons à l'esprit ! En vous alignant sur les standards de la communauté vous :


		Prefer class selectors over element selectors in `scoped` styles, because large numbers of element selectors are slow.
		Préférez les sélecteurs de classes plutôt que les sélecteurs de nom dans des styles `scoped` car utiliser un large nombre de sélecteur par nom de balise est lent.


		An ideal Vue application is props down, events up. Sticking to this convention makes your components much easier to understand. However, there are edge cases where prop mutation or `this.$parent` can simplify two components that are already deeply coupled.
		Une application Vue idéale est une application où les props descendent et où les évènements remontent. Rester dans cette convention rend vos composants plus simple à comprendre. Cependant, il y a quelques cas où la mutation des props ou `this.$parent` peut simplifier l'utilisation de deux composants qui sont fortement couplés.

		@@ -1723,16 +1723,16 @@ Vue.component('TodoItem', {



		### Non-flux state management <sup data-p="d">use with caution</sup>
		### Non gestion de l'état par flux <sup data-p="d">faire attention</sup>


		Managing state on `this.$root` and/or using a [global event bus](https://vuejs.org/v2/guide/migration.html#dispatch-and-broadcast-replaced) can be convenient for very simple cases, but are not appropriate for most applications. Vuex offers not only a central place to manage state, but also tools for organizing, tracking, and debugging state changes.
		Gérer l'état avec `this.$root` et / ou utiliser un [canal d'évènement global](https://fr.vuejs.org/v2/guide/migration.html#dispatch-et-broadcast-remplaces) peut faciliter la tâche dans des cas vraiment simple. Cependant cela n'est pas approprié pour la plupart des applications. Vuex n'offre pas seulement une place centrale pour gérer l'état mais également des outils pour organiser, tracer et déboguer les changements d'états.


		Finally, we've split rules into four categories:
		Et donc, voici les quatre catégories de règles que nous avons retenues :


		Component names in JS/[JSX](../guide/render-function.html#JSX) should always be PascalCase, though they may be kebab-case inside strings for simpler applications that only use global component registration through `Vue.component`.
		Les noms de composant en JS / [JSX](../guide/render-function.html#JSX) devrait toujours être en PascalCase, cependant ils peuvent être en kebab-case à l'intérieur des chaines de caractères pour de simples applications qui utilise seulement des composants globaux avec `Vue.component`.

		@@ -1014,14 +1015,14 @@ export default {



		### Full-word component names <sup data-p="b">strongly recommended</sup>
		### Nom de composant à nom complet <sup data-p="b">fortement recommandé</sup>


		Component names should prefer full words over abbreviations.
		Les noms de composant devraient préférer des noms complets à des abréviations.


		### Priority B: Strongly Recommended
		### Priorité B : fortement recommandée


		Some features of Vue exist to accommodate rare edge cases or smoother migrations from a legacy code base. When overused however, they can make your code more difficult to maintain or even become a source of bugs. These rules shine a light on potentially risky features, describing when and why they should be avoided.
		Certaines fonctionnalités de Vue existent pour régler des cas exceptionnels ou rendre la migration d'une vieille version de code plus simple. Mais utiliser sans parcimonie, elles rendront votre code difficile à maintenir et même deviendront une source de bogues. Ces règles mettent en lumière des fonctionnalités potentiellement risquées, décrivant quand et pourquoi elles doivent être évitées.


		Props and events should be preferred for parent-child component communication, instead of `this.$parent` or mutating props.
		Les évènements et props devraient être préférés pour la communication entre composants parent-enfant, au lieu de l'utilisation de `this.$parent` ou les props mutées.


		The problem is, there are also many _simple_ cases where these patterns may offer convenience. Beware: do not be seduced into trading simplicity (being able to understand the flow of your state) for short-term convenience (writing less code).
		Le problème est qu'il y a beaucoup de _cas simples_ où leur utilisation offre de la facilité. Attention : ne vous laissez pas séduire par la simplicité (rester capable de comprendre le flux de votre état) par l'utilisation de code plus simple (plus court).

Traduction du Guide de style #105

Traduction du Guide de style #105

Conversation

MachinisteWeb commented Oct 9, 2017

MachinisteWeb commented Oct 9, 2017

MachinisteWeb commented Oct 9, 2017

forresst commented Oct 9, 2017

MachinisteWeb commented Oct 31, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

mdartic commented Nov 2, 2017

MachinisteWeb commented Nov 2, 2017

forresst left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

MachinisteWeb commented Nov 2, 2017

mdartic left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

MachinisteWeb Nov 3, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

MachinisteWeb commented Nov 3, 2017

mdartic left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

MachinisteWeb commented Oct 31, 2017 •

edited

Loading

MachinisteWeb Nov 3, 2017 •

edited

Loading