时间戳

首页 > 解决方案 > 如何构建按功能或模块拆分的 java 后端和 reactjs 前端项目

reactjs - 如何构建按功能或模块拆分的 java 后端和 reactjs 前端项目

问题描述

这是我想做的，构建我的项目（reactjs 前端和 java 后端），该项目具有基于特性的 java 中的多个模块。这是我对文件夹结构的想法：

<project name> 
- auth0
 - src
  - main
   - java
- security
 - src
  - main
   - java
- core
 - src
  - main
   - java
   - **ui**
- <feature 1>
 - src
  - main
   - java
   - **ui**
- <feature 2>
 - src
  - main
   - java
   - **ui**
- <feature n>
 - src
  - main
   - java
   - **ui**

因此，基本的 reactjs 和 java 后端模块是核心，因此这是主要代码所在的位置，当我添加新功能时，我将添加逻辑（java）和 ui 相关代码。我如何能够在 maven 或 gradle 中进行设置，以便在构建时可以将所有功能都内置到功能应用程序中？

标签： reactjsspring-boot

解决方案

乍一看，这似乎很有序，但是使用这种文件夹结构，从长远来看，您会遇到问题。

此外，您不遵循通用约定，并且通常如果您开始制作自己的结构，那么稍后将使用您的项目的人会感到困惑。因此，我建议您不要这样做。

话虽如此，您的反应应用程序是在您将其构建在静态的 dist 文件夹中之后！通常，react 应用程序不是从与后端相同的位置提供服务的。这对于可扩展性来说要好得多。例如，您可以从数字海洋水滴或 VM 为您的静态反应应用程序提供服务，而您的后端代码由 AWS 或任何其他 VM 提供服务。

所以最后你的代码还是分开了！

如果您仍然希望继续您的想法，您可以在项目根目录中设置一个节点项目，然后编写一个 webpack 编译器。然后你需要创建一个没有npx create-react-app.

一些有用的阅读：

https://dev.to/underscorecode/creating-your-react-project-from-scratch-without-create-react-app-the-complete-guide-4kbc

我强烈建议您不要这样做，因为无论如何您都不会直接在前端使用后端代码的任何功能。

您可以做的是在机器人应用程序中具有相同的文件夹结构：

Project
 - Backend
  - feature 1
 - Frontend
  - src
   - feature 1

推荐阅读