ReactJS. The folder structure I feel most comfortable with

Discover how I organize folders for medium-sized projects

Due to the very nature of ReactJS, there is no defined folder structure, leaving it up to the developer to choose the one that best suits the project to be developed.

However, this often brings quite a few headaches since, in the absence of a standard structure, different ways of approaching this organization often arise, often raising the question of whether we are doing it “well”.

I put the word good in quotes because that concept of “good” is very relative both to the project and to the mentality of the developer or the team in charge of the project. Certain structures are usually optimal for certain mental models but not for others, so my advice is to try different methodologies before choosing yours.

For example, to me the structure proposed by Atomic Design, although it seems very good for small projects, does not fit me mentally in large projects, as it causes certain components under the same logical concept to end up separated in different folders.

So, as long as you do not turn the project into an unmanageable tangle of components, cross dependencies and elements that are located in folders without attending to specific reasons, you can…