react-native.md

React Native

Tutorials

• React Native Express
  http://www.reactnativeexpress.com/
  A full set of tutorials for everything related to React Native

• Awesome React Native Education
  https://github.com/hsavit1/Awesome-React-Native-Education
  An overview of the React Native ecosystem, in a similar style to react-redux-links

• React Native Workshop
  https://rangle-io.gitbooks.io/react-native-workshop/content/
  An introduction to React Native's concepts, in conjunction with Flexbox and Redux

• Building the F8 App
  http://makeitopen.com/
  A dive into how the Facebook F8 conference mobile app was built, including planning, design, testing, and data management.

• Build a Coffee Finder App with React Native and the Yelp API
  https://appendto.com/2016/11/build-a-coffee-finder-app-with-react-native-and-the-yelp-api/
  A tutorial that covers building an IOS app that fetches data, organizes views, and displays the data on a map.

• How to distribute React Native components backed by native code
  https://www.benwixen.com/articles/distributing-react-native-components-with-native-code/
  A project layout for redistributable components with native code, that includes unit tests and supports automatic linking.

• Build an Imgur Client with React Native and MobX
  https://medium.com/react-native-development/build-an-imgur-client-with-react-native-and-mobx-react-native-school-53146d648250
  A tutorial that demonstrates build an RN app with MobX for state management, use of RESTful APIs, full-screen images in a ListView, and detection of device orientation

• Offline-First Apps with React Native and Redux
  http://rationalappdev.com/offline-first-apps-with-react-native-and-redux/
  A tutorial that builds out a cat GIF app using React Native, Redux, Node, and Express, and includes offline support.

• Let's Build: Cryptocurrency Native Mobile App with React Native + Redux
  https://medium.com/react-native-training/bitcoin-ripple-ethereum-price-checker-with-react-native-redux-e9d076037092
  https://medium.com/@wesharehoodies/tutorial-react-native-redux-native-mobile-app-for-tracking-cryptocurrency-bitcoin-litecoin-810850cf8acc
  https://medium.com/@wesharehoodies/learn-how-to-build-a-rn-redux-cryptocurrency-app-chapter-iii-a454dda156b
  https://medium.com/@wesharehoodies/learn-how-to-build-a-rn-redux-cryptocurrency-app-chapter-iv-b0e0c5ca2dca
  A 4-part tutorial series that shows how to set up a React Native project, add Redux, fetch data with Redux, and display that data with React.

Specific aspects

• Using iOS Image Picker with React Native
  http://goshakkk.name/react-native-camera-roll-image-picker/
  Getting an ImagePicker to work on iOS is painful. It's barely documented. This tutorial-style article shows you everything you need to do to finally start asking users for images.

• Rapid cross-platform development with React Native
  https://robots.thoughtbot.com/rapid-cross-platform-mobile-development-with-react-native
  Thoughts on how React Native enables code reuse and iteration, and a look at using the flexbox-based layout system on various platforms.

• Debugging React Native Applications
  https://medium.com/reactnativeacademy/debugging-react-native-applications-6bff3f28c375
  A useful description of tools and techniques that can be used to help debug RN apps.

• Under the hood of React Native
  https://speakerdeck.com/mkonicek/under-the-hood-of-react-native
  A slideset digging into the guts of how React Native works

• What I learned from building my first React Native App
  http://cmichel.io/lessons-from-building-first-react-native-app/
  A number of informative lessons learned building an app using RN and Redux, including components, performance, workflow, and use of Redux.

• Understanding React Native flexbox layout
  https://medium.com/the-react-native-log/understanding-react-native-flexbox-layout-7a528200afd4 A helpful visual guide to how Flexbox works, both in general and specific to React Native

• How to Create An Authentication System and a Persistent User Session with React Native
  http://www.theodo.fr/blog/2017/03/how-to-create-an-authentication-system-and-a-persistent-user-session-with-react-native/
  Demonstrates how to build an app that uses JWT authentication, and persist the token in storage to keep the user logged in

• React Native Effective Patterns
  https://medium.com/the-poli/react-native-effective-patterns-3e0c9db6c32c
  Some useful suggestions for writing React Native apps, including use of callbacks, separating navigation from views, use of Redux, and more.

• React Native Layout Tricks
  https://www.theodo.fr/blog/2017/04/react-native-layout-tricks/
  Helpful examples for achieving specific UI layouts using RN's Flexbox implementation

• Where does authentication fit in a React Native app?
  https://goshakkk.name/auth-in-react-native-apps/
  Some quick thoughts on what authentication involves and how to handle it in an RN app

• The building blocks of React Native animations
  https://goshakkk.name/react-native-animated-building-blocks/
  Several useful sets of guidelines for thinking through and implementation animations in React Native, including "how should this change", visual state, transitions, and interpolations, plus links to additional resources for RN animations.

• 6 Tips You Want to Know about React Native Performance
  https://www.simplytechnologies.net/blog/2017/6/6/6-tips-you-want-to-know-about-react-native-performance
  Several useful suggestions for improving RN performance, including RN-specific suggestions like using FlatList instead of ListView, and pushing animations into native code.

• How we restructured our app with React-Navigation
  https://m.oursky.com/how-we-restructured-our-app-with-react-navigation-98a89e219c26
  Describes some of the history of the React-Navigation library, and shows some examples of how to use it with Redux and make a Higher-Order Component to work with it.

• A comprehensive guide for integrating React-Navigation with Redux including authentication flow
  https://medium.com/@shubhnik/a-comprehensive-guide-for-integrating-react-navigation-with-redux-including-authentication-flow-cb7b90611adf
  An extended tutorial that demonstrates connecting React-Navigation and Redux, and shows how to implement an authentication workflow.

• A Year of React Native: Styling
  https://madebymany.com/stories/a-year-of-react-native-styling-part-1
  https://madebymany.com/stories/a-year-of-react-native-styling-part-2
  Looks at ways that styling in RN differs from styling on the web, and useful patterns for organizing styling logic in RN apps.

• React Native app performance: Major issues and insights on improving your app's performance
  https://www.simform.com/react-native-app-performance/
  A detailed look at common causes of perf issues in RN, such as memory leaks, large app size, and slow rendering, and discusses various solutions.

• React Native at Grofers: Using React Native components inside native views
  https://lambda.grofers.com/starting-with-react-native-at-grofers-a-guide-to-using-react-native-components-inside-native-bbdd6a3470d4
  Looks at the pros and cons of using RN components in native views, including turnaround shipping speed, approach for bridging views, and performance.