Как загрузить сайт React JS на хостинг

В этом видео я пошагово покажу как загрузить сайт, сделанный с помощью JavaScript библиотеки React js, на хостинг. При загрузке сайта на хостинг существуют некоторые нюансы, о которых я расскажу и покажу как их решить. На хостинге HandyHost есть бесплатный период на месяц, так что каждый сможет попробовать загрузить свой сайт React js на хостинг.
Хостинг HandyHost: handyhost.ru/hosting/?from=31...

[@SuprunAlexey]

RewriteEngine On RewriteBase / RewriteRule ^index\.html$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteCond %{REQUEST_FILENAME} !-l RewriteRule . /index.html [L]

[@muhammedyashar9126]

А в проекте использовалась база данных???

[@user-ke6yx9zx8n]

@@muhammedyashar9126 нет

[@kseniazh1738]

@@user-ke6yx9zx8n Спасибо тебе, добрый человек, за файл !!!

[@MSiL_UA]

Пол дня сидел думал как исправить эту фигню. Роутинг норм работае, переходишь на роут - обновил страницу и ошибка, а тут все гуд...СПАСИБО!!!

[@znatniy-pekar]

Блин спасибо тебе за труд мужик. Я три дня пытался запилить свой сайт на хостинг. Пытался через firebase, GitHub пока не наткнулся на твой ролик и наконец все получилось. Кстати сегодня прошел ровно год как я написал свое первое Hello world и наконец то я залил свой первый сайт. Это такой кайф

[@timbright4336]

Спасибо за труд! Успехов тебе в дальнейшем! Дело это не бросай, все здорово получается.

[@shhdevon]

спасибо огромное! уместил огромный обьем информации в 7 минут, за это респект)

[@web2130]

Спасибо вам,посмотрел весь плейлист ,много понял.Благодарю.

[@hellohost7870]

Большое спасибо, все очень просто и понятно. С heroku всю ночь возился.

[@o_petrushchak]

gh-pages попробуй

[@konstantin.artifex]

А требуется ли какие нибудь расширения к хостингу, например не во всех тарифах предусматривается nodejs. Во всех ли хостингах есть окружение Node JS?

[@IzyLifeVlog]

Очень полезный туториал!) Респект за труд!) Очень интересно было бы услышать в рамках данного курса о настройках CEO тегов и вообще про то как видят боты этот сайт. Я новичок, но знаю что SPA пока может видеть только бот от гугла. Почему-то про это мало информации

[@yakub8798]

видео оказался очень полезным, спасибо вам !

[@AleksMosquito]

Чувак спасибо тебе, реально топ контент!

[@vovaer5003]

Спасибо за видео-урок, помогло!

[@Pashkathebest]

Благодарю. Очень пригодилось!

[@serhiistanislav]

Работает! Благодарю за подсказку ;)

[@brucewayne_007]

Спасибо. Всё очень понятно

[@andra1846]

Ребят! Я новенькая в Реакте и сильно туплю, как в в самом Реакте, так и в терминологии. Я поняла, что билд подготавливает папку для публикации на хосте. А могу я сама сразу создавать нужные файлики на хостинге, чтоб не мудохаться локально с нодом?

[@AnnabelleSwan]

Спасибо Вам огромное за Ваше объяснение !!! Вы мне очень помогли =)

[@maxamax5695]

! ! ! ВОПРОС ! ! ! ПО КАКОМУ АДРЕСУ ОТПРАВЛЯТЬ АПИ ЗАПРОСЫ ? ЕСЛИ БЭК И ФРОНТ ЛЕЖИТ НА СЕРВЕРЕ. ИЛИ ДАЙТЕ ИНФОРМАЦИЮ О ТОМ ГДЕ ПОСМОТРЕТЬ АДРЕС? БУДУ ОЧЕНЬ ПРИЗНАТЕЛЕН ЗА ПОМОЩЬ)

[@anushkomilov]

Super!!! Спасибо автору.

[@ioannhide3355]

супер! ничего не работало из за настройки сервера ) огромный респект!!!!!!!!

[@Edvard-Aliev]

Крутой курс! А будет с базой данных продолжение?!

[@NewWorld_and_Me]

Большое спасибо, всё понятно, всё легко и доступно для понимания новивкам. Было бы отлично довести всё до логического завершения, доделать форму обратной связи чтобы она работала, доделать футер, возможно привязки к соц сетям итд. Простите если говорю ерунду, но для меня это в новинку, вторую неделю сижу за реактом и все больше и больше он мне нравится.

[@xeniya5489]

Согласна, мне было бы тоже полезно посмотреть урок про форму обратной связи.

[@user-ry4gk1kb1h]

Жаль что вы обычно не отвечайте спустя столько лет

[@karoche-tv]

Привет 🖐 как выгрузить проект на реакте из гитхаба на firebase? Я запустил на локалке на порту 3000 работает но бекенд не пашет на опенсервере. Там в проекте работает добавление изображений и текста. Все добавляется но после очищения cookie кеш не чего нету.

[@vardanmeloyan7297]

Огромное спасибо!

[@TheMrAndrogamer]

Здравствуйте, такой вопрос, у меня есть сайт на реакте и нужно сделать возможность добавления новостей и все, нужно ли писать свою админку или какую-нибудь cms подключать? К чему подключить реакт сайт проще? Видео отличное, спасибо!)

[@user-ry4gk1kb1h]

узнал?

[@arthurosipov8283]

Спасибо большое!

[@timlftv]

Спасибо, файл .htaccess помог разобраться с роутингом) А то настраивали-настраивали и ничегошеньки не работало. Искали инфу по поводу этого в интернете и думали уже нашего бэкендера дёргать, а оно вот как просто)

[@crogot]

❓ Самый главный вопрос, почему после билда страничка не открывается просто в браузере, а нужно именно через сервер, ведь по сути это html и jscript который выполняется на стороне клиента?

[@user-sj5in5lt8s]

cors

[@janbolotnurlanbekuulu7948]

Internal Server Error вот такая ошибка что делать

[@ivan4486]

Полезно. Только остался вопрос как подключить переменные окружения.

[@xXXBetManXXx]

Захостить можно только 1 React приложение на GitHub?

[@Virass]

У меня все равно белая страница после сборки проекта. Полдня просидел над вопросом и взял в аренду впс 😅

[@sergey1277]

Почему в видосе сайт не показывается после сборки без сервера?? Там же онли html и преобразованный JS не?

[@ArthurYelkin]

Благодарен)

[@PitMit]

Дякую за відео!!!!)))

[@SuprunAlexey]

Все получилось?

[@PitMit]

Web Developer Blog ще не пробував)))

[@vancheshigh859]

У меня с файлом .htaccess не компилируется почему-то.

[@antonyakovlev759]

Огромное спасибо! Ещё очень хочется узнать как установить react рядом с разметкой отрендеренной на сервере с помощью PHP ?

[@SuprunAlexey]

Это прям тема для отдельного видео

[@user-gb2qs2hj3g]

А содержание файла htacces где то есть? В комментариях не увидел.

[@peli_]

Большое спасибо за цикл лекций. Вопрос если я хочу что то поменять в компонентах или страницах, какие мои действия, чтобы обновления появились на хосте?

[@SuprunAlexey]

Проделать ту же операцию

[@peli_]

@@SuprunAlexey Я правильно понимаю, что сделав изменения например в About.js мне нужно сделать npm build в консоли и обновленные документы переложить в файлзиллу или достаточно только один обновленный файл переложить? Спасибо заранее

[@mishagabrelyan9495]

Здраствуйте! У меня ошибка при команде serve -s build, кто нибудь знает как это можно пофиксить?

[@user-cb7hz5ig5p]

заебись работает спасибо

[@alastair5989]

3:09, в паре кадров данные засветились

[@touze69]

офигеть😂

[@whicencer8819]

если поставить на 0.25 и клацать пробел. всё видно. Причём отчеливо

[@spartansk3052]

Ни когда не делал на реакте, по старинке html страницы, подключал бутстрап. А как такие страницы индексируются? хорошо всё с этим? Можно ли на реакте админку какую сделать или в этом роде, что бы в блоге добавлять посты не идя в код?

[@SuprunAlexey]

Реакт не для таких целей

[@spartansk3052]

@@SuprunAlexey посоветуешь чего? ну типо такого maxfarseer.gitbooks.io/react-course-ru/content/dobavit_novost.html какой нибудь localStorage, например на тел. себе запоминалку .apk делал Ну или записывать куда то хоть в файл, читать их. Я просто реакт освоить хочу вот старт=) еще фишку MDB еще присматриваю вот например mdbootstrap.com/docs/jquery/components/demo/#cards карты это лента новостей например, только я их сам добавляю/ред/удаляю. Мне понравилось с bootstrap работать

[@spartansk3052]

На тел. софтину делал, юзал это. Но лучше уж куда то записывать, что бы сохранялось. var elements = document.querySelectorAll('input, number'); function checkValidity() {}; for (i=0; i

[@detorm4462]

благодарю , полезное видео! кстати там замазанные даны остаются видны на долю секунды, но видосу почти 3 года так что думаю нормально

[@BigDaddy-zp6hz]

react реально тема

[@parabellum577]

npm run build не создает папки build

[@sia4281]

А как настроить отправку форм на почту?

[@maxamax5695]

! ! ! ВОПРОС ! ! ! ПО КАКОМУ АДРЕСУ ОТПРАВЛЯТЬ АПИ ЗАПРОСЫ ? ЕСЛИ БЭК И ФРОНТ ЛЕЖИТ НА СЕРВЕРЕ. ИЛИ ДАЙТЕ ИНФОРМАЦИЮ О ТОМ ГДЕ ПОСМОТРЕТЬ АДРЕС? БУДУ ОЧЕНЬ ПРИЗНАТЕЛЕН ЗА ПОМОЩЬ)

[@k_ilya]

Короче можно не мучаться с .htaccess и прописать в package.json "homepage": ".", Только если используется роутинг реакта, придётся использовать HashRouter. Ибо BrowserRouter будет работать, но при обновлении страницы будет выдавать 404 А если роутинга нет и приложение труЪ одностраничное, то вообще отличное решение.

[@justkrem7764]

Как раз столкнулся с данной проблемой, сделал свое первое React-приложение, как раз испол-ся там BrowserRouter и оно как раз многостраничное. И еще есть проблема изначальной стартовой home загрузки

[@iBird]

А что делать для тех у кого nginx? Там htaccess не работает

[@SuprunAlexey]

А там через сам Nginx надо настраивать

[@gffg6514]

сделай пж практику php

[@rusganeev]

Спасибо! А как авторизацию делать? сессии?

[@SuprunAlexey]

Бэкенд нужен

[@danielkhachaturian]

@@SuprunAlexey как их связать? будет видео по этому поводу? Если уже есть -- пжалста ткните

[@Fs-xj2gu]

а если на bestHost загружать У меня что то не открывает сайт Белый фон

[@leonziger2496]

та же проблема :( на хостинге который тут рекламировался

[@user-dx1qd3nd8j]

@@leonziger2496 можешь скинуть код сайта?

[@leonziger2496]

@@user-dx1qd3nd8j уже неактуально

[@AlexanderShustik]

Довольно забавно наблюдать, как к концу курса все меньшее количество людей его смотрят))

[@Kiyanti]

До конца доходят самые стойкие)

[@samborsky_pro]

Супер! Спасибо бро

[@maxamax5695]

! ! ! ВОПРОС ! ! ! ПО КАКОМУ АДРЕСУ ОТПРАВЛЯТЬ АПИ ЗАПРОСЫ ? ЕСЛИ БЭК И ФРОНТ ЛЕЖИТ НА СЕРВЕРЕ. ИЛИ ДАЙТЕ ИНФОРМАЦИЮ О ТОМ ГДЕ ПОСМОТРЕТЬ АДРЕС? БУДУ ОЧЕНЬ ПРИЗНАТЕЛЕН ЗА ПОМОЩЬ)

[@user-cb5lb2wz4f]

Не работает React приложение не разворачивают :( Звонил в службу поддержки, сделал все по видео.

[@eugeenyjoy]

Так, и? Как редактировать то приложение? Или все изменения вносятся на локальной машине? Но ведь будет изменяться бек, значит будут несоответствия файлов. Не думаю что те кто создают приложения делают их на один раз.

[@SuprunAlexey]

Переписать файл

[@whitesakurai]

Ахахахахаха

[@whitesakurai]

@@SuprunAlexey Мда, не думал что всё на столько плохо бывает с мозгами, как относишься к таким особо забавным комментариям?

[@tochcha2971]

@@whitesakurai С мозгами, похоже у тебя непорядок. Если человек задает вопрос, то он наверное чего-то недопонял. Или здесь задают вопросы те, кто умом блеснуть хочет? Конкурс на самый умный вопрос? Ты еще напиши, что только тупые задают вообще вопросы, умник млин...

[@tochcha2971]

@@SuprunAlexey мне вот тоже не понятно, если есть задача, изменить текст на кнопке. То есть, какая-то простейшая задача. То у нас путь только один - раздобыть исходники, развернуть react на локалке, заменить текст в нужном компоненте, забилдить и выложить обратно на хостинг, правильно я понимаю?

[@user-lc7mo3rj9j]

У меня не получается

[@SHARDloh]

3:08 там есть 1 кадр где все его данные показываются

[@sergeyk7285]

Нафига эта ненужная информация о fizile о каком то хостинге. Где инфа о настройке packege. json, homepage , снимают какой-то бред и называют это пошаговой инструкцией. Жирный минус

[@user-ly4qf7oz8c]

Смысл реакта с перезагрузкой страницы

[@sergeyk7285]

Зачем вы снимаете видео в котором отсутствует информация о ПРАВИЛЬНОЙ загрузке приложения разработанного на React js на хостинг?. Все что здесь изложено не работает. У многих не получилось, они вам задали вопрос и не получили на него ответ.

[@City__Walker]

все это хорошо но httacess вариант не работает в GithubPages

[@zakiro4277]

получилось ?

[@s1lentgrave]

я не могу в вк использовать http(((((((

[@iGotton]

+

[@psihp6]

Если тебе этот аккаунт еще нужен лучше замаж по лучше, а то есть кадр где все данные видны.

[@SuprunAlexey]

Просто удалил этот аккаунт и все)

[@inigoloy]

И что на этом все? А продолжение?

[@SuprunAlexey]

Завтра курс по реакт

[@artemsdobnikov259]

в чем смысл использовать реакт, если сайт получается чисто статика? реакт не для этого создан

[@SuprunAlexey]

Артём Сдобников да я ж показать как работать с бутстрапом и компонентами, а вы во всем критику ищете

[@blackout1819]

нихера не работает. залил сайт и белая страничка

[@user-dx1qd3nd8j]

можешь отправить код сайта пожалуйста?

[@SashaKorjos]

Тоже самое белая страничка

[@dear_up]

смогли ли вы решать, у меня тоже самое проблема

[@MiqayelPetrosyan]

в данный момент их хостинг не поддерживают сайты на node.js