Игорь, огромное вам спасибо!!!!!!!!!! И спасибо этому чуваку rafgraph!!!! Но если бы не вы, Игорь, то как бы мы нашли этого rafgraph! Все работает! Как круто! И теперь при деплое на gh-pages нет ошибки 404 при перезагрузке. УРа!!!!!!!!!!
Как всегда всё круто и интересно! В будущем хотелось бы увидеть что-то подобное для проектов с SSR. Хотя бы в базовом виде. Какие особенности сборки, правильное взаимодействие между клиентом и сервером и т.д.
13:15 Для тех, кто как я, не знает что значат флаги в npm install: -D сокращение для --save-dev. Устанавливает пакет в дев зависимости, в те которые нужны только для программистов, а не для пользователей конечного продукта. -E сокращение для --save-exact. Устанавливает конкретную версию пакета, а не диапазон семантических версий. Например, конкретная версия в файле package.json будет пронумерована так 16.1.0 (без символа каретки), а семантическая так ^16.1.0 (с кареткой перед цифрами). И если вы например клонируете репозиторий на новой машине, то вам надо будет запустить npm install, чтобы опять все пакеты установить. И в случае семантической версии у вас может установится более новая версия какого-нибудь пакета например версия 16.2.0, которая может конфликтовать, баговать с вашим кодом и пока вы это поймете, потеряете кучу нервов. Пишу, потому что сама не знала что эти флаги значат, вдруг кто-нибудь тоже не знает, хочу помочь. Инфа про версии с сайта plainenglish статья Best Way How To Install NPM Packages With an Exact Version.
Спасибо за дополнение! Кстати, более подробно про виды зависимостей можно посмотреть в отдельном видео - th-cam.com/video/c-n1NNaDZ0Y/w-d-xo.html. Здесь и optional, bundle, peer.
Я использую расширение vscode-icons (marketplace.visualstudio.com/items?itemName=vscode-icons-team.vscode-icons). Есть и другие, можно поискать по ключевому слову icons в списке расширений
Спасибо за поддержку! Всему причина - работа, которая настигает даже в выходные. Октябрь был временем конференций и гостевых лекций в университете. В ноябре времени будет больше, видео вернуться. Скоро-скоро!
@@antonov_i Благодарю за ответ. Понимаю что работа отнимает у вас свободное время. В любом случае продолжайте вести ваш канал 😀 мне лично нравится ваша подача материала.
Игорь, спасибо большое за качественные видео! Как преподаватель, учусь увлекательной подаче материала :) Если не секрет, что за модель микрофона? Буду благодарна ответу.
Проверьте пути, которые указаны для изображений. Возможно путь строится от корня. Проще всего открыть вкладку «Network» в инструментах разработчика и посмотреть запросики к незагруженным ресурсам.
А как же автоматизация? Можно же не пакет gh-pages вручную каждый раз запускать (что можно и забыть сделать), а написать файлик gh-actions, чтобы гитхаб сам по пушу в main запускал у себя на сервере пересборку приложения и пушил его в ветку gh-pages (на что так же среагирует встроенный экшен деплоя). Пакет gh-pages при этом не нужен совсем.
Спасибо за урок но подскажите когда я сделал деплой по Вашей методеке у меня такая ошибка когда я перехожу по роуту failed to fetch dynamically imported module как можна пофиксить использую (const Tab = ({ tab }) => { const MyTabs = lazy(() => import(`/${tab.path}`)); return (
Сложно подсказать не видя всей информации. Но здесь проблема импорте модуля. Возможно модуль, который в импортируете (путь `tab.path`) не существует или лежит не в том месте (например, путь строится с учётом корня). Откройте инструмент Network в инструментах разработчика и посмотрите откуда происходит импорт модуля.
@@antonov_i прикол в том что в dev разработке работаєт на ура а вот в build такая ошибка думал что может какие то настроики для vite есть для функции const MyTabs = lazy(() => import(`/${tab.path}`)); мне кажется здесь проблема с lazy
@@ЯрославПриступлюк Хм, странно. Запишу себе, как будет время попробую посмотреть. Но не знаю когда получится. Есть мысль сейчас записать видео про реализации SSR.
Про переменные окружения было бы неплохо посмотреть😊
Игорь, спасибо большое за видео! Очень просто и понятно, долго искала информацию, а ваше видео разложило всё по полочкам, всё работает☺
Спасибо огромное!
Первый раз пишу комментарий, на столько зашло видео!))) Спасибо тебе!
По маршрутизации вообще класс, то что нужно
Игорь, огромное вам спасибо!!!!!!!!!! И спасибо этому чуваку rafgraph!!!! Но если бы не вы, Игорь, то как бы мы нашли этого rafgraph! Все работает! Как круто! И теперь при деплое на gh-pages нет ошибки 404 при перезагрузке. УРа!!!!!!!!!!
Спасибо большое! Такие вещи важные рассказал, вообще весь смысл в них. Это почти никто не рассказывает.
Крутяк!!!!! Уже стал переживать, так долго выпусков не было!!!
Работа + подготовка двух конференций сделали своё дело 😞
Рад что наткнулся на твоё видео, помог решить проблему с маршутизацией роутера. Большое спасибо за полезный контент и качественную подачу материала
Спасибо Игорь!!! Сейчас буду пробовать.
Спасибо за такое видео
Очень понятно
Очень помогло
Лучшее видео по деплою для новичков
Спасибо большое! Очень грамотно объяснено и приятно слушать !
огромное спасибооооо!!!!!
Спасибо, добрый человек!
Отлично объясняете , все работает !!! Огромное спасибо :)🤩
моё почтение, снимаю шляпу.
Очень круто, все работает, Вы просто золото
Реально помог, спасибо за труд!
Игорь крут!!! Спасибо!!
Как всегда всё круто и интересно! В будущем хотелось бы увидеть что-то подобное для проектов с SSR. Хотя бы в базовом виде. Какие особенности сборки, правильное взаимодействие между клиентом и сервером и т.д.
Добавлю в список. Давно хочется про Next сделать видео.
суперское объяснение, спасибо!
Игорь, bull's eye. спасибо
БЛАГОДАРЮ, ЦЕЛЫЙ ДЕНЬ УБИЛ НА ПОИСК, СПАСИБО
Лайкос тебе огромный! Все работает
13:15
Для тех, кто как я, не знает что значат флаги в npm install:
-D сокращение для --save-dev. Устанавливает пакет в дев зависимости, в те которые нужны только для программистов, а не для пользователей конечного продукта.
-E сокращение для --save-exact.
Устанавливает конкретную версию пакета, а не диапазон семантических версий.
Например, конкретная версия в файле package.json будет пронумерована так 16.1.0 (без символа каретки), а семантическая так ^16.1.0 (с кареткой перед цифрами). И если вы например клонируете репозиторий на новой машине, то вам надо будет запустить npm install, чтобы опять все пакеты установить. И в случае семантической версии у вас может установится более новая версия какого-нибудь пакета например версия 16.2.0, которая может конфликтовать, баговать с вашим кодом и пока вы это поймете, потеряете кучу нервов.
Пишу, потому что сама не знала что эти флаги значат, вдруг кто-нибудь тоже не знает, хочу помочь.
Инфа про версии с сайта plainenglish статья Best Way How To Install NPM Packages With an Exact Version.
Спасибо за дополнение! Кстати, более подробно про виды зависимостей можно посмотреть в отдельном видео - th-cam.com/video/c-n1NNaDZ0Y/w-d-xo.html. Здесь и optional, bundle, peer.
Спасибо за видео, очень помогло)
СПАСИБО)
Very good
очень помогло, спасибо тебе
Спасибо!
👍
Спасибо очень круто !!!
посмотрел и решил на vercel залить, где все гораздо проще:)
Похоже я скорее состарюсь, чем загружу свой первый проект на гитхаб)
Отличное понятное объяснение) Спасибо! Непонятен важный (!) момент по деплою - что за плагин для vscode дает красивые иконки в панели exlorer ?)
Я использую расширение vscode-icons (marketplace.visualstudio.com/items?itemName=vscode-icons-team.vscode-icons). Есть и другие, можно поискать по ключевому слову icons в списке расширений
Игорь, почему так часто пропадайте? Очень жду ваших видео :)
Спасибо за поддержку! Всему причина - работа, которая настигает даже в выходные. Октябрь был временем конференций и гостевых лекций в университете. В ноябре времени будет больше, видео вернуться. Скоро-скоро!
@@antonov_i Благодарю за ответ.
Понимаю что работа отнимает у вас свободное время.
В любом случае продолжайте вести ваш канал 😀 мне лично нравится ваша подача материала.
Игорь, спасибо большое за качественные видео! Как преподаватель, учусь увлекательной подаче материала :)
Если не секрет, что за модель микрофона? Буду благодарна ответу.
Спасибо за поддержку )) Начиная с этого видео у меня Rode Procaster (XLR). В прежних был Nady 1CX (USB)
выглядит костылево
"repository" обязательно должен быть "Public" ?
Спасибо! Очень полезно. Пыталась задеплоить six-cities-13, но почему-то не подгружается logo и pin. С чем это может быть связано?
Проверьте пути, которые указаны для изображений. Возможно путь строится от корня. Проще всего открыть вкладку «Network» в инструментах разработчика и посмотреть запросики к незагруженным ресурсам.
@@antonov_i спасибо, помогло)
А как же автоматизация? Можно же не пакет gh-pages вручную каждый раз запускать (что можно и забыть сделать), а написать файлик gh-actions, чтобы гитхаб сам по пушу в main запускал у себя на сервере пересборку приложения и пушил его в ветку gh-pages (на что так же среагирует встроенный экшен деплоя).
Пакет gh-pages при этом не нужен совсем.
Всё верно. Я упоминал о варианте с gh-actions, но в видео его не разбирал. Повод сделать отдельный материал.
Здравствуйте. Подскажите, пожалуйста, как настроить github pages для проекта с фронтэндом на react(после сборки все файлы в папке build), и бэкэндом ?
Здравствуйте. Фронтенд разворачивать точно также. А вот back на GitHub Pages развернуть не получится (
Подскажите как сделать без Vite?? Плиззз
Так никто для create react app поправки и не написал в комментах
Почему-то у меня нет файла index.tsx
Почему реакт супер популярен, но такие базовые проблемы с роутингом решаются какими-то костылями?
В данном случае это особенность хостинга, GitHub Pages
@@antonov_i а на других, например netlify, таких проблем не будет?
Спасибо за урок но подскажите когда я сделал деплой по Вашей методеке у меня такая ошибка когда я перехожу по роуту failed to fetch dynamically imported module как можна пофиксить использую
(const Tab = ({ tab }) => {
const MyTabs = lazy(() => import(`/${tab.path}`));
return (
{tab.title}
);)
заранее спасибо
Сложно подсказать не видя всей информации. Но здесь проблема импорте модуля. Возможно модуль, который в импортируете (путь `tab.path`) не существует или лежит не в том месте (например, путь строится с учётом корня). Откройте инструмент Network в инструментах разработчика и посмотрите откуда происходит импорт модуля.
@@antonov_i прикол в том что в dev разработке работаєт на ура а вот в build такая ошибка думал что может какие то настроики для vite есть для функции const MyTabs = lazy(() => import(`/${tab.path}`)); мне кажется здесь проблема с lazy
@@ЯрославПриступлюк Возможно. А какую именно ошибку выдаёт?
@@antonov_i failed to fetch dynamically imported module
@@ЯрославПриступлюк Хм, странно. Запишу себе, как будет время попробую посмотреть. Но не знаю когда получится. Есть мысль сейчас записать видео про реализации SSR.
Спасибо!