webformyself
Webformyself - универсальная русскоязычная площадка, которая делает годные курсы по нескольким направлениям, от фреймворков и верстки до SEO...
Продолжительность
15 ч 24 мин
Категория
VueКоличество уроков
106 Видео
Дата добавления
25 апр. 2019 г., 13:42
Язык
Русский
Дата выхода
24 апр. 2019 г., 15:29
Дата обновления
29 апр. 2026 г., 03:07
Этот курс по NuxtJS — ваше полноценное руководство по созданию универсальных, SEO-оптимизированных и высокопроизводительных приложений на базе Vue. Материал охватывает весь путь разработки: от архитектуры клиентской части до серверного рендеринга и развертывания рабочих проектов.
Что дает изучение NuxtJS
NuxtJS — это мощный фреймворк, который значительно упрощает разработку сложных приложений, объединяя возможности Vue, SSR и современного фронтенда в единую гибкую экосистему.
Почему важно уметь создавать SPA
SPA — это современный формат веб‑приложений, ориентированный на максимальную скорость работы и плавность интерфейса.
- Широкий охват аудитории — SPA одинаково удобны на мобильных и десктопных устройствах.
- Экономия ресурсов — повторные загрузки страниц не требуются.
- Современный UI — простая работа с анимациями, состояниями и пользовательским опытом.
- Высокая востребованность — специалисты по SPA и FullStack‑разработке получают больше предложений и выше доход.
Преимущества рендеринга на стороне сервера
SSR — ключевая возможность, делающая Nuxt столь ценным инструментом.
- SEO‑оптимизация — поисковые роботы видят готовый HTML, что повышает позиции сайта.
- Молниеносная загрузка страниц — решающий фактор для бизнеса.
- Экономия трафика — особенно важна для мобильных сетей.
- Ускоренный парсинг — уменьшение нагрузки на слабые устройства.
NuxtJS как инструмент разработки
NuxtJS — это высокоуровневый фреймворк, который делает разработку мощных Vue‑приложений простой, структурированной и быстрой.
Ключевые преимущества NuxtJS
- Полная SEO‑оптимизация благодаря SSR.
- Упрощение сложных задач — обмен кодом между клиентом и сервером.
- Создание универсальных приложений без сложных настроек.
- Поддержка статической генерации — размещение приложения без сервера.
- Автоматическое разделение кода и оптимизация сборки.
- Грамотная структура проекта по умолчанию.
- ES6/ES7 без дополнительных конфигураций благодаря Babel.
- Автоматический перезапуск сервера — комфортная разработка.
Для кого создан курс
Действующие Frontend‑разработчики
Подходит тем, кто уже владеет Vue, JS и хочет перейти на новый уровень, научившись создавать универсальные и SEO‑оптимизированные приложения.
Фрилансеры
Курс позволит быстро освоить востребанную технологию и брать более дорогие коммерческие проекты.
Собственники веб‑студий
Актуальный материал для подготовки команды к созданию современных приложений на Nuxt.
Особенности курса
- Полный цикл обучения NuxtJS.
- Только актуальные и практические знания.
- Большой объем практики и работа над реальным проектом.
- Объяснение SEO‑особенностей SPA и SSR.
- Оптимизация времени обучения — вам не нужно изучать документацию самостоятельно.
- Возможность увеличить доход благодаря востребованным навыкам FullStack‑разработки.
Практическая часть курса
Вы создадите полноценное универсальное приложение — функциональный блог с административной панелью. В проекте будут реализованы:
- клиентская и серверная части;
- полный SSR‑цикл;
- анализ и управление данными;
- редактирование и создание контента;
- система прав доступа.
Полученный проект можно использовать как основу для разработки сложных профессиональных сервисов.
Структура курса
- Уроки 1–74 — Nuxt.js
- Уроки 75–79 — бонусный блок по SEO
- Уроки 80–89 — курс "NodeJS. Основы"
- Уроки 90–94 — курс "MongoDB"
- Уроки 95–106 — курс "WebPack 4+"
- Урок 1.00:03:18О чем этот курс
- Урок 2.00:01:34Что потребуется
- Урок 3.00:05:32Что такое Nuxt.js
- Урок 4.00:09:59Обзор приложения
- Урок 5.00:09:11Создание разметки приложения
- Урок 6.00:08:06Статические роуты
- Урок 7.00:11:38Динамические роуты и валидация
- Урок 8.00:07:24Ссылки и обработка ошибок
- Урок 9.00:05:02Как работают Layouts
- Урок 10.00:03:25Что такое модули
- Урок 11.00:10:52Async Data
- Урок 12.00:08:30Async Data на практике
- Урок 13.00:05:21Работа с Vuex
- Урок 14.00:08:45Метод Fetch
- Урок 15.00:09:20Middleware и защита роутов
- Урок 16.00:05:01NuxtServerInit
- Урок 17.00:09:12Создание проекта
- Урок 18.00:07:16Настройка проекта
- Урок 19.00:11:33Создание Layout
- Урок 20.00:08:15Главная страница
- Урок 21.00:13:19Компонент пост
- Урок 22.00:13:40Страница детального отображения
- Урок 23.00:04:26Обработка ошибки роутов
- Урок 24.00:08:41Список комментариев
- Урок 25.00:16:10Форма добавления комментариев
- Урок 26.00:13:36Валидация и логика для добавления комментария
- Урок 27.00:02:51Анимация при изменении страниц
- Урок 28.00:05:44Создание структуры страниц
- Урок 29.00:12:55Меню навигации
- Урок 30.00:10:09Страница логина
- Урок 31.00:18:35Создание авторизации с Vuex
- Урок 32.00:08:41Защита роутов с Middleware
- Урок 33.00:04:59Завершение сессии
- Урок 34.00:08:23Обработка ошибок
- Урок 35.00:06:33Добавление пользователей
- Урок 36.00:16:18Список постов. Часть 1
- Урок 37.00:15:47Список постов. Часть 2
- Урок 38.00:17:38Редактирование поста
- Урок 39.00:09:52Создание поста
- Урок 40.00:11:29Предпросмотр текста в MD и HTML
- Урок 41.00:14:07Загрузка файла
- Урок 42.00:05:20Декомпозиция файлов
- Урок 43.00:03:21Создание объекта конфигурации
- Урок 44.00:08:05Подключение MongoDB
- Урок 45.00:09:07Роуты, контроллеры, модели
- Урок 46.00:17:28Авторизация пользователя
- Урок 47.00:05:30Создание пользователя
- Урок 48.00:10:49Настройка Passport
- Урок 49.00:07:24Функционал постов
- Урок 50.00:08:16Роуты постов
- Урок 51.00:10:45Загрузка картинки
- Урок 52.00:13:07Контроллер постов
- Урок 53.00:10:07Функционал комментариев
- Урок 54.00:01:58Исправление ошибки
- Урок 55.00:08:59Создание пользователя
- Урок 56.00:07:20Логин и обработка ошибок
- Урок 57.00:07:26Обработка 401 ошибки
- Урок 58.00:10:58Добавление токена к запросам
- Урок 59.00:15:13Поддержание сессии с токеном
- Урок 60.00:08:04Создание поста
- Урок 61.00:09:08Загрузка, редактирование и удаление постов
- Урок 62.00:14:24Вывод постов в блоге
- Урок 63.00:12:55Добавление комментариев
- Урок 64.00:06:32Настройка и установка графиков
- Урок 65.00:08:29Формирование данных на сервере
- Урок 66.00:09:56Создание компонента графика
- Урок 67.00:01:34Исправление Warning в консоли
- Урок 68.00:07:29Фильтр отображения даты
- Урок 69.00:05:26Название страниц
- Урок 70.00:09:20Создание PWA из приложения
- Урок 71.00:02:41Защита ключей
- Урок 72.00:03:28Настройка и установка Heroku
- Урок 73.00:07:12Настройка приложения
- Урок 74.00:07:43Деплой приложения
- Урок 75.00:03:04Как Nuxt.js работает с SEO
- Урок 76.00:10:21Добавление мета тегов
- Урок 77.00:01:51Генерация Robots и Sitemap
- Урок 78.00:03:08Добавление редиректа
- Урок 79.00:07:37Что такое NodeJS
- Урок 80.00:10:53Основы работы с NodeJS
- Урок 81.00:17:09Что такое NPM
- Урок 82.00:09:33Первый веб-сервер на Express
- Урок 83.00:10:57Создание веб-страницы
- Урок 84.00:07:15Обработка формы
- Урок 85.00:04:44Получение API ключа
- Урок 86.00:08:55Создание модуля
- Урок 87.00:14:14Получение погоды
- Урок 88.00:04:37Вывод данных
- Урок 89.00:09:28Установка MongoDB
- Урок 90.00:12:42Подключение к базе
- Урок 91.00:06:45Создание схемы
- Урок 92.00:06:41Сохранение модели
- Урок 93.00:08:19Получение и сортировка данных
- Урок 94.00:03:07Удаление модели
- Урок 95.00:14:53Настройка и установка Webpack
- Урок 96.00:12:53Модули и оптимизация сборки
- Урок 97.00:07:29Плагины и создание HTML-файла
- Урок 98.00:07:41Работа с библиотеками
- Урок 99.00:10:53Работа со стилями
- Урок 100.00:13:04Стили в отдельном файле
- Урок 101.00:04:39Webpack Dev Server
- Урок 102.00:09:52Настройка Babel
- Урок 103.00:04:34Компиляция Less
- Урок 104.00:03:20Компиляция Sass
- Урок 105.00:08:25Компиляция React JSX
- Урок 106.00:07:15Компиляция TypeScript
Автор - webformyself
Комментарии
"Выводим user.name" 5 секунд молчания. Шопотом "Пиздец"