Welcome

Hi there, and welcome to React Native v2! 👋

Course Objective

I build React Native apps for a living and my main goal today is to give you an idea on how I do it - what are the best practices, conventions, do's and dont's.

The aim of the course is to give you the knowledge and resources necessary to start building your own React Native project. We will cover what React Native is, how it works, what kind of components and tooling are available, and how to use them. We will stick with built-in and mainstream components, and minimize the use of third party components and libraries.

Course guide

The course is designed to be pretty hands-on: the general pattern is that we'll introduce a concept and then apply it.

  • chapters marked with a 📝 emoji are exercises. How you approach them is up to you! If you generally learn best by doing, I'd recommend spending up to 10-15 minutes in completing the exercise independently before looking at the solution
  • chapters marked with a 👀 emoji are the solutions to exercises
  • make note of the link 🔗 emojis - these link to a GitHub repository that contains the solution to the code we just added - you can use this as a reference to check your work
  • there are three versions of the solution: [RN] for a plain React Native project, [Expo] for an expo project and [Live Coding] which is a exactly how the exercise was written live on the Workshop day. The resulting app looks the same, but there were some minor changes in variable names and order of operations which might be confusing, so if you're following the course on Frontend Master, you might want to use the version of the solutions with the 👩‍💻 emoji. Thank you Joumana for the writeup!
  • you will also occasionally see links with a 🔍 emoji - these are code examples in Expo Snack, there to help introduce or illustrate a concept. You can look at these in the browser (unless specified otherwise) or on your phone if you have the Expo app installed. Feel free to play around with them, your changes will not be saved to the hosted version
  • you can follow this course with Expo or without, the choice is yours. For most lessons, this doesn't matter. There are a couple of pages that are specific to the platform though. These will be prefixed with [Expo] or [RN] - choose the one that applies to you, but feel free to also check out the other if you're interested

About You

The intended audience for this course are people who are familiar with JavaScript, but new to React Native. If you already know React, that's perfect, since your React skills are completely transferrable to React Native with only minor modifications to account for the native platform. However if you are new to both React and Native, never fear! I will be explaining all the React concepts as well as the React Native concepts as we discover them together, however there will be more of a focus on the parts of React Native that differ from React on the web.

In this course, I will be using a MacBook Pro, an iPhone simulator and an Android emulator from Android Studio.

You do not need to match my setup, but you should have:

  • either a Mac, Windows or Linux machine
  • either a physical device (iPhone or Android) OR a simulator/emulator installed

There are a few different ways to set up your development environment, depending on what hardware you have and whether you'd like to use vanilla React Native or Expo. Don't worry about making a decision right away, the next lesson will explain the pros and cons of all your options so you can make an informed decision on what is the best fit for you.

About Me

Hi, my name is Kadi and I am a Senior Software Engineer at Formidable where I build things in JavaScript, mostly using React Native. I first got into coding in University where I studied Maths with Psychology. I had just the one programming course in second year of university, in C++. From the first time my program compiled and ran without errors, I was hooked! After that, I followed a long and winding road to end up where I am now, but suffice it to say I have been writing code professionally since 2013, using React since 2015 and React Native since 2017.

As for social media, you can find me on Twitter, LinkedIn and GitHub.

Why Was This Course Created

This is supplementary material for my Frontend Masters course - React Native v2 using the Gatsby template by Brian Holt. Not everyone has the money to pay for these courses which is why these materials are and will be forever open source for you to reference and share. Thank you to the kind folks at Frontend Masters who are encouraging teachers to compile and open source these course materials.