🚀 Setup fully pre-configured React Native Project using react-native-app-builder NPM

Do you want to know how to create react native project which is preconfigured with initial setups like authentication, theme, localization, redux, saga, and Fastlane?

This blog will help you to achieve your task in few minutes as well as enrich your understanding of the react-native project structure.

I hope you have an initial setup of react-native app development.

Quickstart

• Ensure your machine has the React Native dependencies installed
• All you need to use is npm library react-native-app-builder
• Open your Terminal and create an empty directory and follow these steps.

1. npx react-native-app-builder <ProjectName>
2. cd <ProjectName>
3. npx react-native run-ios
4. npx react-native run-android

What's inside

• Latest react-native version with react hooks
• Redux saga with persistReducer
• Localization and Theme support (Dark / Light) Setup with React Context
• App Button is demo for Custom Component
• Custom font and font size for maintaining typography
• .env setup to support different env for PRODUCTION and DEVELOPMENT
• User Authentication flow
• UI for Login, Tabs, and Settings
• Fastlane setup

Directory Structure

root
├── __tests__
├── android
├── ios
└── App
└── Actions
| ├── Keys
└── ApiConfig
└── AppContext
└── Localization
└── Reducers
| ├──Default
└── Routes
└── Sagas
└── Screens
| CommonComponent
| Components
| SubComponents
└── Services
└── Stores
└── Theme
| Images
└── Utils
├── fastlane
├── .env
...


User Interface

The predefined user interfaces will look like as below...

Hope this npm package will helpful for your next application development.

Your comments will be helpful for me to create such content.

Start developing...