@Borya0_0

Как связаны между собой сервер node.js и фронтенд react?

Я только начинаю изучать веб разработку. На этапе разработки я создаю react приложение на 3000 порту и сервер node.js на 80 порту. Чтобы просмотреть сайт захожу на 3000 порт, и соответственно react представляет страницу используя данные от сервера (axios). Но правильно ли я понимаю, что на этапе продакшена мы должны подключаться только к одному порту, на котором находится сервер, а он отправит html, css, js файлы при первом запросе на главную страницу а в дальнейшем будет отправлять JSON? Или как это организовано? И еще вопрос при использовании npm run build я получаю папку build, где много css и js файлов. Как эту папку надо связать с node.js. Допустим мы при первом запросе на сервер отправляем HTML файл. Но как клиент получит нужный ему css и js файл из кучи в папке build. Я хотел найти подобные посты или видео, однако не смог ничего найти. Может подскажите туториал или видео, где создается полноценный сервер node.js с папкой build. Везде нахожу только подход где создается react app на 3000 порту и сервер на другом порту.
  • Вопрос задан
  • 144 просмотра
Решения вопроса 1
Kentavr16
@Kentavr16
long cold winter
правильно ли я понимаю, что на этапе продакшена мы должны подключаться только к одному порту, на котором находится сервер, а он отправит html, css, js файлы при первом запросе на главную страницу а в дальнейшем будет отправлять JSON?
В зависимости от настроек сервера и архитектуры твоего проекта. Экспресс может как отдавать хтмл/css,так и служить для обмена данными бека с фронтом(апи). Во втором случае за раздачу хтмл может отвечать какой-либо популярный веб-сервер, nginx/apache.
при использовании npm run build я получаю папку build, где много css и js файлов. Как эту папку надо связать с node.js

Никак. На стадии билда участие ноды в проекте заканчивается (в случае с фронтом, естественно. Если у тебя сам сервер, бекенд на ноде, то там нужно запускать это дело на хосте). Ты размещаешь свой код на веб-сервере, который его раздает в дальнейшем клиентам.
Допустим мы при первом запросе на сервер отправляем HTML файл. Но как клиент получит нужный ему css и js файл из кучи в папке build.
все как в обычном html. Есть точка входа в виде хтмл-файла, к которой твой билдер уже привязал все стили/скрипты. Все это отдается клиенту.
Это базовый сценарий. Есть другие способы, такие как SSR например. Но это уже другая история.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы