Question

我正在将一个相当基本/传统的Django webapp重构为更现代的React-plus-Django-REST设置。我对Django比React更熟悉，所以在哪里放置React部分对我来说很困惑。

我的问题是：使用Django和React时文件夹结构的最佳做法是什么？我曾经有过的想法：

将所有React文件放在自己的文件夹中，如下所示： SIGN = + UNIT = 1 UNIT2 = 3 print(UNIT SIGN UNIT2)
将所有React文件放在静态文件夹中，但这对我来说似乎不对。

是否有一套既定的最佳实践？

Answer 1

大多数情况下，后端和前端有两个独立的项目：

使用Django构建ReST API我强烈建议您查看Django REST framework（如果您还没有）。该主页上有一个简单的教程，可以让您启动并运行。

对于React应用程序"React Create App"似乎是现在启动项目的标准方法。有关分步说明，请参阅链接的GitHub页面。

然后按照此"Proxying API Requests in Development"指南将API请求代理到您的开发设置。

Answer 2

我同意Igonato关于为前端和后端分别开展项目的问题。当客户端（前端）将对服务器（后端）进行Ajax（API）调用并使用响应数据时，客户端将呈现页面。

特别是对于react，您需要将反应代码转换为缩小的js和css，以便在生产服务器上获得更高的性能。

您可以在后端使用djangorestframework并设置django服务器。对于前端，这里有几个选项： 1.你可以使用dva（如果你打算使用redux）。 dva很好。我建议在应用程序中的状态管理变得复杂之前不要使用redux。 2.如果您不打算使用redux，那么您可以使用create-react-app

对于前端，如果您想使用基于材料设计的应用程序，我建议使用antd。它在您的应用程序中需要很多UI元素。它的战斗经过考验。我已经在~9个应用程序中使用它，我在过去6个月内已经完成了。

Answer 3

正如其他人所提到的，使用不同的存储库是解决此问题的常用方法。但是对于较小的团队/较小的项目，单个存储库就足够了。

要将所有内容保存在一个仓库中，您需要为react应用创建一个单独的for文件夹，通常我将其命名为projectname-client。如果您使用的是create-react-app，则可以通过将该路径添加到设置文件来提供index.html文件夹中的build。

# settings.py
# Path to the frontend app build directory
BUILD_DIR = os.path.join(BASE_DIR, '{{ project_name }}-client/build')
TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [
            BUILD_DIR
        ],
        ...
    },
]
STATICFILES_DIRS = [
    os.path.join(BUILD_DIR, 'static'),
]

# urls.py
urlpatterns = [
    ...
    path('', TemplateView.as_view(template_name='index.html'), name='index'),
]

如果您有兴趣，我正在使用django-admin startproject模板设置项目以使用create-react-app。你可以看看here。

React和Django REST的文件夹结构

3 个答案: