Giter VIP home page Giter VIP logo

awesome-react-native-education's Introduction

You will learn React Native.

Official Documentation

Title Type Resource Rating Description
React Native Website Website ★★★★★ The offical React Native Docs and reference aka the good shit. Your primary reference for everything
React Webite ★★★★★ 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

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

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 ★★★★★ Walkthough 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 youre 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 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 reponsive 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

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
Writing Android component for React Native
React Native for Android
Handling Android Back Button Events in React Native with Custom Components
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
Building the custom Android module for React Native

Navigation and Routing

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
React Native Navigator Experimental
NavigationExperimental
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
NavigationExperimental Github NavigationExperimental Readme
React Native Basics: Using react-native-router-flux Blog + Youtube series
react-native-animated-modal

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.

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

Animation

Title Type Resource Rating Description
React Native’s LayoutAnimation is Awesome Blog
Splash Screen on Android Blog
React Native Animations Blog a how to guide on how to use animations in React Native
React Native Animations Using the Animated API Blog Getting up and running with React Native Animations
131 React Animation Examples Website
React Rally: Animated -- React Performance Toolbox Slides
React Motion and Animated Blog
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 Animated API Basic Example 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
Animations in React Native Video Gives understanding of differences between using the layout animation and the animated API. Also React Motion
Building apps with physics-based animations
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
react-native-animatable Github Easy to use declarative transitions and a standard set of animations for React Native
react-motion Github
React Native Animated Video Tutorial Egghead Video Series
Implementing FoldView in React Native Blog Really informative. Good insight as to how to take advantage of matrix math in your React Native animations

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

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

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 Component Usage

Title Type Resource Rating Description
React Native Basics: How to Use the ListView Component
ListView grid in React Native

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
react-native-grid-component
react-sortable-tree
React Native FoldView
Sortable ListView
Airbnb Map View Github ★★★★★ Airbnb's mapview - will be merged into RN master for version 0.40
react-native-sglistview SGListView is a memory minded implementation of React Native's ListView
react-native-sortable-list

App Structure

Title Type Resource Rating Description
React Native Code Reuse: Architecture that Works
A cure for relative requires in React Native

Testing

Title Type Resource Rating Description
Testing React Native
Using Enzyme to Test Components in React Native
Testing React Native with Mocha and Enzyme
Unit testing React Native with the new Jest (I) — Snapshots come into play!
Unit testing React Native with the new Jest (II) — Redux: Snapshots for your actions and reducers
Add Crashlytics to your React Native iOS app
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
Unit Testing React Native With Mocha And Enzyme

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
Debugging with Global Variables and the Chrome Console in React Native
More Debugging with React Native
Debugging and Production - React Native at Microsoft
Using the Chrome Debugger to Set Breakpoints in React Native Video

Versioning

Title Resource Rating Type Description
Versioning React Native apps

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

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

Dependencies

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

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

Javascript Core

Title Type Resource Rating Description
NSHipster - JavascriptCore

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

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

React

Title Type Resource Rating Description
React Lifecycle methods diagram
Awesome React Components Github A sorted and categorized list of React Components

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

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

GraphQL

Title Type Resource Rating Description
Using GraphQL Inside a React Native App Blog
React Native with Apollo Blog

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

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 Blog
React Native and TypeScript – Developing cross-platform apps
React Native + Typescript
Using TypeScript with React Native

Exponent

Title Type Resource Rating Description
Exponent Repository Github
Awesome Exponent Github
Introduction to Exponent
Coding Apps with React Native at Exponent
Exponent Talks: Adam on Unraveling Navigation
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

Authentication

Title Type Resource Rating Description
react-native-google-signin Google Signin for your react native applications
Authenticate React Native - iOS with Firebase API

Extra APIs

Title Type Resource Rating Description
Making React Native apps accessible
Use The iOS Camera In Your React Native Mobile App

Known Bugs

Title Type Resource Rating Description
How to fix the initial white flash in your React Native app Blog

React Native on the Web

Title Type Resource Rating Description
React Native Web Github

Clojurescript

Title Type Resource Rating Description
ClojureScript + React Native

Elm

Title Type Resource Rating Description
Elm Native UI Github

AWS

Title Type Resource Rating Description
AWS SDK for React Native
Go Serverless With React Native and Amazon Web Services

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

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

Talks

Title Type Resource Rating Description
Awesome React Native Talks Github ★★★★ Nice, curated list of talks
React Native at Airbnb Video ★★★★ Leland Richardson talks about how Airbnb uses React Native and how their repository structure, as well as Continuous Integration
Writing Cross-Platform Apps with React Native
React Native at Airbnb and Test Butler at LinkedIn Youtube ★★★ See how Airbnb is using React Native in iOS and Android
Task Rabbit
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
Mike Grabowski: Building a Fully-Fledged Media Player in React Native — ReactNext 2016
No Xcode Java Swift or Objc - How far JS Gets you
React Native: Are we there yet?, slides
Bas de Vries: iOS vs React Native: insights from an iOS developer, slides Youtube + slides ★★
How to use Jest with React Native

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
React Native Tutorial Series Slides Covers a very wide range of topics, including Realm

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.
Build Apps With React Native Tutorial 34 free Youtube Videos
React Native Quickly
React Native Beginner

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 Awesom 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

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 raect native

awesome-react-native-education's People

Contributors

hsavit1 avatar sriraman avatar

Watchers

 avatar  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.