Boilerplate for iOS app development with React Native, ES6 and Reflux

Overview

react-native, es6 & reflux boilerplate

As the very long repo title indicates, this is a boilerplate repository that includes the following:

  • ES6-to-ES5 transpilation using Babel
  • Uni-directional data-flow architecture using Reflux

Getting started

  1. Clone this project

  2. Install dependencies:

    $ npm install
  3. Start the webpack watcher (it builds the index.ios.js file expected by React Native)

  4. Open ReactNativeEs6Reflux.xcodeproj in XCode and run the project - it should look like this:

    iOS Simulator running this boilerplate

Javascript file structure

  - src/
    stores/ -  Reflux stores
      color_store.js - Example store implementation
    components/ - React components
      app.jsx - Top-level app component

    action.js - Reflux action definitions
    styles.js - StyleSheet definition(s)
    main.js   - Application bootstrap with react-native, transpiler entry-point

Included in the example:

  • A simple top-level App component with example styles (in src/styles.js)
  • An example interaction using TouchableOpacity, and an example Reflux action (defined in src/actions.js)
  • An example AppMessageStore Reflux store, which handles setting the random message when the React logo is tapped.

Author

This boilerplate was created by Filipe Dobreira. It includes auto-generated code (through react-native init), and code by Roman Liutikov (namely the webpack configuration).

You might also like...
Boilerplate of a React Native project in Typescript.
Boilerplate of a React Native project in Typescript.

ReactNativeTS โš ๏ธ Not maintained anymore, better check Microsoft/TypeScript-React-Native-Starter. Minimal template of a React Native project with Types

๐Ÿš€๐Ÿš€๐Ÿš€Build universal cross-platform apps with React Native. Includes latest iOS, tvOS, Android, Android TV, Android Wear, Web, Tizen TV, Tizen Watch, Tizen Mobile, LG webOS, macOS/OSX, Windows, KaiOS, FirefoxOS Firefox TV platforms
๐Ÿš€๐Ÿš€๐Ÿš€Build universal cross-platform apps with React Native. Includes latest iOS, tvOS, Android, Android TV, Android Wear, Web, Tizen TV, Tizen Watch, Tizen Mobile, LG webOS, macOS/OSX, Windows, KaiOS, FirefoxOS Firefox TV platforms

build universal cross-platform apps with react native Introduction Video Quick Start โ€ข Features โ€ข Templates โ€ข Plugins โ€ข Integrations โ€ข JSON Configurat

Rhinos-app is a react-native app which uses react-native-web to achieve cross-platform design.
Rhinos-app is a react-native app which uses react-native-web to achieve cross-platform design.

Rhinos-app Rhinos-app is a react-native app which uses react-native-web to achieve cross-platform design. Live Demo: web version ๐ŸŒŸ FEATURES: ๐Ÿ“ฑ ๐Ÿ’ป Ru

Demo app for React Native Elements (w/ React Native Web)
Demo app for React Native Elements (w/ React Native Web)

React Native Elements App Mobile App This is the Demo app for React Native Elements built with Expo. The purpose of this app is to demonstrate the usa

React Native Starter App with NativeBase + CodePush + Redux
React Native Starter App with NativeBase + CodePush + Redux

Discontinued in favour of ReactNativeSeed.com Native Starter Kit v6.1.0 A Starter Kit for React Native + NativeBase + React Navigation + Redux + CodeP

React Native Typescript starter kit / template (Redux Thunk + React Native Navigation v7 + TSLint)
React Native Typescript starter kit / template (Redux Thunk + React Native Navigation v7 + TSLint)

React Native Template - TypeScript An opinionated React Native Starter Kit with React Native Navigation + Redux + Airbnb TSLint to build iOS and Andro

React Native + React-Redux + Native Base + Code Push

React-Native-Starter-Pack React Native + React-Redux + Native Base + Code Push ##Setting Up Project npm i -g rninit rninit init new-app-name --sourc

cross platform app with react in a monorepo

react-native-web-workspace An minimum boilerplate that has configured a native app running also on the web in the same monorepo. For a thorough discus

๐Ÿ‘พ Clean and minimalist React Native template for a quick start with TypeScript.

๐Ÿ‘พ React Native Template TypeScript Clean and minimalist React Native template for a quick start with TypeScript. โญ Features Elegant usage directly wi

Comments
  • Upgrade to React Native 0.5.0

    Upgrade to React Native 0.5.0

    Hey,

    Thanks for the fantastic seed project for react-native, es6 and flux :smile:

    It didn't quite work for me because of two issues. I've upgraded to the latest version of react-native and fixed the two issues I encountered at the same time.

    I have xcode 6.2 (i'm stuck on Mavericks :disappointed: ).

    Thanks,

    Richard

    opened by richardgill 3
  • Module not found

    Module not found

    ERROR in ./~/react-native/Libraries/react-native/react-native.js Module not found: Error: Cannot resolve module 'SegmentedControlIOS'

    I get this after running npm run-script webpack - why is that?

    opened by martolini 3
Owner
Filipe Dobreira
Filipe Dobreira
Barton Hammond 4.6k Jan 2, 2023
๐Ÿš€A powerful react native starter template that bootstraps development of your mobile application

React Native Starter ?? View Demo | Download | More templates | Support forum You're viewing the new and updated version of React Native Starter, prev

Flatlogic 2k Jan 5, 2023
Simple ReactNative starter with an opinionated folder structure for mobile development.

Simple React Native Starter Simple ReactNative starter with an opinionated folder structure for mobile development. Getting Started Ensure you've foll

Patrick Ofilada 73 Sep 6, 2022
Pepperoni - React Native App Starter Kit for Android and iOS

Futurice React Native Starter Kit โš ๏ธ Deprecation Warning Dear community, as time moved on so did React Native and we've not been able to provide conti

Futurice 4.6k Jan 4, 2023
Infinite Red's cutting edge React Native project boilerplate, along with a CLI, component/model generators, and more!

Ignite - the hottest React Native boilerplate Battle-tested React Native boilerplate The culmination of five years of constant React Native developmen

Infinite Red, Inc. 14.7k Jan 5, 2023
a React Native and Meteor boilerplate

a React-Native and Meteor boilerplate INTRO This project aims to put together the following technologies: React Native (as frontend) Meteor 1.4 (as ba

Fabio Fumis 24 Feb 14, 2022
React-native Boilerplate and Chuck Norris

RNboilerplate A React-native boilerplate with api integration (Chuck Norris facts). Getting Started npm install Rename project Install the Package re

Ali Ayyad 17 Jul 24, 2022
React Native Boilerplate - Redux + Saga + Reselect + redux-persist + react-navigation + TypeScript

React Native Boilerplate with Typescript Overview This React Native template for building solid applications through SOC(separation of concerns) betwe

Mengheang Rat 14 Oct 5, 2022
React Native Meteor Boilerplate

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 fo

Spencer Carli 634 Nov 21, 2022
Get your favorite boilerplate of React Native

ReactNativeSeed.com This repo is used to collect stars for ReactNativeSeed.com. About ReactNativeSeed.com provides you with a number of React Native B

GeekyAnts 655 Dec 6, 2022