Udemy

Platform

English

Language

Mobile Apps

Category

Complete React Native in 2021: Zero to Mastery [with Hooks]

Master React Native for iOS and Android Mobile App Development using JavaScript. Build a modern e-commerce mobile app!

4.46 (796 reviews)

Students

28 hours

Content

Jun 2021

Last Update
Regular Price

EXCLUSIVE OFFER
Exclusive  Offer
Unlimited access to 30 000 Premium SkillShare courses
30-DAY FREE TRIAL

What you will learn

Build enterprise level React Native apps and deploy to Apple App Store and Google Play Store

Learn to build reactive, performant, large scale applications like a senior mobile app developer

Learn to lead Mobile App projects by making good architecture decisions and helping others on your team

Build cross platform mobile apps for iOS and Android without using Swift, Objective C, Java and Kotlin

Learn the latest features in React Native including Hooks, Context API, AsyncStorage, and Animation

Master the latest ecosystem of a React Native Developer from scratch

Become the top 10% React Native Developer

Stripe Payments (Online Payments) integration in your mobile apps

Set up authentication and user accounts using Firebase and Firebase Functions

Routing with React Navigation

Using the latest ES6/ES7/ES8/ES9/ES10 JavaScript to write clean code

Using native phone capabilities like Camera and Vibration

Google Maps API and adding interactive maps to your projects

Styled-Components and native styling to make modern and beautiful apps


Description

Just released this month with all new React Native features for 2021! Join a live online community of over 400,000+ developers and a course taught by industry experts that have actually worked both in Silicon Valley and Toronto with React Native.

Using the latest version of React Native, this course is focused on efficiency. Never spend time on confusing, out of date, incomplete tutorials anymore, and instead, learn to build professional and modern Android and iPhone (iOS) apps! Graduates of Andrei’s courses are now working at Google, Tesla, Amazon, Apple, IBM, JP Morgan, Facebook, + other top tech companies.

We guarantee you this is the most comprehensive online resource on React Native. This project based course will introduce you to all of the modern toolchain of a React Native app developer in 2021. Along the way, we will build a massive restaurant application using React, React Hooks, Expo, React Navigation, Firebase, Styled-Components, Google Maps/Places API, React Animations, Stripe Payments, + more. This is going to be a full iOS and Android app!

The curriculum is going to be very hands on as we walk you from start to finish of releasing a professional React Native project all the way into production. We will start from the very beginning by teaching you React basics and then going into advanced topics so you can make good decisions on architecture and tools on any of your future React Native projects.

All code is going to be provided step by step and even if you don’t like to code along, you will get access to the the full master project code so anyone signed up to the course will have their own app to put on their portfolio right away.

The topics covered will be:

  • React Basics

  • React Native Fundamentals

  • Debugging React Native

  • React Navigation

  • React Hooks

  • Custom React Hooks

  • Firebase API

  • Google Maps API

  • React Best Practices

  • React Native Best Practices

  • Persistance + Session Storage

  • Android Development

  • iOS Development

  • Lottie Animations

  • Eslint And Cleaning Up Code

  • Asynchronous Javascript

  • React Native AsyncStorage and Animation

  • CSS in JS - Styled Components

  • React Native Styling

  • Installing Custom Fonts

  • Device Permissions

  • React Native App Layout

  • Modular React Code

  • Building On Expo

  • Distributing App to App and Google Play Store

  • Integrating Payments With Stripe API

  • + more


Wait wait… I know what you’re thinking. Why aren’t we building 10+ projects? Well, here’s the truth: Most courses teach you React Native and do just that. They show you how to get started, build 10 projects that are simple and easy to build in a day, and just add some styling to make them look fancy. In real life though, you’re not building silly applications. When you apply to jobs, nobody is going to care that you built a really pretty single page app. Employers want to see you build large apps that can scale, that have good architecture, and that can be deployed to the app stores.


Let me tell you 3 reasons why this course is different from any other React Native tutorial online:


1. You will build the biggest project you will see in any course. This type of project would take you months to implement yourself.


2. This course is taught by 2 instructors that have actually worked for some of the biggest firms using React Native. Mo is a super star when it comes to React Native. He is a Solutions Architect with over 7 years of experience in Software Architecture and Development. Having worked as a consultant for the majority of his career, he has seen it all in the Mobile Development world. He is also a tech lead who has build mobile and web apps for top banks, big tech companies, and one of the biggest online e-commerce stores in the world. Andrei has worked on enterprise level React applications for large tech firms in Silicon Valley as well as Toronto and his latest project was for a React Native app for one of the biggest pharmaceutical companies in the world. By having both of them teach, you get to see different perspective and learn from 2 senior developers as if you are working at a company together.


3. We learn principles that are important beyond just what you learn as a beginner. Using the instructor's experiences you learn about design patterns, how to architect your app, organize your code, structure your folders, and how to think about performance. Let’s just say we don’t shy away from the advanced topics. But more importantly, we are committed to keeping this course up to date so that as the mobile landscape changes, you always have the latest best practices with you.


This course is not about making you just code along without understanding the principles so that when you are done with the course you don’t know what to do other than watch another tutorial. No! This course will push you and challenge you to go from an absolute beginner in React Native to someone that is in the top 10% of React Native developers. 

See you inside the course!


Taught By:

Andrei Neagoie is the instructor of the highest rated Development courses on Udemy as well as one of the fastest growing. His graduates have moved on to work for some of the biggest tech companies around the world like Apple, Google, Amazon, JP Morgan, IBM, UNIQLO etc... He has been working as a senior software developer in Silicon Valley and Toronto for many years, and is now taking all that he has learned, to teach programming skills and to help you discover the amazing career opportunities that being a developer allows in life. 

Having been a self taught programmer, he understands that there is an overwhelming number of online courses, tutorials and books that are overly verbose and inadequate at teaching proper skills. Most people feel paralyzed and don't know where to start when learning a complex subject matter, or even worse, most people don't have $20,000 to spend on a coding bootcamp. Programming skills should be affordable and open to all. An education material should teach real life skills that are current and they should not waste a student's valuable time.   Having learned important lessons from working for Fortune 500 companies, tech startups, to even founding his own business, he is now dedicating 100% of his time to teaching others valuable software development skills in order to take control of their life and work in an exciting industry with infinite possibilities. 

Andrei promises you that there are no other courses out there as comprehensive and as well explained. He believes that in order to learn anything of value, you need to start with the foundation and develop the roots of the tree. Only from there will you be able to learn concepts and specific skills(leaves) that connect to the foundation. Learning becomes exponential when structured in this way. 

Taking his experience in educational psychology and coding, Andrei's courses will take you on an understanding of complex subjects that you never thought would be possible.  


--------

Mo Binni is a Solutions Architect with over 7 years of experience in Software Architecture and Development. Having worked as a consultant for the majority of his career, he has seen it all.

He has worked on global applications for multi-nationals, governments and Fortune 500 companies using React Native.


Throughout his career he has seen every type of developer and development practice, and the one thing that he believes more than anything is that software development is a pragmatic team sport. Go fast alone, go far together!

My main goal with instructing is to teach the foundational knowledge to set you up for life-long learning. Software and development practices change often, but when you have the right foundation adapting to the constant change becomes easy!


Screenshots

Complete React Native in 2021: Zero to Mastery [with Hooks]
Complete React Native in 2021: Zero to Mastery [with Hooks]
Complete React Native in 2021: Zero to Mastery [with Hooks]
Complete React Native in 2021: Zero to Mastery [with Hooks]

Content

Introduction

Course Outline

Join Our Online Classroom!

Exercise: Meet The Community

Meeting Bruno

React Native Fundamentals

How We Got Here - React Native History

How We Got Here 2 - React Native History

Why React Native?

Our First React Native App

React Native Internals

React Native Internals 2

Exercise: Is There CSS?

The 2 Paths

The 2 Paths

React DOM vs React Native

Recommended Setup

Endorsements On LinkedIN

Building With React Native: FocusTime App

FocusTime Demo

Introduction To Expo

Getting Ready To Hit The Ground Running!

Who Likes Snacks?

Running Snacks On Your Device

Running The FocusTime Demo On Your Device

Proper Preparation Prevents Poor Snacking!

Quick Recap On What We've Done So Far

A Rundown Of What's In Our Snack

Building A Simple Navigation

Creating Our Focus Feature

Adding An Input

Storing The Focus Item

RoundedButton On Press

Storing Our Focus Input

Quick Note On The Docs

Cleaning Up Our Styling

Building The Timer Feature

Building The Countdown Feature

Building The Countdown Feature Part 2

Building The Countdown Feature Part 3

A Quick Note On Error Screens

Reporting The Progress

Preset Timing Buttons

Keeping The App Awake

Vibrating When Finished With A Task

Going Full Circle

Quick Cleanup

Quick Review Of What We Have Accomplished So Far

Clearing The Subject

Storing Focus History

Storing Focus History With Statuses

Building The Focus History List

Clearing The Focus History

Storing And Loading The Focus History

Reflection Time!

Reflection Time Part 2!

Reflection Time Part 3!

Reflection Time Part 4!

Mobile Development Professional: Local Setup

Before You Start, Read This!

[MAC] Exporting FocusTime Locally

[MAC] Installing GIT

[MAC] Installing Node and Yarn

[MAC] Running it on IOS Simulator

[MAC] Installing Android Studio

[MAC] Installing Android SDK Tools

[MAC] Running On An Emulator

[MAC] Installing VSCode

[MAC] Optional: Using GIT With Visual Studio Code

[WINDOWS] Exporting FocusTime Locally

[WINDOWS] Installing GIT And VSCode

[WINDOWS] Optional: Using GIT With Visual Studio Code Part 1

[WINDOWS] Optional: Using GIT With Visual Studio Code Part 2

Github What Is It Good For?

Github Appendix

[WINDOWS] Optional: Publishing Your Code To Github

[MAC] Optional: Publishing Your Code To Github

[WINDOWS] Installing Android Studio

[WINDOWS] Installing Node and Yarn

[WINDOWS] Running FocusTime On My Device

What If I'm Still Running Into Issues?

Master Project: MealsToGo Project Setup

MealsToGo Demo

Project Files

Setting Up Our Master Project

Note For Windows Users

Creating The MealsToGo Project

[OPTIONAL] MealsToGo On Github

Video Playback Speed

Watch This Before Getting Started!

Master Project: MealsToGo Core Part 1

Time For Yoga!

Let's Do Some Yoga!

React Native Flexbox And Snacks

Spring Cleaning The Expo Setup

Quick Note On Publishing Your App

Exercise App Layout

Solution App Layout

Android StatusBar Issue

Quick Note On Debugging

Keeping Up With The Code Step By Step

Setting Up Eslint And Prettier

Using Eslint

Optimizing Eslint

Setting Up Prettier

Exercise SearchBar

Solution SearchBar

Feature Overview Restaurant List Item

Restaurant Info Setup Part 1

Restaurant Info Setup Part 2

Exercise Restaurant Info Card

Solution Restaurant Info Card

Reflection Time Restaurant Info

The Way We Are Styling Feels Weird

Trying Out Styled Components

Installing And Using Styled Component

Quick Note On How To Look At Changes

Exercise Migrating To Styled Components

Solution Migrating To Styled Components

Uhoh We Have An IOS Error

How Do We Make Things Consistent

Setting Up Our Theme

Exercise Theme Cleanup

Solution Theme Cleanup

Custom Fonts Fonts Fonts!

Loading Custom Fonts

Adding The Address

Using SVG With Rating

Exercise Adding Open Now SVG

Solution Finishing Our Restaurant Card

Building A Spacer Component

Optimizing The Spacer Component

Hold Up Why Do We Need Consistency

Wait A Second It Won't Render On Android

Creating A Typography Component And Cleanup

Solution Code Cleanup

FlatList!

List It!

No Inline Styles

Why Is There A White Bar?

Feature Overview: App Navigation

Navigation Installation

Exercise Tab Navigation

Solution Tab Navigation

Exercise Tab Bar Icons

Solution Tab Bar Icons

Simplifying Tab Icon Logic

Master Project: MealsToGo Core Part 2

Feature Overview: Adding Data!

Quick Recap Of What We'll Be Doing

Fake An API Request

Quick Refresh On Promises

Let's Transform The Data

Let's Transform The Data Part 2

Setting Up RestaurantContext

Hooking Up Our Context

Exercise Activity Indicator

Solution Activity Indicator

Quick Architecture Overview

Feature Overview Geocoding And Search

Setting Up Our Geocoding Service

Setting Up Our Geocoding Context

Hooking Up The Searchbar

Searching For Restaurants

Oh No A Bug!

Oh No A Bug Solution!

Key Warnings

Oh No An Anti-Pattern

Our Next Feature!

Let's Optimize Before We Build!

Building Navigation Infrastructure For Scale

Restructuring Navigation

Setting Up Stack Navigation

Setting Up Restaurant Detail Navigation

Modals And Touch Feedback

Exercise Rendering The Card

Solution Rendering The Card

Back To Our Feature!

Exercise Menu List

Solution Menu List

Feature Overview Map

Installing React Native Maps

Map Screen And Search

Setting The Map Region

Rendering Map Markers

Custom Map Callout Exercise

Custom Map Callout Solution

Linking A Callout To Details

Feature Overview Favourites

Favourites Context

Hooking Up Favourites Part 1

Hooking Up Favourites Part 2

Building A Favourites Bar Part 1

Building A Favourites Bar Part 2

Storing Favourites

Uh Oh An Android Bug

Feature Overview Firebase And Authentication

Firebase Installation

Quick Note On Firebase

Let's Test Authentication

Authentication Service And Context

Account And Authentication Navigation

Image Background Exercise

Image Background Solution

Lighten Up The Background

Account Screen Buttons

Exercise Login Screen

Solution Login Screen

Tying Up Some Loose Ends

Feature Overview: Registration

Activity Indicators

Favourites Is Broken Part 1

Favourites Is Broken Part 2

Adding A Watermelon Animation

Feature Overview: Settings

Building The Settings Feature

Making The Settings Screen Look Nice

Favourites Screen Exercise

Favourites Screen Solution

Animations And Polish

App Icons

Expo Publish

Bonus: Mobile Camera Module

Feature Overview Camera Module

Setting Up The Infrastructure

Exercise Expo Camera

Solution Expo Camera

Taking A Picture

Additional Changes For Android To Take a Picture

Storing And Retrieving The Picture

Bonus: Google Maps Integration

Important Note On This Section!

Setting Up Your Payment Information For Firebase

Setting Up Firebase CLI

Quick Note On Running Functions Locally

Running Firebase Functions Locally

Moving Location Mock Part 1

Moving Location Mock Part 2

Moving Restaurants Mock

Deploying Our Functions

Switching Between Local And Deployed Functions

Oh No Android Doesn't Work!

Creating a Google Cloud Account

A Cautionary Tale

Configuring Our Google Cloud Project

Setting Up Google Node SDK

Firebase Environment

Integrating Geocoding API

Integrating Places API

Integrating Places Photos

Publishing Our Expo App And Functions

Minor Optimizations

Error Management

Bonus: Mobile Payments With Stripe

Stripe Integration Demo

Stripe Integration Architecture

Signing Up For Stripe

Quick Recap On Firebase Functions

High Level Stripe Payment Flow

React Native Stripe Client

Setting Up Our Checkout

Our Credit Card Input

Getting Our First Stripe Token

Hooking Up Our Credit Card Form

Checkout Cart Overview

Building The Cart Context

Integrating Our Cart

Oh No! A Cart Bug

An Empty Cart

Adding The Checkout UI

Starting On The Payment Flow

Getting The Payee Name

Setting Up For Payment

Building Our Payment Gateway

Payment Request Part 1

Payment Request Part 2

Payment Request Part 3

Adding Loading State

Handling Error States

Exercise Cart Persistance

Solution Cart Persistance

Bonus: Releasing To The App Stores

Before We Get Started

What Will I Get Out Of This Section

Building Standalone Apps

Building An APK For Android

Running Our APK On The Emulator

Creating A Play Store Account

Building iOS With Expo

Testing Your iOS Build On A Simulator

AppStore Connect And TestFlight

Bonus: App Polish + Customizing MealsToGo

Adding Some Polish

Adapting The Theme Colors

Improving The Settings Screen

Improving Restaurant Detail Screen

The Favourites Bar

Where To Go From Here?

Become An Alumni

Learning Guideline

Coding Challenges

Endorsements On LinkedIN

Course Review

The Final Challenge

Appendix: Learn React

Before We Start

Introduction To React.js

Quick Note: CRA Growing Pains

create-react-app

create-react-app 2

create-react-app 3

Quick Note: Class vs Functional App.js

Code From Previous Video

Your First React Component

Building A React App 1

Building A React App 2

Building A React App 3

Styling Your React App

Building A React App 4

Building A React App 5

Building A React App 6

Project Files

Keeping Your Projects Up To Date

React Review

Error Boundaries In React

Deploying Our React App

React Hooks

React Hooks 2

React Hooks 3

React Hooks 4

React Hooks 5

React Hooks 6

React Hooks 7

React Hooks 8

Project Files

React Hooks 9

Next Steps

Appendix: Git + Github

CWD: Git + Github

Github Update: Master --> Main

CWD: Git + Github 2

Appendix: Open Source Projects

Contributing To Open Source

Contributing To Open Source 2

Exercise: Contribute To Open Source


Reviews

T
Tanish15 April 2021

Great course. I am 100% trusting ZeroToMastery from a year or two. Please add LINUX section in section 5 like MAC & WINDOWS.

G
Gopinath11 April 2021

After watching all the videos of history and why react nactive I got more interest to learn this reactive native.

J
Jeff27 March 2021

The course itself was OK, but I felt that it spent too much time on advanced concepts and not enough time on some basics that were covered in another React Native course that I took. I'm glad that I took that other course first or I might not have had such good information about how to deploy the app, for example. The biggest problem with this course is that the instructor is very unhelpful. His tone in the Q&A is awful compared to other Udemy instructors, he'll make you feel nervous about even posting anything there. I actually got a PM from him telling me to stop sharing tips for other students, that it's only for them to ask questions to him. That's not trure correct according to the Udemy instructions, and he backtracked after I pointed that out.

P
Paul25 March 2021

There's nothing crazy so far. The instructor seems to know his stuff. I have no problem following along with the cause. This is probably because i am not new to react native and react js. I would warn you that you are probably better off coming into this course if you have understanding of basic react hooks concepts. This is because up to to this point in the course the instructor will not explain to you some of the react concepts he is using such useState or useEffect. Otherwise great stuff

J
Jimmy22 March 2021

So far so good, learning about the history is a little helpful why and how the knowledge in this course can be applied to real life

r
radu20 March 2021

Andrei way of putting things together is by far the best way possible that you can find on the entire www.

E
Edward18 March 2021

The instructor (Mo Binni) doesn't know and doesn't want to know basic things from the react documentation. He doesn't know how to reasonably conduct a dialogue. Instead, he deleted my question and all the answers to it.

M
Muhammad18 March 2021

The course really great, consistent & clean code also it teaches the best practice of react native. Recommended course!!

S
Shah15 March 2021

The tutor changes his mind a lot. I take notes with screenshots AND follow his coding so I learn. Every time he changes his mind, I have to delete my notes and screenshots, delete code and redo the whole thing. I thought the coding is pre-planned before he records... otherwise, great course.

G
Giannis12 March 2021

The flow of the course is really fun and interesting. As a front-end developer myself i can coincide with the instructor really well as he achives to teach correctly the framework's developement logic.

R
Ramprit8 March 2021

Awesome course on udemy for react native I really enjoyed this course and helped me a lot to understand about react native take this course if you want to sharpen your skills in javascript, reactjs and react native

T
Tim8 March 2021

If you are coming to this course not knowing React. Dont be fooled by the title. The course intro to React is terrible and jumps all over the place trying to learn how to set everything up. Using multiple different IDE's and tools, packet managers etc... As a beginner you will be very very lost.

E
Evandro7 March 2021

It's always good to learn new technologies such as React Native, Flutter and all those frameworks out there. Being up to date with new technologies it's part of being a developer or "tech person". I know Andrei methodology for teaching and surely this course will be awesome!

A
Adwaithrajesh5 March 2021

Started the course yesterday. The course is structured pretty well. I enrolled in 6 of Andrei courses they were perfect. I promise this course will be a fun journey and i'am pretty sure Andrei & mo will not disappoint you.

S
Souvik3 March 2021

I was waiting for this course to get published on Udemy. As soon I saw Andrei's announcement on Discord, I enrolled in it and started learning. Currently I'm on the section to create the focus time app & I'm really loving it. ZeroToMastery courses has always been my favorite and thanks to Andrei and Mo Binni for this awesome course.


Coupons

DateDiscountStatus
3/3/202195% OFFExpired

2994426

Udemy ID

4/13/2020

Course created date

3/3/2021

Course Indexed date
Bot
Course Submitted by

Twitter
Telegram