关于部署重 Django + React.js 网络应用程序的建议

IT技术 django reactjs django-rest-framework web-deployment web-hosting
2021-05-16 05:11:29

最近构建了一个Django应用程序,它有一个数据库并根据React.js前端的请求执行一些浮点运算(biopython、alpha 形状和来自数据库的晶体数据的类似算法

我想知道什么是长期部署这样的东西的最佳方式,以及两个代码库如何相互通信(目前在 localhost 上运行良好)。我遇到了一些建议,例如 django 的数字海洋和前端的 firebase,当然还有 heroku。


然而,我从来没有主持过一个最终会投入生产的网站,更不用说两个了,我有点不知所措

  1. 两个代码库如何相互通信,
  2. 如何在部署时保留 django 虚拟环境中安装的所有包,
  3. 如何在线传输调用的数据库。

我非常感谢任何指向要阅读的资源或架构建议的指针。万分感谢!

1个回答

我使用Django制作了一些应用程序React.js,对我来说最好的方法如下:

  • “经典”后端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_apiReact.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中将在合适的位置(运行后npm build获得您的项目的构建,否则在开发环境中您将必须运行您的服务器:npm start

您可以从一些链接中获得灵感,就像我一样:

希望它可以帮助您了解如何结合使用这两个框架!