richTheCreator/RN_GUARD

🛡📱 Defend your React Native app!

Motivation 💡

RNG is intended to be a source of inspiration for building your own react-native application. It has enough that you can move past the "what should I use" phase and right into building!

Defend your app, take your shield!🛡

Contents

1. Tools
2. Theming
3. Routing
4. Getting Started
5. Demo

⚔️ Tools

Built for the modern RN developer.

✅ ES6
✅ Eslint
✅ Axios
✅ MobX
✅ MobX-Persist
✅ React-Native V0.51.0
✅ React-Native-FBsdk
✅ React-Native-Router-Flux V4
✅ React-Native-Easy-Grid
✅ React-Native-Vector-Icons

🎨 Simple Theming

"Update once, update everywhere."

Start a consistent design system from the start.

How To

Create or copy a folder that includes:

1. Index.js
   
2. Styles.js
   
3. Component.js
   

In Styles.js place import { Colors, Fonts } from '@theme/'

In Component.js place import Styles from './Styles'

🛡 Secure Routing

The router is protected with a combination of the fb-sdk, mobx, mobx-persist, and react-native-router-flux.

RNG-Server:

In order for this to work, you need to also download and install the RNG-Server.

Custom Server:

Change these few files and functions:

1. Open userStore.js
2. Replace signIn, signUp, createUser, and fetchUser
3. Update api.js with your server address

🔰 Getting Started

Step 1: Install React-Native

Make sure you're set up for React Native

Step 2: Check Node Version

Make sure you have Node 6.5+

You can check your version of node by running

node -v

Step 3: Run

yarn

If you don't have it, install Yarn for your system.

Step 4: Link

rnpm link

Step 4: Server Setup

Head over to the repo and follow the install instructions.

or provide your own server 😄

Step 5: Install the FBsdk

Make sure you have followed all the steps in the React-Native-Fbsdk

A couple of tips!

1. Make sure you have the FacebookSDK folder in ~/Documents
2. Check xCode Build Settings --> Framework Search Paths for a path to step 1.
3. If no path, drag your FacebookSDK folder from ~/Documents in
4. Check your info.plist for proper credentials
5. Open an issue if all else fails

📱 Demo:

⭐ Let me know if this helped ⭐

I know I forget to star repos from time to time, but please do if this helped!