A react-native and react boilerplate. Build apps targeting web, iOS and Android!
- Node 4.x or better
- React Native for development
- Xcode for iOS development (optional)
- Android SDK for Android development (optional)
- Android Lollipop or better for Android device testing (optional)
- React for web app development
- React Native for native app development
- Babel for ES6+ support
- Webpack module loader and bundler
- Eslint for better code lint
- Add Redux
- Add production build config for webpack
- More...
Start by cloning this repo and installing dependencies:
git clone https://github.com/xiaobuu/react-native-react-boilerplate.git rnr-kit && cd $_
npm install # or simply npm i
Once dependencies are installed, run the kit with:
npm start
This will start a Webpack Dev Server and React Packager. The dev server will watch your JS files for changes and automatically lint and generate the index.[platform].js
files expected by your React Native iOS or Android app.
Open ios/App.xcodeproj
in Xcode, build and run the project.
Unlike the app currently generated by react-native init
this app removes the UIViewControllerBasedStatusBarAppearance
key to prevent the app from logging an error in Xcode and leading to an App Store rejection. The key may be added back, if desired, but its value must be set to true
to prevent unexpected rejection during the review process.
For android development use the following:
npm run android-setup-port
react-native run-android
For web development with hot reloading use the following:
npm run start-web
As a minimalist seed this project does not introduce a testing framework. Instead it leverages simple static code analysis to help prevent coding mistakes and introduce some good practices for building React Native apps with ES6.
Webpack is configured with a pre-loader to lint the application with ESLint using the Babel parser during app development. And the npm test
command may be run at anytime to lint source code otherwise. See the .eslintrc
file to adjust linter rules to your liking.
Building the app for distribution.
- Execute
npm run bundle
to generate the offline JS bundle. - For iOS, update
AppDelegate.m
to load from pre-bundled file on disk. - Test the application, create an archive and submit to the store.
Please see Submitting to App Store for instructions on iOS. If you have any good Android instructions, please send a PR this way. Good luck and have fun out there!
react-native-webpack-starter-kit A minimal boilerplate for react-native