How to better organize your React applications?
Alexis Mangin
9.2K54

Tnx for article. I am noob in programming but im actually looking for resources on how to scale really large applications. What i am interested in is:
1) Total separation front-end from back-end (NodeJs)
2) Theming (one general app theme and several alternatives that user can switch later)
3) Global CSS over Theme and Local CSS to style some small things. I want to have one or several Global CSS for component size and positioning that is used by some themes. Theme is holding the colors, fonts and other effects. Local CSS sometimes is needed to style some very custom thing that doesn't fit in Layout or Theme or Global CSS.
4) Separated Layout — Layout is holding just a how containers (components) lay on my page and what is their positioning.
5) Reusable components — like, buttons, panels, tree-panels, grids and so on what is used over and over in hundreds of places.
6) I like the idea of Living Style-guide and would like to connect it somehow to app. So i always can see all components i can use.
7) Also important thing — One Component = One Folder.

Imagine MS Outlook software. There is one App with many Sub-Apps (Mail, Tasks, Calendar and so on) They all use the same components, but have different layouts. And user also can switch from light to dark theme.

I know i wrote some mess there, but those are thing i want to understand and to learn first. When i will have this big picture, it will be much more easier for me to learn React. I don’t care about small shit mobile apps and don’t want to spend time to learn hoe to build to-do apps. We have too much shitty mobile apps in market. So i want to focus on enterprise-grade apps.

If anybody saw some really good book on how to structure such React applications, please write me. I will be rally thankful.

Like what you read? Give Dzintars Klavins a round of applause.

From a quick cheer to a standing ovation, clap to show how much you enjoyed this story.