Build your first app with React Native

Get started right away with React Native - Start building native apps for iOS & Android today!

4.05 (45 reviews)

Udemy

platform

English

language

Mobile Apps

What you will learn

The ability to begin to create real world apps for iOS & Android with React Native using Expo

Create your first app in React Native

Get a strong understanding of Expo

Learn how to create a new app from the command line

Description

Start building apps today!

React Native is used to power some of the most popular apps in the world such as Facebook, Instagram, Uber and Pinterest. All that is needed to create an app in both iOS and Android is React Native using Javascript. This is the easiest and fastest way to create an app that can thrive on both app stores! This course will take you step by step into the React Native ecosystem, starting with the core elements and even all the way to creating your very own app ready for distribution on iOS and Android.

You will also be taught how to use Expo - a framework that enables developers to develop and test quickly, saving you time.

This course will run through both React Native and Expo and show why together they are the best way to create apps for both iOS and Android.

The course will cover:

What is React Native?
Why use the Expo Framework?
Components, State and Props in React Native
Creating our first basic app
Making a real world example app (Weather App)
Followed by bonus videos & downloads

The ideal student is someone who has some background knowledge of Javascript and is interested in being able to create apps for iOS and Android.

Content

Course Introduction

Welcome to the course

Getting started

Who uses React Native & Why Expo

Software to install

Intro to React Native

Overview of React Native components

Find more information on the React Native docs

Looking at the Expo docs

What are "props" in React Native?

What is "state" in React Native?

Install Hyper for terminal commands

React Native Basics

Create app in React Native using the command line in Hyper

Using the FlatList component

Using the image component

Using pull to refresh with a flatlist

How to use React Native Navigation

Styling options in react native

Using Flex Box

Building a Real Weather App In React Native

Building a weather app - creating the app from the command line

Planning the flow of the app & adding folders

Install dependencies and begin to create home screen

Fetching data from an API

Cities List

Set array of cities and create random function

Using the console to log responses and start building FlatList

Android Notes: Using Font Family

Add styling to FlatList rows and add conditional font colours

Adding Expo gradient component and touch event

Add conditional emoji for weather types

Improving the CityWeather App

Intro: Taking the CityWeather app further.

Use tab navigation

Add search screen

Final changes to improve the CityWeather app

Build & Publish to App Stores

Create and publishing a build to App Stores

Bonus & Advanced

How to use custom fonts

Android Notes: Alert box display

Add improved styling for alert box.

FlatList in reverse (Inverted prop)

How to fix errors

Using dimensions

Extra: React Native Navigation (Stack Navigator)

Thank you & Links

Screenshots

Build your first app with React Native - Screenshot_01

Build your first app with React Native - Screenshot_02

Build your first app with React Native - Screenshot_03

Build your first app with React Native - Screenshot_04

Reviews

Darren

October 5, 2019

Well coordinated following the initial hiccups of out dated dependencies. All in all, a helpful tutorial

Paul

June 4, 2019

Very well done, working with pretty modern versions of all the technologies involved. He speaks very clearly and at a good rate. The content is broken up into logical portions. And he provides several little tips throughout on all aspects of the process of getting up and running as well as general troubleshooting throughout that were all very helpful.

Anudeep

May 12, 2019

More emphasis on how set state and functions are working in the weather App would help us apply these concepts to our own apps.

Charts

Price

Rating

Enrollment distribution

Build your first app with React Native - Distribution chart