Skip to content

A basic react native app with react-native-firebase pre-integrated so you can get started quickly.

License

Notifications You must be signed in to change notification settings

findmory/react-native-starter

 
 

Repository files navigation

React Native "Firebase" Starter

Backers on Open Collective Sponsors on Open Collective npm version NPM downloads Chat Twitter Follow


A basic react native app based off: react-native-firebase to get you started quickly.

This doesn't have firebase pre-integrated but has the Pod framework setup to easily follow their instructions to add it or other Pod based frameworks.

I also added Mobx and react-navigation


Getting Started

If you're only developing for one platform you can ignore the steps below that are tagged with the platform you don't require.

1) Clone & Install Dependencies

  • 1.1) git clone https://github.com/findmory/react-native-starter.git
  • 1.2) cd react-native-starter - cd into your newly created project directory.
  • 1.3) Install NPM packages with your package manager of choice - i.e run yarn or npm install
  • 1.4) [iOS] cd ios and run pod install - if you don't have CocoaPods you can follow these instructions to install it.
  • 1.5) [Android] No additional steps for android here.

2) Rename Project

You will need to be running Node verison 7.6 or greater for the rename functionality to work

  • 2.0) [iOS] cd .. to return to the root directory of the project
  • 2.1) npm run rename - you'll be prompted to enter a project name and company name
  • 2.2) Note down the package name value - you'll need this when setting up your Firebase project

3) [OPTIONAL] Add Google Services files (plist & JSON)

  • 3.1) [iOS] Follow the add firebase to your app instructions here to generate your GoogleService-Info.plist file if you haven't done so already - use the package name generated previously as your iOS bundle ID.
  • 3.2) [iOS] Place this file in the ios/ directory of your project.
  • 3.3) [Android] Follow the manually add firebase to your app instructions here to generate your google-services.json file if you haven't done so already - use the package name generated previously as your Android package name.
  • 3.4) Place this file in the android/app/ directory of your project.

4) Start your app

  • 4.1) Start the react native packager, run yarn start or npm run start from the root of your project. This will launch Metro Bundler. (if you don't do this Xcode will run it for you in the terminal.)
  • 4.2) [iOS] Build and run the iOS app, run react-native run-ios from the root of your project. The first build will take some time. This will automatically start up a simulator also for you on a successful build if one wasn't already started. Also you can just open XCode and run the .Workspace project.
  • 4.3) [Android] If you haven't already got an android device attached/emulator running then you'll need to get one running (make sure the emulator is with Google Play / APIs). When ready run react-native run-android from the root of your project.

If all has gone well you'll see an initial screen like the one below.

Screenshots

preview

React Native Debugger

Launch RNDebugger by the following command:

$ open "rndebugger://set-debugger-loc?host=localhost&port=8081" The host, port is mean React Native packager, you may need to set port if you custom the packager port. (8081 by default)

in Simulator use CMD-D to open Dev menu. Turn on "Hot reloading" and "remote debugging"

Building

In Xcode Switch Product > Scheme > Edit Scheme > Build Configuration from Debug to Release.

Contributors

This project exists thanks to all the people who contribute. [Contribute].

Backers

Thank you to all our backers! 🙏 [Become a backer]

Sponsors

Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [Become a sponsor]

License

About

A basic react native app with react-native-firebase pre-integrated so you can get started quickly.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 50.1%
  • Objective-C 22.6%
  • Java 14.8%
  • Python 9.0%
  • Ruby 3.5%