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

Рет қаралды 59,203

4 жыл бұрын

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

Пікірлер: 113

@SuprunAlexey 4 жыл бұрын

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

@muhammedyashar9126 4 жыл бұрын

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

@user-ke6yx9zx8n 4 жыл бұрын

@@muhammedyashar9126 нет

@kseniazh1738 2 жыл бұрын

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

@MSiL_UA 9 ай бұрын

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

@znatniy-pekar 3 жыл бұрын

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

@timbright4336 4 жыл бұрын

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

@shhdevon 3 жыл бұрын

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

@web2130 3 жыл бұрын

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

@hellohost7870 3 жыл бұрын

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

@o_petrushchak 3 жыл бұрын

gh-pages попробуй

@IzyLifeVlog 3 жыл бұрын

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

@vovaer5003 2 жыл бұрын

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

@yakub8798 Жыл бұрын

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

@Pashkathebest 2 жыл бұрын

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

@konstantin.artifex 6 ай бұрын

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

@brucewayne_007 Жыл бұрын

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

@serhiistanislav 3 жыл бұрын

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

@anushkomilov 9 ай бұрын

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

@ioannhide3355 3 жыл бұрын

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

@AleksMosquito Жыл бұрын

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

@vardanmeloyan7297 2 жыл бұрын

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

@NewWorld_and_Me 4 жыл бұрын

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

@xeniya5489 4 жыл бұрын

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

@user-ry4gk1kb1h Жыл бұрын

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

@arthurosipov8283 Жыл бұрын

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

@andra1846 2 жыл бұрын

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

@Edvard-Aliev 4 жыл бұрын

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

@AnnabelleSwan 7 ай бұрын

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

@maxamax5695 5 ай бұрын

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

@karoche-tv 2 жыл бұрын

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

@timlftv Жыл бұрын

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

@ArthurYelkin 2 жыл бұрын

Благодарен)

@TheMrAndrogamer 4 жыл бұрын

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

@user-ry4gk1kb1h Жыл бұрын

узнал?

@PitMit 4 жыл бұрын

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

@SuprunAlexey 4 жыл бұрын

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

@PitMit 4 жыл бұрын

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

@xXXBetManXXx Жыл бұрын

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

@crogot 3 жыл бұрын

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

@user-sj5in5lt8s 2 жыл бұрын

cors

@ivan4486 4 ай бұрын

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

@sergey1277 Жыл бұрын

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

@peli_ 4 жыл бұрын

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

@SuprunAlexey 4 жыл бұрын

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

@peli_ 4 жыл бұрын

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

@k_ilya Жыл бұрын

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

@justkrem7764 Жыл бұрын

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

@Virass 2 жыл бұрын

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

@janbolotnurlanbekuulu7948 3 жыл бұрын

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

@sergeyk7285 3 жыл бұрын

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

@user-gb2qs2hj3g 3 ай бұрын

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

@antonyakovlev759 3 жыл бұрын

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

@SuprunAlexey 3 жыл бұрын

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

@mishagabrelyan9495 Жыл бұрын

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

@alastair5989 4 жыл бұрын

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

@touze69 3 жыл бұрын

офигеть😂

@whicencer8819 3 жыл бұрын

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

@vancheshigh859 2 жыл бұрын

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

@spartansk3052 4 жыл бұрын

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

@SuprunAlexey 4 жыл бұрын

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

@spartansk3052 4 жыл бұрын

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

@spartansk3052 4 жыл бұрын

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

@BigDaddy-zp6hz 3 жыл бұрын

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

@detorm4462 Жыл бұрын

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

@sia4281 10 ай бұрын

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

@rusganeev 4 жыл бұрын

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

@SuprunAlexey 4 жыл бұрын

Бэкенд нужен

@danielkhachaturian 3 жыл бұрын

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

@gffg6514 4 жыл бұрын

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

@parabellum577 3 жыл бұрын

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

@user-cb7hz5ig5p 6 ай бұрын

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

@eugeenyjoy 3 жыл бұрын

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

@SuprunAlexey 3 жыл бұрын

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

@whitesakurai 3 жыл бұрын

Ахахахахаха

@whitesakurai 3 жыл бұрын

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

@tochcha2971 2 жыл бұрын

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

@tochcha2971 2 жыл бұрын

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

@iBird 3 жыл бұрын

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

@SuprunAlexey 3 жыл бұрын

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

@AlexanderShustik Жыл бұрын

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

@Kiyanti 6 ай бұрын

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

@Fs-xj2gu 4 жыл бұрын

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

@leonziger2496 4 жыл бұрын

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

@user-dx1qd3nd8j 3 жыл бұрын

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

@leonziger2496 3 жыл бұрын

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

@SHARDloh 7 ай бұрын

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

@user-cb5lb2wz4f Жыл бұрын

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

@maxamax5695 5 ай бұрын

@sergeyk7285 3 жыл бұрын

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