The best way to start learning React Native

I’ll be doing a project using React Native this semester for college. So, I gathered every resource that I thought it might be helpful for someone starting to learn React Native.

But firstly… What’s React Native?

What’s React Native

React Native is an exciting framework that enables web developers to create robust mobile applications using their existing JavaScript knowledge. It offers faster mobile development, and more efficient code sharing across iOS, Android, and the Web, without sacrificing the end user’s experience or application quality. The tradeoff is that it’s new, and still a work in progress. If your team can handle the uncertainty that comes with working with new technology and wants to develop mobile applications for more than just one platform, you should be looking at React Native.

Why React Native

The first and foremost reason to use React Native is that the developer has to write one set of code, (JavaScript code) to enjoy the performance of the REACT Native Mobile Applications.

**Pros:

  1. Cross-Platform **The React Native apps can be developed via using a single codebase for both the platforms simultaneously, which increased its popularity even more.

2. Performance At the initial stages, ‘hybrid’ or ‘mobile web’ apps were popular for their uncommonness mainly. However, when it comes to performance, the complicated the apps, the more lags it experienced. The REACT Native apps are compiled into natively written code, which enables it to not only work on both the operating systems but also functions the same way on both the platforms with no lags at all.

Other benefits of using REACT Native Framework include its faster development, ability to reuse components and ease to be maintained. Besides, it is a timesaving process and therefore many industries and even individuals today prefer using React Native along with NodeJS for creating astonishing mobile applications.

**Cons:

  1. It’s Technological Edge **Though the React Native’s pre-packaged elements set you aside from having much technical advancement, however, you will still need a professional developer to watch out some technical glitches and bugs.

2. Might be killed overnight! Since the social media giant Facebook has developed this framework, its existence remained uncertain as Facebook has all the rights to kill off the project anytime. Though with the current popularity of the technology, it is unlikely to happen.

Introduction

First of all, if you know how to code, then you are all set… but if you don’t know how to code you should check out some introductory courses first to get you started with programming and after that, come back again.

The best way to learn React Native is to understand what mobile development is. I am coming from iOS, so I have an idea of what building an app looks like. What I mean is that you need to know the basic concepts like NavigationController and TabBar… etc.

You need to get these things straight because you will be using them in React Native. A few people would suggest implementing them in Kotlin, Java or Objective-C/Swift and then see how they work in React Native, but I don’t think that is strictly necessary.

The next steps

  • Start by reading the getting started tutorial and try to run it on your machine. It’s the first thing I did. This will give you a sense of what we are talking about. Getting Started — React Native | A framework for building native apps using React

  • Read about the Components specs and lifecycle in React. RN comes from ReactJS, they have a lot of things in common and understanding things like componentDidMount() or componentWillMount() will help you. Component Specs and Lifecycle | React

  • Then read Pete Hunt’s tutorial about ReactJS. You need to understand what components are and how they are implemented. Thinking in React | React

  • I would suggest going through the other sample apps, all of them. Read code and when you don’t understand something, just Google it. If you want to see how an app needs to be structured in the proper way, you may want to have a look at the Facebook8 App (fbsamples/f8app). This is really good, but it’s not for beginners. Come back here when you want to see how to use Redux in a React Native app.

  • There are plenty of tutorials that explain how to write a simple app in React Native. You can use this one: Going native with React, an introduction. It’s probably outdated by now, but it will give you an idea on what you need to complete your project.

  • Yes, I said project. You need something to start with. You learn by coding (and reading), not just reading or (even worse) watching. Why don’t you try to implement Instagram? Tinder could be another idea.

  • Don’t read the Docs. It’s not a book, but just a reference to the things you will need to use along your journey, so while developing keep a tab open, if you are not familiar with it. Keep in mind that React Native is moving fast, so you may want to check them from time to time.

  • Have a look at Share and test your React Native code in the browser. This is a really interesting resource with a lot of examples. You will find it integrated in the docs as well.

  • Download the Facebook 8 app, Facebook Groups (this is not 100% React Native), Facebook Ads’ Manager and open the events view on your Facebook app. Welcome to React Native.

  • React Native Training

Other courses

Resources

Did you find this article valuable?

Support Hassan ElDesouky by becoming a sponsor. Any amount is appreciated!