Как развернуть интерфейс ReactJS и серверную часть NodeJS / Express из одной и той же папки проекта?

Question

GitHub репо: https://github.com/byeung2019/MIQSTechnologies

Привет, ребята,

Это мой первый опыт развертывания веб-сайта в Интернете, поэтому я не понимаю, с чего начать.

Мой веб-интерфейс построен с использованием ReactJS, а мой бэкэнд использует NodeJS / Express / GraphQL для извлечения данных из внешнего API ( CryptoCompare ).

Мой сайт работает локально.

Каждый из моего внешнего и внутреннего интерфейсов имеет свой уникальный файл package.json и .env с соответствующими зависимостями и dev-зависимостями.

Благодаря моим исследованиям было рекомендовано использовать внешний интерфейс с помощью Netlify, а внутренний с Heroku.

Однако, так как это мое первое развертывание, я запутался в следующем:

1. Как развернуть веб-интерфейс и серверную часть отдельно из папки проекта с тем же , при этом они имеют собственный соответствующий файл package.json.

2. Нужно ли переписывать код в index.js в папке backend, чтобы подключить мои frontend запросы GraphQL к моему бэкэнду.

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

Answer 1

Прежде всего, это сложный вопрос, чтобы дать точный ответ, вам придется поискать в Google и узнать немногое.Но вот идея высокого уровня.

После разработки любого приложения с использованиемact или angularjs вы можете следовать инструкциям по сборке и собрать приложение.Например, ng build --prod в угловыхТогда вам просто нужно развернуть сборку, и она не зависит от package.json

Вы должны развернуть свое бэкэнд-приложение как есть, и есть несколько вариантов, которые вы можете использовать, наиболее распространенными являются

• Использование прокси-сервера, такого как nginx
• Размещение сборки внутри бэкэнда узла

Ниже приведено руководство по размещению приложений с использованием nginx для nodejs и angular https://www.journaldev.com/27234/nginx-reverse-proxy-node-angular

Надеюсь, вы поймете идею.