Giter Site home page Giter Site logo

awesome-react-native-education's Introduction

You will learn React Native.

Index

Official Documentation

Title Type Resource Rating Description
React Native Website Website ★★★★★ The official React Native Docs and reference aka the good shit. Your primary reference for everything
React Website ★★★★★ The official React Docs. Use to learn React
Redux Gitbook ★★★★★ Read this to learn Redux

Community

Title Type Resource Rating Description
React Native AMA Reddit React Native team takes questions about React Native
React Native Roadmap
React Native Product Pains Website If you have a problem with React Native, post it here. Good way to check out the biggest sentiments currently on React Native
Reddit
React Native in the Community Github A list of community-built React Native contributions.
React Native Newsletter Newsletter
Online meetups
StackOverflow
Discord
React Native Wiki Has a roadmap section to show the future of react native development
Use React Native Website Website Website works similarly to this project
Reactiflux Website

Cheat Sheets

Title Type Resource Rating Description
Reach Native Styling Cheat Sheet Github ★★★★ Cheatsheet for styling react antive components
React Native Cheatsheet Github ★★★ React Native TidBits
Learning Path for React Native Blog

Docs

Title Type Resource Rating Description
Deco React Native Docs Docs
Stack Overflow Docs

Great Sites

Title Type Resource Rating Description
awesomereact.com Website ★★★★★ Bunch of really good videos to get you going with React
Awesome React Native Github the original Awesome React Native List
React Native Express Website ★★★★★ Walkthrough tutorial for beginners
React Native Playground Website ★★★★ React Native project site. Sometimes doesn't function properly
React Native Coach Website ★★★ List of Useful React Native Components to get you started

Overview of React Native

Title Type Resource Rating Description
React Native Overview
React Native Retrospective
Tadeu Zagallo: React Native Architecture Overview, slides
A tour of React Native
Pieter De Baets An introduction to React Native
Learn once write anywhere intro to React Native
React Native: an overview from a mobile and frontend developer
React Native - Native App Development for Web Developers
React Native for ReactJS Devs
React Native - Introductory Tutorial
React Symposium
A Tour of React Native part 1 part 2 Blog ★★★★★ Overview of everything in react native and all the major technologies that you should be aware of
Why React Native Is Such A Big Deal Youtube Good vid to watch if you're totally new and have no time. Highlights then painpoints of native dev and the good points of RN dev
React Native as an extension of Hybrid Blog Blog post about how building apps with React Native is a similar experience to building web apps
From React web to native mobile: mapping out the unknown unknowns - Brent Vatne - Reactive 2015 Youtube ★★★★★ Mobile is different from the web because... Higher Expectations + More Constraints + More APIS. Brent Vatne discusses the differences between mobile and web, why RN, animations with Animated, Navigation and navigation transitions with the Navigator API, the facebook app, fast and responsive animations, listview performance optimizations, interaction managers, rasterization, tracking down performance bottlenecks, using the built in react native performance profiler, memory leaks, connectivity, keyboards, status bars, multi-threading, execution states, and much more in this 1 hour talk

Bridging into Native Codebases - iOS

Title Type Resource Rating Description
Bridging in React Native Blog ★★★★★ An in-depth look into React Native's Core
Swift Modules With React Native
Building Better cross platform components
Custom React Native Components in Swift
React Native - How to bridge a Swift View
React Native - How to Bridge an Objective-C View Component
Exposing Native Modules with React Native
Creating your own native bridge
Creating a Swift-ReactNative project
Swift Modules for React Native
Swift to React Native
Invoke Any Native API Directly From Pure Javascript in React Native
Jeremy Grancher - React Native Custom Components, slides
React Native Tutorial: Integrating in an Existing App
Creating a Swift-ReactNative project
Integrating React Native with an Existing App
Custom iOS Views with React Native
Adding React Native to Existing iOS Project Without CocoaPods Blog
How to Create a React Native iOS Native Module Blog

Bridging into Native Codebases - Android

Title Type Resource Rating Description
React Native for Android
One Day with React Native for Android
Native Modules for React Native Android
React Native for Android: How we built the first cross-platform React Native app
Handling Android Back Button Events in React Native with Custom Components
Building the custom Android module for React Native
React Native with JNI & C Blog
Writing Android component for React Native

Navigation and Routing Overview

Title Type Resource Rating Description
Navigation in React Native: Examining and Understanding the Options Slides ★★★★★ Really great talk highlighting most of the options for navigation in React Native
Routing and Navigation in React Native
Exploring Navigators in React Native
React Native — Which Navigator should I use?
React Native Navigator — Navigating Like A Pro in React Native
Eric Vicenti - Native Navigation for Every Platform at ReactEurope 2016 Youtube Facebook dev talks about Navigation in the Facebook apps. Also talks about the future of NavigationExperimental

React Navigation

Title Type Resource Rating Description
React Navigation Homepaage Website
React Navigation: An Overview of Transitioner and CardStack Blog
React Navigation: Cross Fade and Android Default Transitions Blog
Shared element transitions part 1, code Blog
Shared element transitions part 2 Blog
Getting Started with React Navigation Video Tutorial Nice quick video demo to understand the fundamentals of React Navigation
Using React-Navigation in React Native
react-navigation with complete redux state management, tab-bar, and multiple navigators Blog

Navigation Experimental

Title Type Resource Rating Description
React Native Navigator Experimental
NavigationExperimental
NavigationExperimental Github NavigationExperimental Readme
React Native Experimental Navigation with Redux
React Native Navigation using NavigationExperimental Blog
React Native NavigationExperimental in Depth Blog
NavigationExperimental Premier: A Simple Recipe Blog
Exponent Talks: Adam on Unraveling Navigation Youtube
React Native Meetup - Fernando Ruiz - Diving Into NavigationExperimental Youtube
Eric Vicenti - Animating Navigation: Going off the deep end Youtube

React Native Router Flux

Title Type Resource Rating Description
React Native Basics: Using react-native-router-flux Blog + Youtube series
Tackling React Native navigation with React Native Router Flux and Redux Blog
Using React-Native-Router-Flux with Redux Blog

Other Navigation Options

Title Type Resource Rating Description
Introducting React Router Native Blog
Wix React Native Navigation BLog Blog post for understanding the Wix React Native Navigation Library
react-native-animated-modal
Swipeable cards navigation uses Wix react-native-navigation
Ex-navigation Explainer Gist
Using Ex-Navigation in React Native Blog
lottie-react-native Github Lottie is a mobile library for Andorid and iOS that parses Adobe After Effects animations exported as json with bodymovin and renders them natively on mobile!
react-native-facebook-keyframes Github
App Animations with Lottie by Airbnb Blog

Flexbox Model

Title Type Resource Rating Description
Flexbox Froggy Website / Game Game makes learning flexbox easy
React Native Flexbox Layout Patterns Blog
Responsive Layouts Github
React Native Flex Basics Youtube
Mini course on React Native Flexbox github project Blog + Github ★★★★★ Tutorial touches on every aspect of flexbox
React Native Layout System
Aligning Children using Flexbox in React Native
The ultimate flexbox cheatsheet
The complete guide to flexbox
Understanding React Native flexbox layout
Universal css-in-js media queries for React Native and React Github Adds media-query support to css-in-js in React Native and React.
Common React Native App Layouts Blog series ★★★★★ Really nice blog, has a few walkthroughs of common app layouts including a login page, a calendar page, and more coming
Yoga Twitter Yoga, the high-performance layout library. What started as the flexbox implementation for RN is now its own formidable project.
React Native Flex Demo Blog

Styling

Title Type Resource Rating Description
React Native CSS Github Style React-Native components with css and built in support for SASS/SCSS
Applying Basic Styles in React Native
Tachyons Github
Detecting Device Orientation in React Native Blog
transform-origin support Github Post Do Views have an equivalent of the CSS property transform-origin?
Integrated Layout in React Fiber Youtube Short thing about how the integrated layout will affect the way we style react components
React JS Style Components Youtube
React Native Styled Components , video Github Visual primitives for the component age 💅
React Native Tips and Tricks: Styling in JS
Managing Styles in React Native Blog
React Native Styled Components Codepen
Styled-Components: Enforcing Best Practices In Component-Based Systems Article Written by the creator of styled components
Styles in React Native: A Case Study Blog Layout is not style
A 5-minute Intro to Styled Components Blog
How Styled-Components holds up to refactoring in a React Native app. Blog

UI

Title Type Resource Rating Description
Component Kits for React Native Blog
react-native-elements Github Cross Platform React Native UI Toolkit
raect-native-display Github This module brings "Display: none" (css style) to turn on/off components from render. Using this module will improve your app performance and appearance with the enter/exit animations
Nachos UI is a React Native component library
Carbon UI Github Universal Material Design components for React Native and React

Animation Overview and Examples

Title Type Resource Rating Description
Splash Screen on Android Blog
React Native Animations Blog a how-to guide on how to use animations in React Native
131 React Animation Examples Website
React Native ❤ 60FPS Improving React Native animations - ReactEurope 2016 Video + Slides ★★★★ explanation of the various types of animations in react-native, an understanding of the underlying architecture, and how to achieve 60 FPS scrolling
Declarative Animations Library for React and React Native Github
Animate Your React Native App Blog
React Native Animations Done Right Blog
React Native Animations by Emmett Harper Video Comparing CSS animations to React Native animations and understanding how they work the exact same way. Walkthrough of all of the animation types
Building apps with physics-based animations
Implementing FoldView in React Native Blog Really informative. Good insight as to how to take advantage of matrix math in your React Native animations
Practical Animation Examples in React Native Blog
Linking Animations to Scroll Position in React Native Blog A tinder like animation, explained
Native Animation Example Github A example of using the new native animations
Practical Animation Examples in React Native , code Blog Create a news page, a button page, a progress bar, a spinning animation, and an expand animation
Jason Brown Animation Videos Egghead
Implementing a 3D Cube in React Native Blog
React Native collapsible navbar Blog

Layout Animation

Title Type Resource Rating Description
React Native’s LayoutAnimation is Awesome Blog
Simple and pretty LayoutAnimation
Simple React Native Animations Blog

Animated

Title Type Resource Rating Description
React Native Animations Using the Animated API Blog Getting up and running with React Native Animations
React-native Animated API Basic Example Blog
React Native Animated Video Tutorial Egghead Video Series
React Rally: Animated -- React Performance Toolbox Slides
React Motion and Animated Blog
Support for Native Animations Github
Playing with React Native Animations Blog
Animations in React Native Video Gives understanding of differences between using the layout animation and the animated API. Also React Motion
Spencer Ahrens - React Native: Building Fluid User Experiences at react-europe 2015, slides, code Video + Slides + Code ★★★★★ Talk from when the Animated API was first introduced. Talk is about what the animated API can do, shown with a demo
The amazing animated API Blog
Using Native Driver for Animated React Native Blog

Other Animations

Title Type Resource Rating Description
react-native-animatable Github Easy to use declarative transitions and a standard set of animations for React Native
react-motion Github
The CSS3 matrix() Transform for the Mathematically Challenged Blog In react native, there is no support for transform-origin. instead, you can take advantage of the matrix transformations. this is a guide to doing that
Matrix 3D Syntax
Matrix 2D Transforms
A react-native wrapper for Facebook Keyframes Github A React Native wrapper for the Facebook Keyframes library.
gl-react-native Github OpenGL bindings for React Native to implement complex effects over images and components, in the descriptive VDOM paradigm

SVG and D3

Title Type Resource Rating Description
React Native ART and D3
Using D3 With React Native
React Native - Morphing SVG Paths with React Art
An example application to show how to use D3 in a React Native application.
react-native-svg SVG library for React Native
React Native and D3.js
gl-react-native Github OpenGL bindings for React Native to implement complex effects over images and components, in the descriptive VDOM paradigm http://projectseptemberinc.gitbooks.io/gl-react/content/
Cross-platform charting with React & React Native by Ken Wheeler at react-europe 2016 Youtube
react-native-pathjs-charts Github

Gestures

Title Type Resource Rating Description
React Native - Maintain Touchable Items with a Parent PanResponder
react-native-gesture-handler
GETTING STARTED WITH THE PANRESPONDER IN REACT NATIVE, demo app
Living in an async world of React Native, slides
React-native Animated API with PanResponder
Gesture detection in React Native Blog
react-native-gesture-recognizers Github React Native gesture recognizer decorators. Just decorate your component and easily respond to pans and swipes! Uses ES7 decorator syntax
How to handle gestures with PanResponder Blog

Networking

Title Type Resource Rating Description
Making Network Requests Video / written tutorial of how to make network requests
Interacting with APIs Using React Native Fetch
Make HTTP Requests In iOS With React Native

Basic React Native and Component Usage

Title Type Resource Rating Description
React Native Basics: How to Use the ListView Component
ListView grid in React Native
React Native ListView with Section Headers Blog
React Native’s Context Dilemma Blog
Building infinite scroll in React Native Blog
How to handle all Keyboard problems in React-Native with only 5 lines of code Blog

React Native APIs

Title Type Resource Rating Description
React Native Basics: Geolocation

Custom Components and Cool Shit

Title Type Resource Rating Description
Awesome React Components Github ★★★★ List of React Native comonents and number of stars
reactscript.com Website ★★★★★ React Native Componets Website - lots and lots of components!
Libs, Articles and Tutorials Github
react-native-grid-component Github
react-sortable-tree Github
React Native FoldView Github
Sortable ListView Github
react-native-sglistview Github SGListView is a memory minded implementation of React Native's ListView
react-native-sortable-list Github
react-native-utils Github
react-native-app-link Github Easily link to other apps with React Native.

Map Views

Title Type Resource Rating Description
Airbnb Map View Github ★★★★★ Airbnb's mapview - will be merged into RN master for version 0.40
Client Side marker clustering with React Native

List Views

Title Type Resource Rating Description
React Native’s experimental new FlatList component Blog

Payments

Title Type Resource Rating Description
Credit Cards with Stripe and React Native

App Structure

Title Type Resource Rating Description
React Native Code Reuse: Architecture that Works
A cure for relative requires in React Native
Organizing a React Native Project Blog
How to structure your React Native application using Redux? Blog

App Launch

Title Type Resource Rating Description
ReactNative iOS Launch Screen No Flash
Launch Image in iOS Blog

Project Setup

Title Type Resource Rating Description
Renaming a React Native Project Blog
Rename react-native app with just one command Github
React Native Deployment to iPhone Blog

Offline

Title Type Resource Rating Description
Handling Offline Actions in React Native Blog

Testing with Jest

Title Type Resource Rating Description
Learning to test React Native with Jest — part 1
Learning to test React Native with Jest — part 2
Learning to test React Native with Jest — part 3
Unit testing React Native with the new Jest (I) — Snapshots come into play! code Blog
Unit testing React Native with the new Jest (II) — Redux: Snapshots for your actions and reducers Blog
Using Jest Everywhere Slides
Using Jest with React Native and MobX Blog
How to use Jest with React Native Youtube
Jest Docs React Native Docs
Testing React Native Componenets with Jest Blog
Unit Testing React Native Components: A Firsthand Guide Blog
React Testing Practices Blog A look into Jest, Enzyme, Mocha, Chai
Testng React Applications with Jest Blog

Testing

Title Type Resource Rating Description
Using Enzyme to Test Components in React Native
Testing React Native with Mocha and Enzyme
Unit Testing React Native With Mocha And Enzyme
Testing React Native
React Native on Simulator and on Device Github
Testing the Bejeezus out of React Native Apps with AVA
Test driving React Native applications
Automated UI Testing with React Native on iOS Blog
React Native Mock Github A fully mocked and test-friendly version of react native
Testing React Native and Redux
carte-blanche Github An isolated development space with integrated fuzz testing for your components. See them individually, explore them in different states and quickly and confidently develop them. youtube video
A fully mocked and test-friendly version of React Native Github
React Native Functional Testing using Appium Blog
Graybox E2E tests and automation library for mobile Github Wix's Detox library

Debugging

Title Type Resource Rating Description
Deep Diving React Native Debugging Blog ★★★★★ Beginners tutorial for debugging react native
Debugging React Native Applications
React Native Android App Memory Investigation
More Debugging with React Native
Debugging and Production - React Native at Microsoft
Nuclide Debugger
React Native Time Travel Debugging Blog

Crash Reporting

Title Type Resource Rating Description
How To: Crash Reporting with React-Native, Sentry and Fastlane Blog
Add Crashlytics to your React Native iOS app

Chrome Dev Tools

Title Type Resource Rating Description
Chrome Dev Tools Homepage
Debugging with Global Variables and the Chrome Console in React Native
Using the Chrome Debugger to Set Breakpoints in React Native Video
React Native Debugging Using Chrome Blog
Debug the DOM in Chrome with the Devtools Elements Panel Egghead
Debug JavaScript in Chrome with DevTool Sources Egghead
Debug HTTP with Chrome DevTools Network Panel Egghead
Become a Javascript Console Power-User Youtube
React-Knosul Github Render React components to Chrome in console.log()
Release The Pain from Running and Debugging React Native App on a real iOS Device Blog
Show network requests such as fetch, WebSocket etc. in chrome dev tools

Versioning and Upgrading

Title Resource Rating Type Description
Easier Upgrades thanks to Git Blog
Versioning React Native apps
Easier React Native upgrades with rn-diff Blog
rn-diff Github Easier React Native upgrades by clearly expose changes from a version to another
How to upgrade React-Native Modules in a backwards compatible manner Blog
React Native 0.40 Upgrading iOS Native Modules Blog
React Native git upgrade video Youtube

Configuration

Title Resource Rating Type Description
Managing Configuration in React Native Blog
react-native-config Github Module to expose config variables to your javascript code in React Native, supporting both iOS and Android

Optimizing and Performance

Title Type Resource Rating Description
React.js Conf 2016 - Tadeu Zagallo - Optimising React Native: Tools and Tips Youtube ★★★★★ Talks about the React Native build process
Introduction to React Native Performance, code Slides + Code ★★★★ React Native holds great promise in terms of excellent developer experience with Javascript and code reuse between platforms. The big question is — do these benefits come at the price of performance? How well can React Native hold its own against purely native implementations?
Performance Limitations of React Native and How to Overcome Them, writeup Slides + Blog ★★★★
Recycling Rows For High Performance React Native List Views
Building a custom listview
React Native Scheduling
React Native’s JavaScript Execution Contexts
Breaking up Heavy Processing in React Native
Under The Hood of React Native - Martin Konicek - Reactive 2015, slides Youtube + Slides
JavaScript, React Native and Performance at react-europe 2016, slides Youtube + slides
Alexander Kotliarskyi - React Native: Under the Hood - YGLF2015, slides Youtube + Slides ★★★★★ Nice quick overview of the performance optimizations React Native makes behind the scences via async calls and batch updates
Dive into React Native performance
React Native Internals: A Wider Picture (Part 1: MessageQueue & JS Thread)
Debugging React Native Performance: Snoopy and the MessageQueue Blog
React Internals Slides Even though this is pretty much only about react, it is too good of a presentation to ignore. Goes into the concepts behind state, reconciliation, syntheticevent, and react fiber
Optimizing React Native: Dynamic Gif Scrolling Blog
React Performance Slides
Tempted to abandom React Native for Native Android Discussion
I made React Native fast, you can too Blog Discuesses overdraw problems on Android and how you can track them down and eliminate them with GPU Prfiling tools in Android Studio

Async and Middleware

Title Type Resource Rating Description
React Native Meets Async Functions
ES7 Async / await with React Native
Using redux-saga To Simplify Your Growing React Native Codebase Blog
F8 2015 - React Native & Relay: Bringing Modern Web Techniques to Mobile Youtube
react-native-background-job Blog Schedule background jobs in React Native that run your JavaScript when your app is in the background/killed.
Async Await with React Lifecycle methods Blog
react-native-workers Github
React Resolver Github Async-rendering & data-fetching for universal React applications

Storage and Persistence

Title Type Resource Rating Description
Tackling React Native Storage Blog Good overview of the differences between Realm and AsyncStorage

Local Files

Title Type Resource Rating Description
react-native-fetch-blob Github A project committed to make file acess and data transfer easier, efficient for React Native developers.
Image Caching in React Native Blog Caching images with react native fetch blob
Working with Local Data Medium

Dependencies and Frameworks

Title Type Resource Rating Description
How to create a React Native project using Yarn
Beginner’s Guide to Using CocoaPods with React Native
React Native modules — Frameworks Blog

Asset Management

Title Type Resource Rating Description
Add fonts on React Native Blog
How to add and remove custom fonts in React Native Blog
react-natove-vector-icons Github
Resource Handling in React-Native Blog
fontFamily in React Native
Tips for React Native Images (or saying goodbye to trial and error) Blog
Change your React Native app icons in a single command line Blog

Javascript

Title Type Resource Rating Description
Using ES2016 Decorators in React Native Blog
How To Use ES6 Arrow Functions With React Native
ES7 Decorators Blog Post discusses using ES7 decorators for higher order components
6 Ways to Bind JavaScript’s this Keyword in React, ES6 & ES7
Goodbye ../../../ Removing relative paths when importing Blog
fat Arrow vS Autobind VS bind();Bind();Bind();Bind();Bind()? Reddit

Javascript Core

Title Type Resource Rating Description
NSHipster - JavascriptCore

Responsive Layouts

Title Type Resource Rating Description
react-native-responsive-image Responsive image component for React Native

Push Notifications

Title Type Resource Rating Description
How to Setup Push Notifications in React Native (iOS & Android)
Triggering iOS 10 actionable push notifications via React Native
How to Setup Push Notifications with React Native Youtube
React Native Library for OneSignal Push Notifications Service Github

Migrating to React Native

Title Type Resource Rating Description
Migrating to React Native Blog

Opinions

Title Type Resource Rating Description
What Sucks About React Native
Six months with React Native
AN IOS DEVELOPER’S PERSPECTIVE ON REACT NATIVE Blog
React Native Hater has a Bitchfit

Reflections

Title Type Resource Rating Description
What we learned after using React Native for a year Blog Good look at what worked and what didn't work in React Native from this company
10 LESSONS LEARNED BUILDING THE DELIVERY.COM APP FOR ANDROID Slides ★★★★ Some good tips from the Delivery.com team. Comes with code samples
React Native in Production Slides
What I learned from building my first React Native App Blog
Lessons learned from working with React Native Blog
What I learned from building my first React Native App Blog
React Native at Walmart Labs
Task Rabbit Youtube
React Native at Airbnb Video ★★★★ Leland Richardson talks about how Airbnb uses React Native and how their repository structure, as well as Continuous Integration
React Native at Airbnb and Test Butler at LinkedIn Youtube ★★★ See how Airbnb is using React Native in iOS and Android
Tal Kol: Building a React Native App for 80 Million Users, slides) Youtube + Slides ★★★★ Talk about using React Native at a large scale at Wix.com, and how it transformed their work process
Bas de Vries: iOS vs React Native: insights from an iOS developer, slides Youtube + slides ★★
Mike Grabowski: Building a Fully-Fledged Media Player in React Native — ReactNext 2016
React Native at Instagram Blog
Retrospective: Swift at Artsy Blog ★★★★★ Swift compared to React Native after 1 year of use at Artsy
Artsy React Native Series Series of blog posts regarding the Artsy team's transition to React Native

React

Title Type Resource Rating Description
React Lifecycle methods diagram
Awesome React Components Github A sorted and categorized list of React Components
Sharing Components Between React and React Native Blog
From ReactJS to React-Native, what are the main differences between both? Blog
React Core Notes
React FAQ Github
ReactJS in Patterns Github
Converting a React App to React Native

React Fiber

Title Type Resource Rating Description
ReactNative fiber renderer Github
React Native Fiber Resources
React Fiber Architecture Hacker News
A glimpse into more obscure Fiber features (NOT a real/public API yet but it works) Twitter
React Fiber Slides Slides

Redux

Title Type Resource Rating Description
Awesome Redux / React Native
React Redux Links Github Resource to get started with React and Redux
React Native with Redux, video class code
Using React (-Native) with Redux and Redux-Saga. A new proposal?
Introduction to React Native & Redux
RN-NavigationExperimental-Redux-Example
react-native-redux Github Just a starter code to use redux and react-native with Login
To persist or not to persist Blog Storing (and cleaning!) navigation state with Redux and React Native
A guide to React Native with Redux and Immutable.js Blog
Easy forms in React Native with Redux-Form Blog
Redux 4 Ways Implementations of Thunk vs Saga vs Observable vs Redux Promise Middleware in 10 minutes.

MobX

Title Type Resource Rating Description
React Native MobX Project Make your app reactive with MobX and react-native-router-flux
React Native with MobX — Getting Started, code
A React-Native app to remote control Google Play Music Desktop
Build an Imgur App with React Native and MobX

GraphQL

Title Type Resource Rating Description
Using GraphQL Inside a React Native App Blog
React Native with Apollo Blog 2 part blog post
Amazing React Native apps with Apollo React Blog
Learn Apollo: Build GraphQL Apps with React, React Native or Exponent Blog

Apollo React Native

Title Type Resource Rating Description
Integrating with React Native Docs
Amazing React Native apps with Apollo React Blog
react-native-feed News feed built with react-native, apollo-client and graphql & powered by postgraphql
Apollo on React Native Radio Blog The top 5 questions and answers
React Native with Apollo— Part 1, Apollo Server Blog
Tales of a React Native Beginner: Why GraphQL🏆 Is The Real MVP

Relay

Title Type Resource Rating Description
React Native and Relay
ExNavRelay Github Example of integrating ex-navigation with Relay
react-native-relay-example Github React Native with Relay example
Using React Native with Relay Blog

Realm

Title Type Resource Rating Description
Building An Image Browsing App With Realm, Imgur API, and React Native

Flow

Title Type Resource Rating Description
Getting Started with React Native and Flow Blog
Adding Flow to your Redux Application Blog

Typescript

Title Type Resource Rating Description
React Native Typescript
React Native and Typescript code Blog
React Native and TypeScript – Developing cross-platform apps
React Native + Typescript
Using TypeScript with React Native
Typescript, React Native and Sourcemaps Blog
TypeScript 2.2 plays nice with React Native JavaScript Blog / News post
React Native and TypeScript: Developing Cross-Platform Apps Blog
Announcing TypeScript 2.2 RC News
react-native-45-typescript-example Github
React Native Typescript Transformer Github

Bucklescript

Title Type Resource Rating Description
BuckleScript bindings for React Native Github

ReasonML

Title Type Resource Rating Description
ReasonML Docs
What does Reason and React Native look like? Github
A First Reason React app for Javascript developers Blog

Expo

Title Type Resource Rating Description
Exponent -> Expo Blog
Exponent Repository Github
Awesome Exponent Github
Curated list of awesome react native components on exponent
Introduction to Exponent
Exponent explained in 2 minutes Youtube
Coding Apps with React Native at Exponent
Exponent Talks: Brent's "Introduction to Exponent" Youtube At our first user community meetup, Brent gives an intro to Exponent and a quick tour of basics like building a feature and pushing updates.
Using React Native UI toolkits with Exponent
Hello Exponent: A Hands-On Tutorial Youtube
AMA With the Exponent Team
"Exponent" with Brent Vatne Youtube

Authentication

Title Type Resource Rating Description
react-native-google-signin Google Signin for your react native applications
Authenticate React Native - iOS with Firebase API
The Essential Boilerplate to Authenticate Users on your React-Native app Blog

Native APIs

Title Type Resource Rating Description
Making React Native apps accessible
Use The iOS Camera In Your React Native Mobile App
react-native-itunes Github Access your iTunes library (iOS only)
react-native-motion-manager Github CMMotionManager wrapper for react-native, exposing Accelerometer, Gyroscope, and Magnetometer.
Reacting to React Native for native WebRTC apps Blog
Using SpriteKit inside a React Native app Blog
Sharing content with React Native Blog Using your native device's sharing API

Webviews

Title Type Resource Rating Description
WebGL in React Native
react-native-webview-crosswalk
React Native and THREE.js (WebGL library) integration Github

Deep Linking

| Deep Links in React Native v0.22 [Part 1 — Android] | Blog | | | | react-native-deep-linking | Github | | Simple route-matching library to handle deep links |

Known Bugs

Title Type Resource Rating Description
How to fix the initial white flash in your React Native app Blog
Thoughts on React Native from an Android engineer's perspective Blog Highlights some problems with React Native and Gradle
React Native blank white screen issue (solved) Blog
Easy upgrades, relying on Git Blog
Hard React Native Problems Github issues
React Native — a gotcha with fetch() Blog
"Congratulations, you have a lot of code!" Remedying Android’s method limit - Part 1 Blog

React Native on the Web

Title Type Resource Rating Description
React Native Web Github
React Native Web setup for android and web with live reload on both! Blog

React Native Windows Platform

Title Type Resource Rating Description
Native Development for Windows Blog

React Native tvOS

Title Type Resource Rating Description
react-native-tvos-controller Github TvOS remote controller module for react native.
React Native & Apple TV today Blog

React Native Amazon Fire

Title Type Resource Rating Description
React Native running on Amazon Fire TV Stick Twitter
Amazon Fire TV Stick App In React Native Blog

Clojurescript

Title Type Resource Rating Description
ClojureScript + React Native
Mobile Apps with Clojurescript Youtube

Elm

Title Type Resource Rating Description
Elm Native UI Github

FSharp

Title Type Resource Rating Description
Fable React Bindings Github

Golang

Title Type Resource Rating Description
React Native: Why and How to Build Your Native Code in Go Blog

AWS

Title Type Resource Rating Description
AWS SDK for React Native Github
Go Serverless With React Native and Amazon Web Services Blog
AWS re:Invent 2016: Native, Hybrid and Web patterns with Serverless and AWS Mobile services (MBL404) Youtube

Starters

Title Type Resource Rating Description
Awesome React Boilerplates
Pepperoni - a React Native Blurprint

Dev Tools

Title Type Resource Rating Description
React Native Dev Tools
Reactotron A CLI and OS X app for inspecting your React JS and React Native apps.
Linting React Native Blog
Solving a Tooling Problem For React Native, slides
Remote Redux DevTools monitor on React Native Debugger Github
RN Diff Github Easier React Native upgrades by clearly expose changes from a version to another. 🚀
Getting ESLint Right in React Native Blog
react-native-extended-cli Github rnx (short for React Native Extended CLI) is a tool you can install via npm and use as a CLI instead of using the react-native CLI. It supports everything the built-in CLI supports plus a bunch of handy tools that will save you time and stress.
React Native Storybook Github With React Native Storybook you can design and develop individual React Native components without running your app.
adb-auto-restarter Github ADB service auto restarting shell. really helpful if you are as lazy as i am and don't want to restart your adb service manually when it stops detecting your android phone.
react-native-touch-visualizer Github Visualize touches and drags on React Native apps.

VSCode

Title Type Resource Rating Description
React Native VSCode Youtube
VS Code — how to create snippets to speed up your React Native development Blog
VSCode React Snippets Github List of all the react snippets for VSCode

CodePush

Title Type Resource Rating Description
React Native + CodePush

Continuous Integration / Deployment / Delivery

Title Type Resource Rating Description
Continuous Deployment with Fastlane
An Actually Good Solution to On-Device Development in React Native
Continuous Integration for React Native Apps With Fastlane and Bitrise (iOS)
A React-Native Android iOS Starter App/ BoilerPlate / Example with Redux, RN Router, & Jest with the Snowflake Hapi Server running locally or on RedHat OpenShift for the backend http://bartonhammond.github.io/snowflake/snowflake.js.html
Snowflake: Continuous Integration with Bitrise.io
Publish React Native Applications Over The Air with Electrode RN OTA, an Open Source Release from @WalmartLabs
Preview your Android & iOS React Native apps on your Github Pull Request Blog
CI and Automated Deploys with Buddybuild
Automating a React-native Mobile Application for Beta Testing Blog
ReactNative - Zero to DevOps Youtube ★★★★★ Great little intro to set up CI with Azure and CD with Codepush
Automating a React-native Mobile Application for Beta Testing Blog Uses Jenkins for triggering the build automation, Docker for containerizing and building,unit testing and deploying, TestFairy for uploading the build for beta testing
Get your brownfield React Native app built on demand Blog Article on getting CI and CD set up with Buddybuild

Installing SDKs

Title Type Resource Rating Description
Installing the Facebook SDK Blog

Patents

Title Type Resource Rating Description
Are people really worried about using React and ReactNative with the language that's in Facebook's PATENTS file? Quora
React Native goes open source, kills the buzz with Patent License Grant
Dan Abramov (gaearon) on Facebook's PATENTS clause Reddit
React patents clarification: Facebook License FAQ, adoption at Apple and Microsoft Blog

Talks

Title Type Resource Rating Description
Awesome React Native Talks Github ★★★★ Nice, curated list of talks
Writing Cross-Platform Apps with React Native
No Xcode Java Swift or Objc - How far JS Gets you
React Native: Are we there yet?, slides
React Bratislava Meetup Nov 18 2016 Youtube
Write-once, run WebRTC anywhere with React Native (Kranky Geek WebRTC 2016) Youtube Emil walks through his experience using React Native with WebRTC.

Tutorials

Title Type Resource Rating Description
Step-by-step guide through building a complex React Native app
Prototyping a Chat App with React Native and Phoenix
React Native - Recreating the Apple TV Icons Blog Post about how to make a tricky 3D animation in React Native
How I built React Native Tab View Blog Post about a common UI pattern
Creating a hacker news reader part1, part2
30 days of React Native Github ★★★★★ Project shows how to build various common designs in React Native
Building a Facebook Paper-like UI with React Native Blog
Building feedback UI Blog
Building a Wunderlist Clone Blog
Building Instagram Stories Blog ★★★★ Highlights the problem of a lack of a CSS 3D Transform in React Native
How I built a Tinder inspired loader in React Native
Expanding and Collapsing Elements Using Animations in React Native
Dynamic Animated Lists in React Native
React Native Tutorial: Building Apps with JavaScript Blog ★★★★★ Walkthrough tutorial demonstrating React Native basics. Build a sample real estate app that shows a list of nearby homes
Build a Coffee Finder App with React Native and the Yelp API
Building an iOS Geolocation Travel App with React Native
Building the F8 2016 App Blog
React Native Workshop Gitbook ★★★★★ Short online book walkthrough of react native
Implement Snapchat like swipe navigation declaratively in React Native Blog

| React Native Cube Transition | Github + Blog | | React Native module for iOS that rotates components on a cube, similar to Instagram Stories. | | Build A Clock in React Native — Part 1 Build A Clock in React Native — Part 2 Youtube | Blog | | | | Snowfall effect in React Native | Blog | | | | Building infinite scroll in React Native | Blog | | | | React Native ScrollView animated header | Blog | | | | Ripple effect in React Native | Blog | | Here’s a tutorial how to make ripple effect for Material Design’s Icon Button using the Animated API | | Simple React Native forms with react-native-clean-form and Immutable.js | | | | | Toolbar animation in React Native | | | | | Building a simple camera app clone for iOS with React Native | Blog | | |

Video Tutorials

Title Type Resource Rating Description
Introduction to React Native - Building a React Native app from scratch
Introduction to React Native A basic introduction to getting started with React Native. This screencast shows how to get setup, development workflow, and building the first cut at a ListView to show some images and meta data for Hearthstone cards.
React Native Quickly
React Native Beginner
Daily Drip Video Classes
React Native TODO App Egghead With Jason Brown

Sample Apps

Title Type Resource Rating Description
React-Native-Apps Github ★★★★★ Curated list of open source React Native Apps
Awesome React Native Open Source Apps Part of the Awesome React Native Repo is a section of open source apps
Interesting React-Native projects to learn from

Podcasts

Title Type Resource Rating Description
React Native Radio

Jobs

Title Type Resource Rating Description
React Jobs
reactnativejobs.io

Companies using React Native

Title Type Resource Rating Description
Tesla

Books

Title Type Resource Rating Description
React Native Quickly Online Book Online Book ★★★ Short book to get you familiar with the basics of React Native
Learning React Native: Building Native Mobile Apps with JavaScript Book ★★★★ Good book to get started with react native
React Native in Action MEAP
React Native Animation Book Gitbook ★★★★★ The best resource for learning animations in react native
React Native Cookbook

Weex

Title Type Resource Rating Description
Weex Homepage
If you like React Native & Vue, you will like Weex Blog
A simple tutorial for Weex Blog

awesome-react-native-education's People

Contributors

amandeepmittal avatar hsavit1 avatar isnifer avatar sriraman avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.