ReactNativeStarterKit
Another simple, powerful starter kit for real life project.
Screen shot
Dependencies
- react-native-vector-icons
- native-base
- agiletech-navigation // build-in
- redux, react-redux, redux-logger, redux-saga, redux-form, redux-persist
- lodash, color, apisauce
- react-native-progress
- react-native-progress-image
- react-native-image-picker
- react-native-splash-screen
- iPhoneX supported
Folder structure
/src
/assets project resource files
/components All related component
/Afternteractions You should not care about this
/Header
/Footer
/Navigator Navigator
/SideBar
options.js All SideBar items
/Toast
/Image Custom Image with progress
/ProgressImage Progess image build-in
/Gallery Gallery
/Browser Inapp-browser
/elements Dump component without state
/constants App constants
/container App screens
/store App store/action/reducer/saga/api
/actions Actions
/api API
/reducers Reducers
/saga Sagas
/selectors State selectors
/theme NativeBase theme
App.js App root
routes.js Router configuration
index.js Root Component (RN 49+)
Setup project
git clone https://gitlab.com/anhtuank7c/ReactNativeStarterKits.git example
cd example && yarn
react-native-rename example -b vn.agiletech.example
yarn ios|android or react-native run-ios|run-android as usual
- Remember to change
persist keyPrefixin~/store/index.jsline25
npm shortcut
Run project
yarn android
yarn ios
Build, Install APK
// build apk
yarn ba
// install apk to android after build
yarn ia
// run reverse
yarn adb-reverse
Generate icon and splash screen
We already have design.sketch template file
// install tool
brew install imagemagick
npm install -g yo generator-rn-toolbox
// generate splash screen images
yo rn-toolbox:assets --icon icon.png --splash splash.png --store
- splash.png: square 2048x2048
- icon.png: square 512x512
Integrate Map
Guide here