-
This is an extension of the ignite react-native boiler plate. It uses eslint-recommended and utilizes Ignite
-
This is an advanced boilerplate which uses react-native, redux-saga, redux-persist, apisauce. It will be a very useful to kickstart your project if you are using these frameworks/librarirs. Or want to have some strict linting style.
-
We have used react-native-extended-stylesheet in this project. Since every mobile application should be responsive even if we don't use flex-layout for all the styling in the application. Instead of using the StyleSheet provided by react-native, we recommend using the stylesheet provided by this library.
Removed modules/libraries from the original ignite react-native boiler plate
- storybook
- standard and snazzy linting guides
- react-native-i18
Step 1: git clone this repo:
Step 2: cd to the cloned repo:
Step 3: Rename the project bundleId, package name and application name.
Step 4: Install the Application with npm i
- cd to the repo
- Run Build for either OS
- for iOS
- run
npm run ios
- run
- for Android
- run
npm run android
- Use the sdk versions for any third party library you add as mentioned in Project/android/app/build.gradle. Since google forces to use target sdk 26 or onwards.
- run
This project adheres to "eslint:recommended" style guide. We have setup and enabled eslint for this project. We suggest that you keep following it. There are pre-commit hooks implemented to prevent bad commits. So if you don't lint your code before commititng it, you won't be able to commit it.
To Lint
This is implemented using eslint. Just run npm run lint
To Fix Lint Errors
run npm run fixcode
Bypass Lint And Run Project
If you have to bypass lint and just run the project for special case.
- for iOS
- run
react-native run-ios
- run
- for Android
- run
react-native run-android
- run
Understanding Linting Errors
The linting rules are from airbnb and React-Standard. Regular JS errors can be found with descriptions here, while React errors and descriptions can be found here. Airbnb errors can be found here. We have customised the linting as per our requirements. You can check the .eslintrc of the project and modify it as per your requirements.
This project uses react-native-config to expose config variables to your javascript code in React Native. You can store API keys
and other sensitive information in a .env
file:
API_URL=https://myapi.com
GOOGLE_MAPS_API_KEY=abcdefgh
and access them from React Native like so:
import Secrets from 'react-native-config'
Secrets.API_URL // 'https://myapi.com'
Secrets.GOOGLE_MAPS_API_KEY // 'abcdefgh'
The .env
file is ignored by git keeping those secrets out of your repo.
- Copy .env.example to .env
- Add your config variables
- Follow instructions at https://github.com/luggit/react-native-config#setup
- Done!