/RNStarter

A cross platform starter for react-native + web + redux + codepush. Support for iOS, Android and Web.

Primary LanguageJavaScript

RNStarter

A cross platform starter for react-native + web + redux + codepush. Support for iOS, Android and Web.

Getting Start

All the commands should run on the root directory of project.

  • Clone repository and rename app if you want.
git clone https://github.com/eastonqiu/RNStarter.git MyApp

Rename App Name to Your App

cd MyApp
./rename.sh MyApp
  • Env Nodejs version > 5 and < 6. (5.7.0 recomended) Use nvm to manage nodejs versions.
  • Install
npm install -g react-web-cli  # use react-web for web environment
npm install -g code-push-cli # use code push for updating dynamically
npm install  # install all dependent modules

resource setting and hack some modules to support web, you can refer to support_for_web.sh for more details.

./support_for_web.sh
  • Icon Font Icon fonts setting for android automaticallyI(support_for_web.sh), ios coming soon. (you need set it manually for iOS, refer to react-native-vector-icons)
  • copy config, config file is gitignore and specified in local env.
cp src/config.js.example src/config.js

Dev Running

  • iOS
react-native run-ios
  • Android
react-native run-android
  • Web
react-web start

This command will start the web dev server and use Hot Module Reloading. Open http://localhost:3000 in browser.

Release App

cd android && ./gradlew assembleRelease

The generated APK can be found under android/app/build/outputs/apk/app-release.apk Test the apk on device.

  • Web Bundle the release version:
react-web bundle

webpack will generate the release bundle in web/output and link the icon font folder (react-native-vector-icons). Using Http Server(apache or nginx, etc...) to show the index.html in web/output.

Dynamic Update for iOS and Android

More details, please refer to react-native-code-push. Some bash scripts in the project make it simple.

  • iOS coming soon...
  • Android
./bundle.android.sh         # generate release bundle for android
./codepush_release.sh     # release a new version to code push server

show the deployment history

./codepush_history.sh

Custom Splash

Use rn-splash-screen

  • iOS coming soon...
  • Android Replace the splash image in the android/app/src/main/res/drawable/splash.png

TODO

  • Reference List (Thanks)
  • Hack for web.
  • Support above coming soon...
  • Show a redux flow sample in doc
  • Add react-router for web
  • Add Server Side Rendering(SSR) for web
  • Rename app name
  • Support ESLint
  • Support travis
  • Support editorconfig

Issues

Issues are welcome, just commit PR.

License

MIT License