How to structure files and folders for a React Native app

#reactnative #react #javascript

An overview of how I prefer to structure a React Native project. I like to keep it simple.

Follow me on Twitter:

[abdu]

I'm newbie react native, it'd be great if you could start a new project series (starting from planning the app) where you build from scratch to maybe releasing it. this way we learn from your experience and will surely grow the channel. thank man

[shahzaibishaq]

Such a great representation of folder structure.

[wezter]

I think this is a quite simplistic model and I prefer dividing it up a lot more than this.
I'm not sure if you've worked much with feature isolation but that's something I really like for larger projects.
In src there could be something like the following folders:
assets: contains assets for the application
core: contains modules that are domain-aware
lib: contains modules that are domain-agnostic
components: contains the design / ui system for the application (I usually use atomic design for this)
features: contains a separate folder for each separate feature in the application such as Auth / Profile / Onboarding / etc that has their own navigation, possibly their own stores, their own hooks, sometimes their own components etc.

a core module should never import from a feature, lib should never import from core and there are probably some other things I forgot to mention

[JEsterCW]

I like the screen part, when we put all what we use for the screen cause lets say we have an app where we have searching something functionality and it only exist in this specific screen then its much easier to seperate it into an app if we would want, so its more modular, but then the main components folder is kinda losing its sense, better to make "shared" folder when we put shared things around our app. I also pretty focused on semantic and dx aspects to make my work and actions quicker and more comfortable. Im avoiding nested files and folders i dont really do that cause switcihng tabs, folders can be pain in the ass

[hariprasatht]

could you please tell me a way to do rtl layout without restarting the bundle ( i'm using i18Manager), thanks !

[dananjayachathuranga]

can u make a video about how to overlay text on an image, then save it to gallary ??

[_Rishabh-yqfj]

Hi Jimmy, could you make video on how to write function native lang bot android and iOS, and listen them on out screens using JS and vice-versa. basically define any function in native and call them on any screen using JS.
Thanks.

[pradeepucshorts]

Hi sir, what should i learn RN or flutter as a begginer?