From 019352b5fc5cbc4a795f2089095fa90093fbf70c Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Mon, 8 May 2017 17:43:34 +0200 Subject: [PATCH 1/4] Add fr translations for `essentials/getting-started.md` --- docs/en/SUMMARY.md | 2 +- docs/en/essentials/getting-started.md | 58 +++++++++++++-------------- 2 files changed, 30 insertions(+), 30 deletions(-) diff --git a/docs/en/SUMMARY.md b/docs/en/SUMMARY.md index 6f34288c7..16afdc856 100644 --- a/docs/en/SUMMARY.md +++ b/docs/en/SUMMARY.md @@ -6,7 +6,7 @@ - [Installation (En)](installation.md) - Essentiel - - [Pour commencer (En)](essentials/getting-started.md) + - [Pour commencer](essentials/getting-started.md) - [Dynamic Route Matching (En)](essentials/dynamic-matching.md) - [Nested Routes (En)](essentials/nested-routes.md) - [Programmatic Navigation (En)](essentials/navigation.md) diff --git a/docs/en/essentials/getting-started.md b/docs/en/essentials/getting-started.md index dcbf5d068..b57f75779 100644 --- a/docs/en/essentials/getting-started.md +++ b/docs/en/essentials/getting-started.md @@ -1,10 +1,10 @@ -# Getting Started (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Pour commencer -> We will be using [ES2015](https://github.com/lukehoban/es6features) in the code samples in the guide. +> Nous utiliserons [ES2015](https://github.com/lukehoban/es6features) dans les exemples de code dans ce guide. -Creating a Single-page Application with Vue.js + vue-router is dead simple. With Vue.js, we are already composing our application with components. When adding vue-router to the mix, all we need to do is map our components to the routes and let vue-router know where to render them. Here's a basic example: +Créer une application monopage avec Vue.js + vue-router est vraiment simple. Avec Vue.js, nous concevons déjà notre application avec des composants. En ajoutant vue-router dans notre application, tout ce qu'il nous reste à faire est de relier nos composants aux routes, et de laisser vue-router en faire le rendu. Voici un exemple de base : -> All examples will be using the standalone version of Vue to make template parsing possible. See more details [here](http://vuejs.org/guide/installation.html#Standalone-vs-Runtime-only-Build). +> Tous les exemples utiliseront la version standalone de Vue pour rendre l'analyse de template possible. Plus de détails [ici](https://fr.vuejs.org/guide/installation.html#Runtime-Compiler-vs-Runtime-seul). ### HTML @@ -13,16 +13,16 @@ Creating a Single-page Application with Vue.js + vue-router is dead simple. With
-

Hello App!

+

Bonjour l'application !

- - - - Go to Foo - Go to Bar + + + + Aller à Foo + Aller à Bar

- - + +
``` @@ -30,33 +30,33 @@ Creating a Single-page Application with Vue.js + vue-router is dead simple. With ### JavaScript ``` js -// 0. If using a module system (e.g. via vue-cli), import Vue and VueRouter and then call Vue.use(VueRouter). +// 0. Si vous utilisez un système de modules (e.g. via vue-cli), il faut importer Vue et VueRouter et ensuite appeler Vue.use(VueRouter). -// 1. Define route components. -// These can be imported from other files +// 1. Définir des composants. +// Ces derniers peuvent être importés depuis d'autre fichier const Foo = { template: '
foo
' } const Bar = { template: '
bar
' } -// 2. Define some routes -// Each route should map to a component. The "component" can -// either be an actual component constructor created via -// Vue.extend(), or just a component options object. -// We'll talk about nested routes later. +// 2. Définir des routes. +// Chaque route doit corresponde à un composant. Le "composant" peut +// soit être un véritable composant créé via Vue.extend(), ou juste un +// objet d'options. +// Nous parlerons plus tard des routes imbriquées. const routes = [ { path: '/foo', component: Foo }, { path: '/bar', component: Bar } ] -// 3. Create the router instance and pass the `routes` option -// You can pass in additional options here, but let's -// keep it simple for now. +// 3. Créer l'instance du routeur et passer l'option `routes`. +// Vous pouvez également passer des options supplémentaires, +// mais nous allons faire simple pour l'instant. const router = new VueRouter({ - routes // short for routes: routes + routes // raccourci pour routes: routes }) -// 4. Create and mount the root instance. -// Make sure to inject the router with the router option to make the -// whole app router-aware. +// 5. Créer et monter l'instance de Vue. +// Soyez sûr d'injecter le routeur avec l'option `router` pour +// permettre à l'application tout entière d'être à l'écoute du routeur. const app = new Vue({ router }).$mount('#app') @@ -64,6 +64,6 @@ const app = new Vue({ // Now the app has started! ``` -You can also checkout this example [live](http://jsfiddle.net/yyx990803/xgrjzsup/). +Vous pouvez aussi regarder cet [exemple](http://jsfiddle.net/yyx990803/xgrjzsup/). -Notice that a `` automatically gets the `.router-link-active` class when its target route is matched. You can learn more about it in its [API reference](../api/router-link.md). +Notez qu'un `` obtiendra automatiquement la classe `router-link-active` lorsque sa route cible correspond avec la route actuelle. Vous pouvez en apprendre plus à propos de cela dans sa [documentation d'API](../api/router-link.md). From 704cd2a6799a767824d7b93af44c8c434c9277ca Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Mon, 8 May 2017 18:34:55 +0200 Subject: [PATCH 2/4] fixes --- docs/en/essentials/getting-started.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/en/essentials/getting-started.md b/docs/en/essentials/getting-started.md index b57f75779..2c0a50d5b 100644 --- a/docs/en/essentials/getting-started.md +++ b/docs/en/essentials/getting-started.md @@ -2,7 +2,7 @@ > Nous utiliserons [ES2015](https://github.com/lukehoban/es6features) dans les exemples de code dans ce guide. -Créer une application monopage avec Vue.js + vue-router est vraiment simple. Avec Vue.js, nous concevons déjà notre application avec des composants. En ajoutant vue-router dans notre application, tout ce qu'il nous reste à faire est de relier nos composants aux routes, et de laisser vue-router en faire le rendu. Voici un exemple de base : +Créer une application monopage avec Vue.js + vue-router est vraiment simple. Avec Vue.js, nous concevons déjà notre application avec des composants. En ajoutant vue-router dans notre application, tout ce qu'il nous reste à faire est de relier nos composants aux routes, et de laisser vue-router faire le rendu. Voici un exemple de base : > Tous les exemples utiliseront la version standalone de Vue pour rendre l'analyse de template possible. Plus de détails [ici](https://fr.vuejs.org/guide/installation.html#Runtime-Compiler-vs-Runtime-seul). @@ -30,7 +30,7 @@ Créer une application monopage avec Vue.js + vue-router est vraiment simple. Av ### JavaScript ``` js -// 0. Si vous utilisez un système de modules (e.g. via vue-cli), il faut importer Vue et VueRouter et ensuite appeler Vue.use(VueRouter). +// 0. Si vous utilisez un système de module (e.g. via vue-cli), il faut importer Vue et VueRouter et ensuite appeler Vue.use(VueRouter). // 1. Définir des composants. // Ces derniers peuvent être importés depuis d'autre fichier @@ -61,7 +61,7 @@ const app = new Vue({ router }).$mount('#app') -// Now the app has started! +// L'application est maintenant en marche ! ``` Vous pouvez aussi regarder cet [exemple](http://jsfiddle.net/yyx990803/xgrjzsup/). From 02c5dac8731062cb81aa102866f8f4e679a069fb Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Thu, 11 May 2017 10:54:28 +0200 Subject: [PATCH 3/4] =?UTF-8?q?Modifications=20suite=20=C3=A0=20la=20revie?= =?UTF-8?q?w=20de=20@Haeresis?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/en/essentials/getting-started.md | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/docs/en/essentials/getting-started.md b/docs/en/essentials/getting-started.md index b24016640..ddd9f546e 100644 --- a/docs/en/essentials/getting-started.md +++ b/docs/en/essentials/getting-started.md @@ -15,8 +15,8 @@ Créer une application monopage avec Vue.js + vue-router est vraiment simple. Av

Bonjour l'application !

- - + + Aller à Foo Aller à Bar @@ -30,16 +30,16 @@ Créer une application monopage avec Vue.js + vue-router est vraiment simple. Av ### JavaScript ``` js -// 0. Si vous utilisez un système de module (e.g. via vue-cli), il faut importer Vue et VueRouter et ensuite appeler Vue.use(VueRouter). +// 0. Si vous utilisez un système de module (ex : via vue-cli), il faut importer Vue et VueRouter et ensuite appeler Vue.use(VueRouter). -// 1. Définir des composants. +// 1. Définissez les composants de route. // Ces derniers peuvent être importés depuis d'autre fichier const Foo = { template: '

foo
' } const Bar = { template: '
bar
' } -// 2. Définir des routes. -// Chaque route doit corresponde à un composant. Le "composant" peut -// soit être un véritable composant créé via Vue.extend(), ou juste un +// 2. Définissez des routes. +// Chaque route doit correspondre à un composant. Le « composant » peut +// soit être un véritable composant créé via `Vue.extend()`, ou juste un // objet d'options. // Nous parlerons plus tard des routes imbriquées. const routes = [ @@ -47,14 +47,14 @@ const routes = [ { path: '/bar', component: Bar } ] -// 3. Créer l'instance du routeur et passer l'option `routes`. +// 3. Créez l'instance du routeur et passez l'option `routes`. // Vous pouvez également passer des options supplémentaires, // mais nous allons faire simple pour l'instant. const router = new VueRouter({ - routes // raccourci pour routes: routes + routes // raccourci pour `routes: routes` }) -// 5. Créer et monter l'instance de Vue. +// 5. Créez et montez l'instance de Vue. // Soyez sûr d'injecter le routeur avec l'option `router` pour // permettre à l'application tout entière d'être à l'écoute du routeur. const app = new Vue({ @@ -66,4 +66,4 @@ const app = new Vue({ Vous pouvez aussi regarder cet [exemple](http://jsfiddle.net/yyx990803/xgrjzsup/). -Notez qu'un `` obtiendra automatiquement la classe `router-link-active` lorsque sa route cible correspond avec la route actuelle. Vous pouvez en apprendre plus à propos de cela dans sa [documentation d'API](../api/router-link.md). +Notez qu'un `` obtiendra automatiquement la classe `.router-link-active` lorsque sa route cible correspond avec la route actuelle. Vous pouvez en apprendre plus à propos de cela dans sa [documentation d'API](../api/router-link.md). From f6466949fd76f1a24b1144218036b4d8ef41cd59 Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Thu, 11 May 2017 11:30:25 +0200 Subject: [PATCH 4/4] =?UTF-8?q?Modifications=20suite=20=C3=A0=20la=202?= =?UTF-8?q?=C3=A8me=20review=20de=20@Haeresis?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/en/essentials/getting-started.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/en/essentials/getting-started.md b/docs/en/essentials/getting-started.md index ddd9f546e..a218a1bf7 100644 --- a/docs/en/essentials/getting-started.md +++ b/docs/en/essentials/getting-started.md @@ -66,4 +66,4 @@ const app = new Vue({ Vous pouvez aussi regarder cet [exemple](http://jsfiddle.net/yyx990803/xgrjzsup/). -Notez qu'un `` obtiendra automatiquement la classe `.router-link-active` lorsque sa route cible correspond avec la route actuelle. Vous pouvez en apprendre plus à propos de cela dans sa [documentation d'API](../api/router-link.md). +Notez qu'un `` obtiendra automatiquement la classe `.router-link-active` lorsque sa route cible correspond à la route actuelle. Vous pouvez en apprendre plus à propos de cela dans sa [documentation d'API](../api/router-link.md).