使用React.js和React Native组织混合应用程序的体系结构

Question

我打算使用MERN（MongoDB Express.js React.js Node.js）构建一个包含Web和移动界面的混合应用程序。我分别在Web和移动界面上使用React.js和React Native。

最终，我想添加一些我想快速培训的团队成员。

如何组织应用程序的体系结构和文件结构，使其尽可能具有可维护性，可扩展性，可重用性和可扩展性？

提前致谢。

Answer 1

我可以告诉你我是怎么做的，就像这样说，这取决于你的喜好：

app //Main folder
- animations //I keep my Lottie/Animation components here
- components //Re usable components like buttons, forms, lists. 
-- Component1 //Folder for this particular component
--- Component.js //Actual component class
--- index.js //Index that exports the component. Useful if you have multiple subcomponents
--- styles.js 
- config //Environmemt and strings variables
- graph //This is where I keep my graph components
- hoc //Higher Order Components
- lib //Generic helpers that are re used across the apps, like function for test JSON objects, parsers, etc. 
- navigation //Navigation components, layouts, screens, etc. 
- core //This folder that exports the different components I support with the module. 
.babelrc
index.ios.js
index.android.js
package.json
gulp.js //Gulp Config
jsconfig.js //Jest Config

我不使用redux，因为我的大多数组件都是无状态的，只依赖于行为道具。如果您打算这样做，您可能有更多的文件夹。

到目前为止，它一直对我有用。我有一些使用此模块的子应用程序。