• Stars
    star
    628
  • Rank 71,541 (Top 2 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created almost 9 years ago
  • Updated over 6 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

React Native Meteor Boilerplate

This is a simple way to get started building an app with React Native and Meteor. It is opinionated to make it easy for people to start but if you have your own way of doing things it's very easy to swap things out and move them around however you see fit.

As it currently stands this project is only focused on configuring the React Native project. The Meteor side is up to you. For thoughts on how to structure your Meteor App I would suggest you read the Meteor Guide and the Mantra spec.

You can checkout a very quick walkthrough of the project here.

Getting Started

  • Install Meteor
  • Install React Native
  • Clone Repo: git clone https://github.com/spencercarli/react-native-meteor-boilerplate.git
  • From the MeteorApp directory run meteor npm install
  • From the RNApp directory run npm install

Running on iOS Simulator

Note: You must be on a Mac for this.

  • Be sure your Meteor app is running: In the MeteorApp directory, type meteor

You've got a few ways you can run the app for iOS:

  • From the RNApp directory run react-native run-ios

Running on iOS Device

Note: You must be on a Mac for this.

  • Be sure your Meteor app is running: In the MeteorApp directory, type meteor
  • Get the IP address of your machine (you can run ipconfig getifaddr en1 to do so)
  • In RNApp/app/config/settings.js change localhost to your machine's IP address
  • Plug your device into your computer (make sure it's on the same network)
  • Open the project in Xcode
  • Select your device in Xcode and press "Build and run"

For further information please reference the official docs.

Running on Android Simulator

  • Be sure your Meteor app is running: In the MeteorApp directory, type meteor
  • Get the IP address of your machine
  • In RNApp/app/config/settings.js change localhost to your machine's IP address
  • Make sure you have an emulator configured and running.
  • From the RNApp directory run react-native run-android

On OSX you can get your IP address by running ipconfig getifaddr en1 in a terminal window.

On linux running ifconfig will get you a list of your network interfaces along with their IP addresses. For the stock Google simulator you will want to use the IP of your active network connection (probably eth0 or wlan0). If you are using the Genymotion simulator, it runs in a Virtual Box VM with a Host-only network interface. You will want to use the IP address of this network which may look like vboxnet0 under ifconfig.

Running on Android Device

  • Be sure your Meteor app is running: In the MeteorApp directory, type meteor
  • Make sure USB Debugging is enabled
  • Plug your device into your computer
  • Run adb devices to make sure your device shows up
  • Run adb reverse tcp:8081 tcp:8081
  • In RNApp/app/config/settings.js change localhost in METEOR_URL to your computer's IP address (see note in "Running on Android" section on how to get your IP Address)
  • Run react-native run-android

For further information please reference the official docs.

Linux Setup for Android Dev

Configure how the device will connect to the meteor server. See running android on a device to pick from the options.

Plug in your device and use lusb to find the first 4 digits of your device ID.

lsusb Bus 001 Device 003: ID 04e8:2e76 Motorola PCS

Enter this in udev rules. In the example we are copying over 04e8

echo SUBSYSTEM=="usb", ATTR{idVendor}=="04e8", MODE="0666", GROUP="plugdev" | sudo tee /etc/udev/rules.d/51-android-usb.rules

Check that your device is properly connecting to ADB, the Android Debug Bridge, by using:

adb devices

Note: You should have only one active ADB connection. If you have a simulator running you should close it before proceeding.

These steps are abstracted from the pages running on device selecting the Linux Tab.

Questions?

If you have any questions please open an issue. Thanks!

More Repositories

1

getting-started-react-navigation

JavaScript
380
star
2

react-navigation-auth-flow

JavaScript
277
star
3

meteor-todos-react-native

JavaScript
191
star
4

react-native-snapchat-clone

JavaScript
106
star
5

react-native-keyboard-avoidance-examples

JavaScript
98
star
6

react-native-push-notification-how-to

Objective-C
95
star
7

react-native-splash-screen-demo

Objective-C
67
star
8

react-native-meteor-index

54
star
9

animated-react-native-flatlist-demo

JavaScript
53
star
10

demo-react-native-router-flux

JavaScript
49
star
11

react-nativegraphql-auth-client

JavaScript
30
star
12

searchable-react-native-flatlist

JavaScript
29
star
13

meteor-react-native-authentication

JavaScript
26
star
14

quick-meteor-react-native

Objective-C
23
star
15

react-native-dynamic-scrollview

Dynamically enable scrolling for a React Native ScrollView based on content height.
JavaScript
23
star
16

react-native-meteor-offline-example

JavaScript
21
star
17

offline-redux-actions

JavaScript
18
star
18

react-native-onesignal-example

Objective-C
17
star
19

getting-started-react-native-navigation

Objective-C
16
star
20

react-native-meteor-accounts

Objective-C
16
star
21

ex-navigation-to-react-navigation

JavaScript
14
star
22

navigation-comparison

Objective-C
11
star
23

react-native-bar-graph-animation-example

Objective-C
10
star
24

react-native-redux-meteor

JavaScript
10
star
25

react-navigation-enhancement-experiment

JavaScript
7
star
26

meteor-react-native-password-hashing

JavaScript
6
star
27

react-native-meteor-google-oauth

Objective-C
6
star
28

Instagram-Style-Double-Tap-with-React-Native

JavaScript
6
star
29

node-ddp-client

JavaScript
6
star
30

meteor-cordova-photolibrary

JavaScript
5
star
31

react-native-flat-list-grid-example

JavaScript
4
star
32

react-native-js-navigator-example

JavaScript
3
star
33

meteor-accounts-google-oauth

JavaScript
3
star
34

react-navigation-iphonex-test

JavaScript
2
star
35

next-expo-monorepo

TypeScript
1
star
36

cross-platform-button-react-native

JavaScript
1
star
37

dotfiles

Shell
1
star
38

react-native-image-fade-example

JavaScript
1
star
39

sanity-gatsby-blog

Blog with Gatsby
JavaScript
1
star
40

meteor-client-react-native

Objective-C
1
star