Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m

Next lesson playing in 5 seconds


Free Preview: Get Started With React Native


  • Overview
  • Transcript

Mobile app users expect the performance and features that can only be supplied by native app development. But going native often means that you have to develop your app for multiple platforms. React Native, created by Facebook, bridges this gap by letting you write your user interface in modern JavaScript and automatically transforming it into native platform-specific views.

In this course, Envato Tuts+ instructor Markus Mühlberger will teach you how to write mobile apps in React Native. You will learn how to create, lay out and style components, provide user interaction, and integrate third-party components into your app. Along the way, you'll build a cool cross-platform run tracking app!

Learn JavaScript: The Complete Guide

We've built a complete guides to help you learn JavaScript and learn React, whether you're just getting started as a web developer or you want to explore more advanced topics.

1. Introduction

1.1 Introduction

When it comes to mobile devices, web applications just don't cut it anymore. But often, the effort needed to create multiple, completely separate native applications isn't worth it or the knowledge to do so is missing. React Native, created by Facebook, tries to solve this problem by using Noches as a basic for creating engaging mobile applications. Hello and welcome to this invited Touch Plus course. My name is Markus Mühlberger and you are watching Get Started with React Native. In this course, I will be covering the basic concepts that you need to learn when creating mobile applications using React Native. Some of the topics you are going to learn are components, layouting and style, scroll view and list view, as well as using third-party components and redux. I'm using the Course Project, a run-tracking app, to demonstrate how to use these components together to create a functioning app. Let's learn React Native together.

1.2 Project Overview

Hi and welcome back to Get Started with React Native. In this lesson, I'll demonstrate the courseproject we will create during the course, show you around the source code, and tell you how the Git repository is organized. The project we are building is a simple location-tracking app that will show a map view and some additional info, specifically overall distance, current speed, and bearing. It also draws a line of the tracked route. The app is simple, but uses a lot of techniques that you can reuse with different components in your own app. Let's have a look at the code. We'll spend most of the time in index.ios.js. You can follow along on Android as well, although there are additional steps sometimes that you will have to look up in the documentation. This is primarily the case for the lesson about maps. I will tell you whenever there is an extra step. You will also have to work with index.android.js instead. We are going to create five additional files during the course, two of them will be in the components folder [INAUDIBLE] are actions, reducer, and shared-styles. Everything else will be unchanged by us, although some commands we'll run may change files there. The one exception is AndroidManifest.xml that you will need adapt for maps and location usage. Since the course project is going to change throughout the course, I have organized the result of every lesson in a separate commit. The commits will be tagged with the section and lesson numbers. Whenever I clean something up in preparation for the next lesson, this will be a separate commit as well before the text one. In the next lesson we're going to get started by installing React Native for iOS and Android. If you're already, set up you can skip to the first lesson of the next section. See you there.