Как подключить существующее приложение Django к существующему приложению реакции с помощью веб-пакета

Question

Итак, у меня есть проект Django, который выступает в качестве внутреннего REST-сервера, и я хотел бы интегрировать его с существующим проектом React, который выполняет вызовы AJAX на этот REST-сервер. Опять же, оба эти проекта уже существуют, я просто хочу их соединить. Допустим, корнем моего проекта Django является DJANGOROOT, и именно здесь находится manage.py. В моем проекте Django есть пара приложений Django, которые являются частью проекта. Допустим, мой проект Django называется "mydjangoproj", два приложения Django называются "myapp1" и "myapp2", а проект React называется "myreactproj". Каждый из этих двух проектов (проект Django с двумя приложениями и проект React) хранится в отдельном репозитории GIT, и для подключения их на моем сервере у меня есть следующая структура каталогов:

DJANGOROOT/
DJANGOROOT/mydjangoproj
DJANGOROOT/mydjangoproj/settings.py
DJANGOROOT/mydjangoproj/urls.py
DJANGOROOT/mydjangoproj/static/
DJANGOROOT/mydjangoproj/templates/
DJANGOROOT/myapp1
DJANGOROOT/myapp2
DJANGOROOT/myreactproj
DJANGOROOT/myreactproj/package.json
DJANGOROOT/myreactproj/src
DJANGOROOT/myreactproj/src/index.js
etc

Обратите внимание, что корневая папка приложения React находится внутри DJANGOROOT и параллельна моим папкам проекта и приложения django.

Приложение React использует модуль npm, называемый response-scripts (см. https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#npm-run-build), который имеет скрипт сборки, который соберет все содержимое в DJANGOROOT/myreactproj/src (начиная с index.js) и поместит все это в папку с именем DJANGOROOT/myreactproj/build. Когда я запускаю сборку (используя "npm run build"), она заполняет папку DJANGOROOT / myreactproj / build следующим образом:

DJANGOROOT/myreactproj/build
DJANGOROOT/myreactproj/build/index.html
DJANGOROOT/myreactproj/build/{several other files}
DJANGOROOT/myreactproj/build/static
DJANGOROOT/myreactproj/build/static/css
DJANGOROOT/myreactproj/build/static/js
DJANGOROOT/myreactproj/build/static/media

Таким образом, похоже, что для подключения Django к моему приложению React мне нужно найти способ, чтобы корневой путь для Django (mydomain.com/) указывал на DJANGOROOT/myreactproj/build/index.html. Я понимаю, что должен создать "домашний" шаблон, который запускается представлением Django, запущенным на mydomain.com/, и этот домашний шаблон должен запускать приложение React примерно так:

{% load render_bundle from webpack_loader %}
{% render_bundle 'main' 'js' 'DEFAULT' %}

Но я не уверен, как именно мне нужно указать Django, где искать main.js (или это index.js), и я не уверен, как заставить Django видеть все статические вещи в DJANGOROOT / myreactproj / build / статический.

Я также запустил "npm list webpack" внутри DJANGOROOT / myreactproj, чтобы получить версию webpack, и она показывает это:

└─┬ react-scripts@1.0.11
  └── webpack@3.5.1 

Я предполагаю, что это означает, что используется веб-пакет 3.5.1, и он каким-то образом связан с activ-scripts v 1.0.11.

Также обратите внимание, что приложение Django уже работает под HTTPS под NGINX и UWSGI, так что это настоящий сервер, а не сервер разработки.

Может ли кто-то, кто прошел через этот процесс, пролить некоторый свет на то, что мне нужно сделать, чтобы все это правильно подключить?

Answer 1

Если ваше приложение реагирования использует django просто для получения данных через REST, почему вы хотите использовать реакцию в шаблонах django? Я думаю, что предпочтительным подходом здесь является разделение, а не интеграция. Создайте автономное приложение реагирования со своим собственным сервером (конечно, оба могут работать на одном физическом сервере) - таким образом ваше приложение реагирования и приложение django будут взаимодействовать только с помощью вызовов покоя и больше ничего не нужно. Если у вас есть какие-то активы в приложении django - переместите их в приложение внешнего интерфейса.