Фреймворк Nuxt (Дмитрий Лаврик)

​ ​ Разобраться с главными темами фреймворка Nuxt и научиться создавать SPA, поддерживающие Server Side Rendering, с минимальными трудозатратами для программиста (по сравнению с реализацией SSR с нуля на чистом Vue). Мы хотим организовать тренировку, приближенную к реальности, и поэтому сразу подключаем Vuetify, изучаем её компоненты и прощупываем проблемы UI-библиотек при SSR. Программа кура: Урок 1 Знакомство с Nuxt, работа с Nuxi Процесс разработки и концепция автоимпорта Структура директорий и основные части системы Простой роутинг, страницы и компоненты Плагины и middleware Настройки в nuxt.config Урок 2 Выбор UI, установка Vuetify 3 в Nuxt Базовые концепции Vuetify Конфигурация и стили Application layout Основные UI-компоненты Правильное подключение иконок Урок 3 SSR и гидратация SPA Проблема асинхронных операций Работа с данными в Nuxt useFetch, useAsyncData и $fetch Создание обёртки $appFetch Нюансы плагинов: setup, dependsOn, provide Урок 4 Авторизация: pinia и auth store Роутинг и вложенные маршруты Мета-данные маршрутов и definePageMeta Разработка Auth-middleware $appFetch: авторизация и 401-ые ошибки Отключение SSR для закрытых страниц Урок 5 Создание страницы входа на сайт Работа с формами Создание composable useForm Обработка 422-ых ошибок Layouts для клиентской части и админ-панели Урок 6 Разработка функционала админки Взаимодействие с backend-api Api и паттерн repository Умеренное погружение в typescript Скрытая папка .nuxt и магия типов Урок 7 Режимы генерации контента Пререндеринг vs SSR SSR и фокусы UI-библиотек Работа с SEO-тегами AsyncData и динамические метатеги Урок 8 Доработка SPA Развёртывание на VDS Node.js и pm2 Nginx reverse proxy Проверка Core Web Vitals с SSR и без