background preloader

A framework for building native apps using React

A framework for building native apps using React
Build native mobile apps using JavaScript and React React Native lets you build mobile apps using only JavaScript. It uses the same design as React, letting you compose a rich mobile UI from declarative components. import React, { Component } from 'react'; import { Text, View } from 'react-native'; class WhyReactNativeIsSoGreat extends Component { render() { return ( <View><Text> If you like React on the web, you'll like React Native. </Text><Text> You just use native components like 'View' and 'Text', instead of web components like 'div' and 'span'. </Text></View> ); }} A React Native app is a real mobile app With React Native, you don't build a “mobile web app”, an “HTML5 app”, or a “hybrid app”. Don't waste time recompiling React Native lets you build your app faster. Use native code when you need to React Native combines smoothly with components written in Objective-C, Java, or Swift.

Related:  crashwallReact NativeJavascript

Introduction · gl-react gl-react-dom for React DOM (web using WebGL).in progress gl-react-native for React Native (iOS/Android via OpenGL).in progress gl-react-expo for React Native (iOS/Android via OpenGL – Expo implementation).gl-react-headless for Node.js (used for testing for now) Cookbook, examples, API References They use gl-react 🙂 Gist

How to better organize your React applications? – Alexis Mangin – Medium When I started to learn React, I found a few very good articles explaining how to create Todo lists or very simple games. Those articles were very useful to understand the basics of React, but I quickly got to a point where I wasn’t able to find much about how I could use React to build actual applications, something with a few dozens pages and hundreds of components. After some research, I learned that every React boilerplate project on Github results to similar structures, they organize all the files by type.

The Minimal React Webpack Babel Setup - RWieruch - Edit this Post on GitHub Save Personally I bootstrapped a lot of React projects in the recent time. I always had to setup the project from scratch. The SoundCloud Client in React + Redux - RWieruch - Edit this Post on GitHub Save In the beginning of 2016 it was time for me to deep dive into the ReactJs world. Full-Stack Redux Tutorial Update 2016-02-24: Updated react-router to 2.0.0. In tests, replaced use of deprecated setProps() with ReactDOM.render(). Also now using the react-addons-test-utils package so that no imports of 'react/addons' are needed anywhere. Update 2015-11-06: Updated to the new Babel 6 release. The Babel packages we need to install are now a bit different, and an additional "babel" section is needed in the package.json in both projects. Update 2015-10-09: Updated to React 0.14, React Router 1.0.0 RC3, and jsdom 6.x.

Leveling Up With React: React Router By Brad Westfall On This tutorial is the first of a three-part series on React by Brad Westfall. When Brad pitched me this, he pointed out there are a good amount of tutorials on getting started in React, but not as much about where to go from there. Secure Your React and Redux App with JWT Authentication TL;DR: Redux is a state container for JavaScript applications by Dan Abramov that lets us have a predictable unidirectional data flow. It offers some benefits over other libraries like Flux, but works in similar ways. In this article we explore how to add JWT authentication to a Redux app. Check out the repo to go straight to the code. There are many benefits to using unidirectional data flow in single page applications. Perhaps the biggest is that as applications become larger, it is easier to reason about how data affects the app's states and views.

Ecosystem · Redux Redux is a tiny library, but its contracts and APIs are carefully chosen to spawn an ecosystem of tools and extensions. For an extensive list of everything related to Redux, we recommend Awesome Redux. It contains examples, boilerplates, middleware, utility libraries, and more. React/Redux Links contains tutorials and other useful resources for anyone learning React or Redux, and Redux Ecosystem Links lists many Redux-related libraries and addons.