关于部署重型 Django + React.js 网络应用程序的建议
Recommendation on deploying a heavy Django + React.js web-application
我最近要构建一个 Django 应用程序,它有一个数据库并执行一些浮点运算(biopython、alpha 形状和晶体学上的类似算法来自 数据库 的数据)根据 React.js 前端的请求。
我想知道部署这样的东西的最佳方式是什么长期以及这两个代码库如何相互通信(截至目前在本地主机上运行良好) .
我遇到了一些建议,例如 django 的数字海洋和前端的 firebase,当然还有 heroku。
然而,我从来没有托管过一个最终会投入生产的网站,更不用说两个了,我有点不知所措
- 两个代码库如何相互通信,
- 如何在部署中保留安装在django虚拟环境中的所有包,
- 如何在线传输调用的数据库。
非常感谢任何指向可供阅读的资源的指针或架构建议。
非常感谢!
我使用 Django
和 React.js
制作了一些应用程序,对我来说最好的方法如下:
- "classic" 后端
django-rest-framework
和适合您的数据库,
- 从前端通过
django
API 调用后端。
我的项目的经典架构如下所示:
.
└── your_ambitious_project
├── frontend
│ ├── public
│ │ ├── favicon.ico
│ │ ├── index.html
│ │ └── manifest.json
│ ├── src
│ ├── package.json
│ └── ...
├── backend_api
│ ├── core_api
│ │ ├── models.py
│ │ ├── views.py
│ │ └── ...
│ └── backend_api
│ ├── __init__.py
│ ├── settings.py
│ └── ...
└── ...
假设您要使用 Nginx
,目的是:
- 让您的
backend_api
可供您的 React.js
前端应用程序访问,
- 让用户能够访问您的
frontend/public/index.html
。
对我来说,一个典型的 nginx.conf
文件应该是这样的:
upstream backend_api { # so we can access django backend api from frontend
server backend_api:8000;
}
# below: in dev environment only (for hot reloading)
# upstream frontend {
# server frontend:1337;
#}
server {
listen 80;
server_name your_ambitious_project;
location /api/ {
proxy_pass http://backend_api;
}
location / {
alias /var/www/frontend/build/; # for production environment
# proxy_pass http://frontend; # for dev environment (hot reloading)
}
}
然后,你必须让你的后端 api 可以从外部访问,所以你将使用 gunicorn
来做到这一点:
gunicorn siapi.wsgi:application --bind 0.0.0.0:8000
对于前端,在生产环境中 Nginx
将在合适的位置(在 运行ning npm build
之后)获得项目的构建,否则在开发环境中你将拥有至 运行 您的服务器:npm start
.
您可以像我一样从中获得灵感的几个链接:
希望它能帮助您了解如何结合使用这两个框架!
我最近要构建一个 Django 应用程序,它有一个数据库并执行一些浮点运算(biopython、alpha 形状和晶体学上的类似算法来自 数据库 的数据)根据 React.js 前端的请求。
我想知道部署这样的东西的最佳方式是什么长期以及这两个代码库如何相互通信(截至目前在本地主机上运行良好) . 我遇到了一些建议,例如 django 的数字海洋和前端的 firebase,当然还有 heroku。
然而,我从来没有托管过一个最终会投入生产的网站,更不用说两个了,我有点不知所措
- 两个代码库如何相互通信,
- 如何在部署中保留安装在django虚拟环境中的所有包,
- 如何在线传输调用的数据库。
非常感谢任何指向可供阅读的资源的指针或架构建议。 非常感谢!
我使用 Django
和 React.js
制作了一些应用程序,对我来说最好的方法如下:
- "classic" 后端
django-rest-framework
和适合您的数据库, - 从前端通过
django
API 调用后端。
我的项目的经典架构如下所示:
.
└── your_ambitious_project
├── frontend
│ ├── public
│ │ ├── favicon.ico
│ │ ├── index.html
│ │ └── manifest.json
│ ├── src
│ ├── package.json
│ └── ...
├── backend_api
│ ├── core_api
│ │ ├── models.py
│ │ ├── views.py
│ │ └── ...
│ └── backend_api
│ ├── __init__.py
│ ├── settings.py
│ └── ...
└── ...
假设您要使用 Nginx
,目的是:
- 让您的
backend_api
可供您的React.js
前端应用程序访问, - 让用户能够访问您的
frontend/public/index.html
。
对我来说,一个典型的 nginx.conf
文件应该是这样的:
upstream backend_api { # so we can access django backend api from frontend
server backend_api:8000;
}
# below: in dev environment only (for hot reloading)
# upstream frontend {
# server frontend:1337;
#}
server {
listen 80;
server_name your_ambitious_project;
location /api/ {
proxy_pass http://backend_api;
}
location / {
alias /var/www/frontend/build/; # for production environment
# proxy_pass http://frontend; # for dev environment (hot reloading)
}
}
然后,你必须让你的后端 api 可以从外部访问,所以你将使用 gunicorn
来做到这一点:
gunicorn siapi.wsgi:application --bind 0.0.0.0:8000
对于前端,在生产环境中 Nginx
将在合适的位置(在 运行ning npm build
之后)获得项目的构建,否则在开发环境中你将拥有至 运行 您的服务器:npm start
.
您可以像我一样从中获得灵感的几个链接:
希望它能帮助您了解如何结合使用这两个框架!