React + Vite: Создаём PWA за 20 минут | vite-plugin-pwa
В этом видео мы разберёмся, как создать PWA (Progressive Web App) используя Vite, плагин vite-plugin-pwa и React. Вы узнаете, зачем нужен Service Worker, как настроить manifest.json и robots.txt, а также как создать offline-ready приложение с эффективным кэшированием медиафайлов. Мы также разберём процесс деплоя проекта на хостинг Netlify, чтобы обеспечить безопасное HTTPS-соединение — необходимое условие для работы PWA. И самое главное — вы узнаете, что такое Progressive Web App и почему эта технология так популярна в современном веб-разработке. Таймкоды 00:00 Введение 01:06 Создаём приложение с помощью Vite 02:02 Устанавливаем плагин 03:03 Добавляем плагин 03:26 Настраиваем плагин 04:42 Начинаем описывать manifest 08:23 Добавляем скриншоты для пользователя 10:52 Описываем robots.txt 11:26 Добавляем Service Worker 12:30 Обсуждаем деплой приложения 13:21 Делаем сборку проекта 13:53 Загружаем на Netlify 14:51 Тестируем установку нашего приложения 15:23 Проверяем работу на телефоне 16:07 Проверяем работу без интернета 16:57 Делаем новую версию для проверки автообновления 18:17 Смотрим автообновление страницы при новой версии 18:59 Подводим итоги #programming #gorbatkoff #vite-plugin-pwa
