🚀 React Native 🚀 starter app that uses all the latest 💯 & greatest 🏅 components! - Screens & Demo

Demo

Platform	iOS	Android
Demo

Content

• Installation
• Run it
• Summary
• Technologies
• Screens
• Demo
• Editor Setup
• TODO
• FAQ

Installation

• Install React-Native

• git clone [email protected]:Monte9/react-native-starter.git

• cd react-native-starter

• yarn

Running the app

• For iOS, from the command line, run via command: react-native run-ios or open XCode and load project, Run Product -> Run (⌘+R)

• For android, from the command line, run via the command: react-native run-android assuming you have an emulator or device running and attached

• Hack on!

Summary

1. The app is runs on BOTH iOS & Android using a single codebase mostly written in Javascript.
2. The app has Login & Signup screens with reducers for user input, login & signup actions.
3. The Login & Signup screens display a spinner to indicate activity.
4. The app includes a Tab Bar Controller and is customizable to add more tabs.
5. Each Tab Bar has it's own navigation state and hence can provide independent navigation states.
6. The app uses Navigation Experimental to handle navigation.
7. The app also includes a Side Menu and it's customizable.

Technologies

The following are brief descriptions of the technologies used

React-Native

Learn once, write anywhere: Build mobile apps with React

Redux

Redux is a predictable state container for JavaScript apps.

If you'd like to read an excellent tutorial on Redux check this out: https://egghead.io/courses/getting-started-with-redux

React Native Navigation Experimental

If you are looking for greater control over your navigation stack, you can't go wrong with NavigationExperimental.

React Native Tab Navigator

Tab Bar component for React Native

React Native Side Menu

Side menu component for React Native

React Native Elements

React Native Elements UI Toolkit

React Native Vector Icons

3000 Customizable Icons for React Native with support for NavBar/TabBar/ToolbarAndroid, image source and full stying.

React Native Screens

React Native implementation for Do, a free UI kit.

Screens

Login & Signup

Platform	iOS	Android
Login
Signup

SideMenu

Platform	iOS	Android
SideMenu

Tab Bar 1: Feed

Platform	iOS	Android
Feed
Explore

Tab Bar 2: Portfolio

Platform	iOS	Android
Portfolio
Reload

Tab Bar 3: Profile

Platform	iOS	Android
Profile
History

Editor Setup

Atom

Package: Nuclide

UI Theme: One Dark

Syntax Theme: Gloom

Additional Packages:

apm install editorconfig es6-javascript javascript-snippets linter linter-eslint language-babel

TODO

• AsyncStorage

• Facebook Login

• Twitter Login

• I18n

• Validate.JS

• Tcomb Form Library

• Jest & Snapshot tests

FAQ

Are you accepting PR's?

Yes. This project is actively under development. PR's are much appreciated.

"Work is it's own reward!" -Monte Thakkar