App Project Structure & Guidelines

Project Structure

Every developer needs to follow the following structure and naming with the mobile app project.

Root Folders

1. Components
2. Fixtures
3. NativeModules
4. Resources
5. Screens
6. Store
7. Util

Folders Explanation

1. Components

We keep the reusable components in this folder. Each component has its own folder containing a Index.js. Component name must start with a capital letter. Styles of the component which are specific to the component reside in the same folder with the name of Styles.js. Shared styles reside in the Styles.js file inside the Resources folder. So as an example a CustomList component folder structure will be like the following:

• Components
• • CustomList
• • • Index.js
• • • Styles.js

Components have to be Stateless components.

2. Native Modules

This folder contains the .js files pointing to the Android/iOS Native Modules and must be in the same name with the actual native module.

3. Resources

This folder contains the following files and folders:

• Images [Folder containing the .PNG/.JPG image resources needed to be used in the project]
• Colors.js [General project colours]
• Dimens.js [General Font Sizes and Dimensions]
• Strings.js [General texts being used across the app]
• Styles.js [General styles being used across the app]