Skip to content

Traduction de api/nuxt-* #28

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

Merged
merged 2 commits into from
Oct 26, 2017
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
30 changes: 16 additions & 14 deletions en/api/nuxt-render-and-get-window.md
Original file line number Diff line number Diff line change
@@ -1,28 +1,30 @@
---
title: "API: nuxt.renderAndGetWindow(url, options)"
description: Get the window from a given url of a nuxt.js application.
description: Obtient la `window` à une URL donnée d'une application Nuxt.js.

Choose a reason for hiding this comment

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

Obtient la window à depuis une URL donnée d'une application Nuxt.js.

---

# nuxt.renderAndGetWindow(url, options = {}) (En)
# nuxt.renderAndGetWindow(url, options = {})

- Type: `Function`
- Argument: `String`
1. `String`: url to render
2. *Optional*, `Object`: options
- virtualConsole: `Boolean` (default: `true`)
- Returns: `Promise`
- Returns: `window`
- Type : `Function`
- Argument : `String`
1. `String` : l'URL à rendre
2. *Optional*, `Object` : options
- virtualConsole : `Boolean` (par défaut : `true`)
- Valeur de retour : `Promise`
- Valeur de retour : `window`

> Get the window from a given url of a nuxt.js application.
> Obtient la `window` à une URL donnée d'une application Nuxt.js.

Choose a reason for hiding this comment

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

Obtient la window à depuis une URL donnée d'une application Nuxt.js.


<p class="Alert Alert--info">This method is made for [test purposes](guide/development-tools#end-to-end-testing).</p>
<p class="Alert Alert--info">Cette méthode est faite pour les [tests](guide/development-tools#tests-de-bout-en-bout).</p>

Pour utiliser cette fonction, vous devez installer `jsdom` :

<p style="width: 294px;position: fixed; top : 64px; right: 4px;" class="Alert Alert--orange"><strong>⚠Cette page est actuellement en cours de traduction française. Vous pouvez repasser plus tard ou <a href="https://github.com/vuejs-fr/nuxt" target="_blank">participer à la traduction</a> de celle-ci dès maintenant !</strong></p><p>To use this function, you have to install `jsdom`:</p>
```bash
npm install --save-dev jsdom
```

Example:
Exemple :

```js
const { Nuxt, Builder } = require('nuxt')

Expand All @@ -33,7 +35,7 @@ const nuxt = new Nuxt(config)

nuxt.renderAndGetWindow('http://localhost:3000')
.then((window) => {
// Display the head <title>
// Afficher l'entête `<title>`
console.log(window.document.title)
})
```
37 changes: 19 additions & 18 deletions en/api/nuxt-render-route.md
Original file line number Diff line number Diff line change
@@ -1,26 +1,27 @@
---
title: "API: nuxt.renderRoute(route, context)"
description: Render a specific route with a given context.
title: "API : nuxt.renderRoute(route, context)"
description: Faire le rendu d'une route spécifique avec un contexte donné.
---

# nuxt.renderRoute(route, context = {}) (En)
# nuxt.renderRoute(route, context = {})

- Type: `Function`
- Arguments:
1. `String`, route to render
2. *Optional*, `Object`, context given, available keys: `req` & `res`
- Returns: `Promise`
- Type : `Function`
- Arguments :
1. `String` : route sur laquelle faire le rendu
2. *Optionnel*, `Object`, donne le contexte, propriétés disponibles : `req` & `res`
- Valeur de retour : `Promise`
- `html`: `String`
- `error`: `null` or `Object`
- `redirected`: `false` or `Object`
- `error`: `null` ou `Object`
- `redirected`: `false` ou `Object`

> Render a specific route with a given context.
> Faire le rendu d'une route spécifique avec un contexte donné.

<p style="width: 294px;position: fixed; top : 64px; right: 4px;" class="Alert Alert--orange"><strong>⚠Cette page est actuellement en cours de traduction française. Vous pouvez repasser plus tard ou <a href="https://github.com/vuejs-fr/nuxt" target="_blank">participer à la traduction</a> de celle-ci dès maintenant !</strong></p><p>This method should be used mostly for [test purposes](/guide/development-tools#end-to-end-testing) as well with [nuxt.renderAndGetWindow](/api/nuxt-render-and-get-window).</p>
Cette méthode devrait être utilisée en particulier pour les [tests](guide/development-tools#tests-de-bout-en-bout) aussi bien que [`nuxt.renderAndGetWindow`](/api/nuxt-render-and-get-window).

<p class="Alert Alert--info">`nuxt.renderRoute` should be executed after the build process in production mode (dev: false).</p>
<p class="Alert Alert--info">`nuxt.renderRoute` devrait être exécuté après le processus de build en mode production (`dev: false`).</p>

Exemple :

Example:
```js
const { Nuxt, Builder } = require('nuxt')

Expand All @@ -33,12 +34,12 @@ new Builder(nuxt)
.build()
.then(() => nuxt.renderRoute('/'))
.then(({ html, error, redirected }) => {
// html will be always a string
// `html` sera toujours une chaine de caractères

// error not null when the error layout is displayed, the error format is:
// { statusCode: 500, message: 'My error message' }
// `error` sera non `null` quand le layout d'erreur est affiché, le format d'erreur est :
// { statusCode: 500, message: 'Mon message d'erreur' }

Choose a reason for hiding this comment

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

{ statusCode: 500, message: 'Mon message d'erreur' } => { statusCode: 500, message: 'Mon message d erreur' }

Bien que ce soit un commentaire, j’enlèverai l'apostrophe entre le "d" et "erreur", je sais je suis tatillons quelquefois 😄 (sinon il y a une erreur de syntaxe javascript)


// redirected is not false when redirect() has been used in data() or fetch()
// `redirected` n'est pas `false` quand `redirect()` est utilisé dans `data()` ou `fetch()`
// { path: '/other-path', query: {}, status: 302 }
})
```
29 changes: 15 additions & 14 deletions en/api/nuxt-render.md
Original file line number Diff line number Diff line change
@@ -1,35 +1,36 @@
---
title: "API: nuxt.render(req, res)"
description: You can use Nuxt.js as a middleware for your node.js server.
title: "API : nuxt.render(req, res)"
description: Vous pouvez utiliser Nuxt.js comme un middleware pour votre serveur Node.js.
---

# nuxt.render(req, res) (En)
# nuxt.render(req, res)

- Type: `Function`
- Arguments:
- Type : `Function`
- Arguments :
1. [Request](https://nodejs.org/api/http.html#http_class_http_incomingmessage)
2. [Response](https://nodejs.org/api/http.html#http_class_http_serverresponse)
- Returns: `Promise`
- Valeur de retour : `Promise`

> You can use nuxt.js as a middleware with `nuxt.render` for your node.js server.
> Vous pouvez utiliser Nuxt.js comme un middleware avec `nuxt.render` pour votre serveur Node.js.

Example with [Express](https://github.com/expressjs/express) :

<p style="width: 294px;position: fixed; top : 64px; right: 4px;" class="Alert Alert--orange"><strong>⚠Cette page est actuellement en cours de traduction française. Vous pouvez repasser plus tard ou <a href="https://github.com/vuejs-fr/nuxt" target="_blank">participer à la traduction</a> de celle-ci dès maintenant !</strong></p><p>Example with [Express.js](https://github.com/expressjs/express):</p>
```js
const { Nuxt, Builder } = require('nuxt')

const app = require('express')()
const isProd = (process.env.NODE_ENV === 'production')
const port = process.env.PORT || 3000

// We instantiate nuxt.js with the options
// Nous instancions Nuxt.js avec les options
const config = require('./nuxt.config.js')
config.dev = !isProd
const nuxt = new Nuxt(config)

// Render every route with nuxt.js
// Rendre chaque route avec Nuxt.js
app.use(nuxt.render)

// Build only in dev mode with hot-reloading
// Faire le build seulement en mode de développement avec du rechargement à chaud
if (config.dev) {
new Builder(nuxt).build()
.then(listen)
Expand All @@ -43,10 +44,10 @@ else {
}

function listen() {
// Listen the server
// Écouter le serveur
app.listen(port, '0.0.0.0')
console.log('Server listening on localhost:' + port)
console.log('Le serveur écoute sur `localhost:' + port + '`.')
}
```

<p class="Alert">It's recommended to call **nuxt.render** at the end of your middlewares since it will handle the rendering of your web application and won't call next()</p>
<p class="Alert">Il est recommandé d'appeler `nuxt.render` à la fin de votre middlewares ainsi il fera le rendu de votre application web et n'appellera pas `next()`.</p>

Choose a reason for hiding this comment

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

à la fin de votre middlewares => à la fin de vos middlewares

31 changes: 16 additions & 15 deletions en/api/nuxt.md
Original file line number Diff line number Diff line change
@@ -1,44 +1,45 @@
---
title: "API: Nuxt(options)"
description: You can use nuxt.js programmatically to use it as a middleware giving you the freedom of creating your own server for rendering your web applications.
title: "API : Nuxt(options)"
description: Vous pouvez utiliser Nuxt.js par programmation et l'utiliser en tant que middleware vous donnant la possibilité de créer votre propre serveur pour le rendu de vos applications web.
---

# Using Nuxt.js Programmatically (En)
# Utiliser Nuxt.js par programmation

<p style="width: 294px;position: fixed; top : 64px; right: 4px;" class="Alert Alert--orange"><strong>⚠Cette page est actuellement en cours de traduction française. Vous pouvez repasser plus tard ou <a href="https://github.com/vuejs-fr/nuxt" target="_blank">participer à la traduction</a> de celle-ci dès maintenant !</strong></p><p>You might want to use your own server with your middleware and your API. That's why you can use Nuxt.js programmatically.</p>
Vous voudrez peut-être utiliser votre propre serveur avec vos middlewares et votre API. C'est pourquoi vous pouvez utiliser Nuxt.js par programmation.

Vous pouvez inclure Nuxt.js ainsi :

You can require Nuxt.js like this:
```js
const { Nuxt, Builder } = require('nuxt')
```

## Nuxt Constructor
## Constructeur Nuxt

To see the list of options to give to Nuxt.js, see the configuration section.
Pour voir la liste des options à fournir à Nuxt.js, consultez la section configuration.

```js
// Require Nuxt And Builder modules
// Inclure les modules `Nuxt` et `Builder`
const { Nuxt, Builder } = require('nuxt')

// Require nuxt config
// Inclure la configuration Nuxt
const config = require('./nuxt.config.js')

// Create a new nuxt instance
// Créer une nouvelle instance de Nuxt
const nuxt = new Nuxt(config)

// Enable live build & reloading on dev
// Activer le build live et le rechargement à chaud reloading en développement
if (nuxt.options.dev) {
new Builder(nuxt).build()
}

// We can use nuxt.render(req, res) or nuxt.renderRoute(route, context)
// Nous pouvons utiliser `nuxt.render(req, res)` ou `nuxt.renderRoute(route, context)`
```

You can take a look at the [nuxt-express](https://github.com/nuxt/express) and [adonuxt](https://github.com/nuxt/adonuxt) starters to get started quickly.
Vous pouvez jeter un œil aux modules de démarrage [nuxt-express](https://github.com/nuxt/express) et [adonuxt](https://github.com/nuxt/adonuxt) pour démarrer rapidement

### Debug logs
### Logs de débogue

If you want to display nuxt.js logs, you can add to the top of your file:
Si vous voulez afficher les logs de Nuxt.js, vous pouvez ajouter en première ligne de fichier le code suivant :

```js
process.env.DEBUG = 'nuxt:*'
Expand Down