Деплой SPA (Vite + React + Router) на GitHub Pages

Описание

В этом видео детально рассмотрим процесс деплоя SPA (Single Page Application) на GitHub Pages. Вы узнаете какие необходимо выполнить настройки для публикации (Vite, React Router) приложения, а также научитесь конфигурировать React Router для корректной работы на GitHub Pages. Немного затронем переменные окружения (BASE_URL) и узнаем чем они могут нам помочь при настройке деплоя приложения.

Содержание:

00:00 Интро
02:08 Что будем деплоить
04:13 Готовим репозиторий
07:21 Как работает деплой на GitHub Pages
10:36 Настройки GitHub Pages
12:33 Пакет gh-pages. Конфигурация
16:25. Деплой. Попытка №1
19:55 Проблема №1. Подключение ресурсов
22:29 Проблема №2. Маршрутизация
25:32 Проблема №3. И снова React Router
33:51 Задействуем переменные окружения
36:71 Оутро и итоги

Полезные ссылки:

* Канал в YouTube: https://www.youtube.com/@antonovjs
* Сообщество в VK: https://vk.com/antonovjs
* Мой блог в Telegram: https://t.me/antonovjs

* spa-github-pages от @rafgraph — https://github.com/rafgraph/
* spa-github-pages
* import.meta — https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Operators/import.meta
* Пакет gh-pages — https://www.npmjs.com/package/gh-pages
* Переменные окружения и Vite — https://vitejs.dev/guide/env-and-mode.html
* Курс «React. Разработка сложных клиентских приложений» от HTML Academy — https://htmlacademy.ru/intensive/react.