translation-gang · gbezyuk · Jan 9, 2017 · Jan 9, 2017 · Jan 9, 2017 · Jan 9, 2017
diff --git a/ru/guide/custom-loading.md b/ru/guide/custom-loading.md
@@ -1,32 +1,32 @@
 ---
-title: Custom Loading
-description: Nuxt.js uses it's own component to show a progress bar between the routes. You can customize it, disable it or create your own component.
+title: Индикатор загрузки
+description: Nuxt.js использует свой компонент для отображения прогресса загрузки между маршрутами. Вы можете изменить его, отключить или создать собственный.
 ---
 
-> Nuxt.js uses it's own component to show a progress bar between the routes. You can customize it, disable it or create your own component.
+> Nuxt.js использует свой компонент для отображения прогресса загрузки между маршрутами. Вы можете изменить его, отключить или создать собственный.
 
-## Disable the Progress Bar
+## Отключение индикатора загрузки
 
-If you don't want to display the progress bar between the routes, simply add `loading: false` in your `nuxt.config.js` file:
+Если вы не хотите отображать индикатор загрузки в переходах между маршрутами, просто установите `loading: false` в файле `nuxt.config.js`:
 
 ```js
 module.exports = {
   loading: false
 }
 ```
 
-## Customize the Progress Bar
+## Изменение индикатора загрузки
 
-List of properties to customize the progress bar.
+Список параметров для изменения индикатора загрузки.
 
-| Key | Type | Default | Description |
+| Ключ | Тип | По-умолчанию | Описание |
 |-----|------|---------|-------------|
-| `color` | String | `'black'` | CSS color of the progress bar |
-| `failedColor` | String | `'red'` | CSS color of the progress bar when an error appended while rendering the route (if `data` or `fetch` sent back an error for example). |
-| `height` | String | `'2px'` | Height of the progress bar (used in the `style` property of the progress bar) |
-| `duration` | Number | `5000` | In ms, the maximum duration of the progress bar, Nuxt.js assumes that the route will be rendered before 5 seconds. |
+| `color` | String | `'black'` | CSS-цвет индикатора загрузки |
+| `failedColor` | String | `'red'` | CSS-цвет индикатора загрузки в случае возникновения ошибки при рендеринге маршрута (например, если методы `data` или `fetch` вернули ошибку). |
+| `height` | String | `'2px'` | Высота индикатора загрузки (используется в свойстве `style` индикатора) |
+| `duration` | Number | `5000` | В мс, максимальная продолжительность работы индикатора. Nuxt.js предполагает, что маршрут будет отрендерен в течение 5 сек. |
 
-For a blue progress bar with 5px of height, we update the `nuxt.config.js` to the following:
+Для создания синего индикатора загрузки высотой 5 пикселей, измените `nuxt.config.js` следующим образом:
 
 ```js
 module.exports = {
@@ -37,24 +37,24 @@ module.exports = {
 }
 ```
 
-## Use a Custom Loading Component
+## Создание собственного индикатора
 
-You can create your own component that Nuxt.js will call instead of its default component. To do so, you need to give a path to your component in the `loading` option. Then, your component will be called directly by Nuxt.js.
+Вы можете создать собственный компонент, который Nuxt.js будет отображать вместо своего. Для этого просто укажите путь к компоненту в параметре `loading`.
 
-**Your component has to expose some of theses methods:**
+**Ваш собственный компонент должен содержать некоторые из следующих методов:**
 
-| Method | Required | Description |
+| Метод | Обязательный | Описание |
 |--------|----------|-------------|
-| `start()` | Required | Called when a route changes, this is here where you display your component. |
-| `finish()` | Required | Called when a route is loaded (and data fetched), this is here where you hide your component. |
-| `fail()` | *Optional* | Called when a route couldn't be loaded (failed to fetch data for example). |
-| `increase(num)` | *Optional* | Called during loading the route component, `num` is an Integer < 100. |
+| `start()` | Да | Вызывается при изменении текущего маршрута, чтобы отобразить индикатор. |
+| `finish()` | Да | Вызывается, когда маршрут и его данные загружены, чтобы скрыть индикатор. |
+| `fail()` | *Нет* | Вызывается, когда маршрут не может быть загружен (например, ошибка загрузки данных). |
+| `increase(num)` | *Нет* | Вызывается во время загрузки компонента маршрута, `num` — число < 100. |
 
-We can create our custom component in `components/loading.vue`:
+Мы можем создать собственный индикатор в `components/loading.vue`:
 ```html
 <template lang="html">
-  <div class="loading-page" v-if="loading">
-    <p>Loading...</p>
+  <div class="page-loader" v-if="loading">
+    <p>Загрузка...</p>
   </div>
 </template>
 
@@ -75,7 +75,7 @@ export default {
 </script>
 
 <style scoped>
-.loading-page {
+.page-loader {
   position: fixed;
   top: 0;
   left: 0;
@@ -90,7 +90,7 @@ export default {
 </style>
 ```
 
-Then, we update our `nuxt.config.js` to tell Nuxt.js to use our component:
+Затем указываем в `nuxt.config.js` параметр `loading`:
 
 ```js
 module.exports = {

diff --git a/ru/guide/layouts.md b/ru/guide/layouts.md
@@ -1,38 +1,38 @@
 ---
-title: Layouts
-description: Nuxt.js lets you extend the main layout or create custom layouts by adding them in the layouts directory.
+title: Шаблоны
+description: Nuxt.js позволяет расширять основной шаблон и создавать собственные, просто добавляя их в папку /layouts.
 ---
 
-> Nuxt.js lets you extend the main layout or create custom layouts by adding them in the `layouts` directory.
+> Nuxt.js позволяет расширять основной шаблон и создавать собственные, просто добавляя их в папку `layouts`.
 
-## Default Layout
+## Основной шаблон
 
-> You can extend the main layout by adding a `layouts/default.vue` file.
+> Вы можете расширить основной шаблон, добавив файл `layouts/default.vue`.
 
-*Make sure to add the `<nuxt>` component when creating a layout to display the page component.*
+*Убедитесь в том, что компонент `<nuxt/>` прописан в шаблоне страницы.*
 
-The default layout source code is:
+Код обычного шаблона таков:
 ```html
 <template>
   <nuxt/>
 </template>
 ```
 
-## Error Page
+## Страница ошибки
 
-> You can customize the error page by adding a `layouts/error.vue` file.
+> Вы можете изменить страницу ошибки, добавив файл `layouts/error.vue`.
 
-This layout is special since you should not include `<nuxt/>` inside its template. You must see this layout as a component displayed when an error occurs (404, 500, etc).
+Это — специальный шаблон, поскольку компонент `<nuxt/>` не должен присутствовать в нём. Представляйте себе этот шаблон как отдельный компонент, который отображается во время возникновения ошибки (404, 500, т.п.)
 
-The default error page source code is [available on Github](https://github.com/nuxt/nuxt.js/blob/master/lib/app/components/nuxt-error.vue).
+Исходный код для стандартной страницы ошибки [доступен на Гитхабе](https://github.com/nuxt/nuxt.js/blob/master/lib/app/components/nuxt-error.vue).
 
-Example of a custom error page in `layouts/error.vue`:
+Пример кода страницы ошибки в `layouts/error.vue`:
 ```html
 <template>
   <div class="container">
-    <h1 v-if="error.statusCode === 404">Page not found</h1>
-    <h1 v-else>An error occurred</h1>
-    <nuxt-link to="/">Home page</nuxt-link>
+    <h1 v-if="error.statusCode === 404">Страница не найдена</h1>
+    <h1 v-else>Произошла ошибка</h1>
+    <nuxt-link to="/">Вернуться на главную</nuxt-link>
   </div>
 </template>
 
@@ -43,23 +43,23 @@ export default {
 </script>
 ```
 
-## Custom Layout
+## Индивидуальный шаблон
 
-> Every file (*first level*) in the `layouts` directory will create a custom layout accessible with the `layout` property in the page component.
+> Каждый файл *первого уровня* в папке `layouts` будет создавать индивидуальный шаблон, доступный через свойство `layout` в компоненте страницы.
 
-*Make sure to add the `<nuxt/>` component when creating a layout to display the page component.*
+*Убедитесь в том, что компонент `<nuxt>` прописан в шаблоне страницы.*
 
-Example of `layouts/blog.vue`:
+Пример шаблона в `layouts/blog.vue`:
 ```html
 <template>
   <div>
-    <div>My blog navigation bar here</div>
+    <h1>Мой блог</h1>
     <nuxt/>
   </div>
 </template>
 ```
 
-And then in `pages/posts.vue`, you can tell Nuxt.js to use your custom layout:
+Затем в `pages/posts.vue` вы можете сказать Nuxt.js использовать созданный шаблон:
 ```html
 <script>
 export default {
@@ -68,4 +68,4 @@ export default {
 </script>
 ```
 
-Check the [demonstration video](https://www.youtube.com/watch?v=YOKnSTp7d38) to see it in action.
+Смотрите живой пример в [демонстрационном видео](https://www.youtube.com/watch?v=YOKnSTp7d38).
diff --git a/ru/guide/pages.md b/ru/guide/pages.md
@@ -1,32 +1,32 @@
 ---
-title: Pages
-description: The pages directory lets you create every kind of routes simply by creating Vue files. These components comes with a set of features to let you bootstrap and maintain your application with ease.
+title: Страницы
+description: Папка /pages позволяет создавать любой вид маршрута, просто создавая Vue-файлы. Эти компоненты обладают свойствами, с помощью которых можно легко создавать и поддерживать приложение.
 ---
 
-> The `pages` directory lets you create every kind of routes simply by creating Vue files. These components comes with a set of features to let you bootsrap and maintain your isomorphic application with ease.
+> Папка `pages` позволяет создавать любой вид маршрута, просто создавая Vue-файлы. Эти компоненты обладают свойствами, с помощью которых можно легко создавать и поддерживать приложение.
 
-## Special Keys
+## Специальные ключи
 
-Every page component is a Vue component, but nuxt.js adds special keys to make the development of your universal application the easiest way possible.
+Каждая страница — это компонент Vue, но Nuxt.js ещё добавляет и специальные ключи, чтобы сделать процесс разработки приложения как можно проще.
 
-List of all the available keys
+Список всех доступных ключей
 
-| Attribute | Description |
+| Атрибут | Описание |
 |-----------|-------------|
-| data | The most important key, it has the same purpose as [Vue data](https://vuejs.org/v2/api/#Options-Data) but it can be asynchronous and receives the context as argument, please read the [async data documentation](/guide/async-data) to learn how it works. |
-| fetch | Used to fill the store before rendering the page, it's like the data method except it doesn't set the component data. See the [fetch method documentation](/guide/vuex-store#the-fetch-method). |
-| layout | Specify a layout defined in the `layouts` directory, see [layouts documentation](/guide/layouts). |
-| transition | Set a specific transition for the page, see [routes transitions](/guide/routes-transitions). |
-| scrollToTop | Boolean, by default: `false`. Specify if you want the page to scroll to the top before rendering the page, it's used for [nested routes](/guide/nested-routes). |
-| validate | Validator function for a [dynamic route](/guide/dynamic-routes#validate-route-params). |
-| middleware | Set a middleware for this page, the middleware will be called before rendering the page, see [routes middleware](/guide/routes-middleware). |
+| data | Самый важный ключ, с тем же предназначением, что и [Vue data](https://vuejs.org/v2/api/#Options-Data), но может быть асинхронным и принимать контекст в виде аргумента. Пожалуйста, прочитайте про [асинхронные данные](/guide/async-data), чтобы понять, как именно это работает. |
+| fetch | Используется для заполнения хранилища перед рендерингом страницы. Примерно как метод data, за исключением того, что значение data у компонента в данном случае не устанавливается. См. [метод fetch](/guide/vuex-store#the-fetch-method). |
+| layout | Назначает шаблон, определённый в папке `layouts`. См. [шаблоны](/guide/layouts). |
+| transition | Устанавливает переход для страницы. См. [переходы маршрутов](/guide/routes-transitions). |
+| scrollToTop | Булевское значение, по-умолчанию — `false`. Используйте, если страница должна проскроллиться наверх перед рендерингом. Используется для [вложенных маршрутов](/guide/nested-routes). |
+| validate | Функция-валидатор для [динамического маршрута](/guide/dynamic-routes#validate-route-params). |
+| middleware | Устанавливает промежуточный код для конкретной страницы, который выполняется перед рендерингом страницы. См [промежуточный код маршрутов](/guide/routes-middleware). |
 
 
-## A Simple Page
+## Простая страница
 
-A page component is a Vue component with some superpowers, first, let's have a simple component displaying a red title "Hello World!".
+Компонент страницы — это компонент Vue с дополнительной супер-силой. Сперва, давайте создадим простой компонент, показывающий красный заголовок "Hello World!"
 
-We create our first page `pages/index.vue`:
+Назовём первую страницу `pages/index.vue`:
 
 ```html
 <template>
@@ -48,11 +48,12 @@ export default {
 </style>
 ```
 
-## Using Pre-Processors
+## Использование пре-процессоров
 
-Thanks to [vue-loader](http://vue-loader.vuejs.org/en/configurations/pre-processors.html), you can use any kind of pre-processors for your `<template>`, `<script>` or `<style>`: simply use the `lang` attribute.
+Благодаря [vue-loader](http://vue-loader.vuejs.org/en/configurations/pre-processors.html) вы можете использовать любой тип пре-процессоров для `<template>`, `<script>` or `<style>`, просто добавив к ним атрибут `lang`.
 
-Example of our `pages/index.vue` using [Pug](https://github.com/pugjs/pug), [CoffeeScript](http://coffeescript.org) and [Sass](http://sass-lang.com/):
+Например, наша страница `pages/index.vue` будет использовать [Pug](https://github.com/pugjs/pug),
+[CoffeeScript](http://coffeescript.org) и [Sass](http://sass-lang.com/):
 
 ```html
 <template lang="pug">
@@ -70,21 +71,19 @@ module.exports = data: ->
 </style>
 ```
 
-To be able to use these pre-processors, we need to install their webpack loaders:
+Чтобы использовать пре-процессоры, нужно просто установить их загрузчики для webpack:
 ```bash
 npm install --save-dev pug@2.0.0-beta6 pug-loader coffee-script coffee-loader node-sass sass-loader
 ```
 
-## Using JSX
-
-If you want to use JSX in your components, first, you need to install the Babel plugins for JSX:
+## Использование JSX
 
+Чтобы использовать JSX в компонентах, установите плагин Babel для JSX:
 ```bash
 npm install --save-dev babel-plugin-syntax-jsx babel-plugin-transform-vue-jsx babel-helper-vue-jsx-merge-props
 ```
 
-Then, in your `nuxt.config.js`, tell nuxt.js to use the [transform-vue-jsx](https://github.com/vuejs/babel-plugin-transform-vue-jsx) plugin:
-
+Затем добавьте название плагина [transform-vue-jsx](https://github.com/vuejs/babel-plugin-transform-vue-jsx) в `nuxt.config.js`:
 ```js
 module.exports = {
   build: {
@@ -95,9 +94,9 @@ module.exports = {
 }
 ```
 
-To learn more about the babel option, take a look at the [build config documentation](/api/configuration-build).
+Чтобы узнать больше об опции babel, прочитайте [конфигурацию build](/api/configuration-build).
 
-You can now use JSX in your `render` method of your components:
+Теперь вы можете использовать JSX в методе `render` у компонентов.
 
 ```html
 <script>
@@ -112,4 +111,4 @@ export default {
 </script>
 ```
 
-You can learn more how to use it in the [JSX section](https://vuejs.org/v2/guide/render-function.html#JSX) of the Vue.js documentation.
+Узнайте больше в [разделе JSX](https://vuejs.org/v2/guide/render-function.html#JSX) документации к Vue.js.