React Native: Advanced Concepts
4.7 (1,061 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
8,896 students enrolled
Wishlisted Wishlist

Please confirm that you want to add React Native: Advanced Concepts to your Wishlist.

Add to Wishlist

React Native: Advanced Concepts

Master the advanced topics of React Native: Animations, Maps, Notifications, Navigation and More!
4.7 (1,061 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
8,896 students enrolled
Created by Stephen Grider
Last updated 7/2017
English
English
Curiosity Sale
Current price: $10 Original price: $95 Discount: 89% off
30-Day Money-Back Guarantee
Includes:
  • 16.5 hours on-demand video
  • 6 Articles
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Make compelling applications using expert-level features of React Native
  • Create amazingly smooth and performant animations
  • Build new React Native apps with Expo
  • Understand the latest Navigation options for new React Native apps
  • Add logic to your Firebase backend with Google Cloud Functions
  • Update your users with cross platform Push Notifications
  • Handle your users going offline with Redux Persist
View Curriculum
Requirements
  • Basic understanding of React Native
Description

Note: This course assumes you've got the basics of React Native down.  Check out my course 'The Complete React Native and Redux' course, its the perfect preparation!

Go beyond the basics of React Native!  This course will teach you the advanced topics you need to make a #1 best-selling app.

Push Notifications? You will learn it.  In Depth Animations? Included.  Offline Data PersistenceOf course!

------------------------------

What Will You Build?

All of my courses are 'learn-by-doing': no boring endless lectures with Powerpoints, only live, interactive coding examples.  In this course we'll build three separate apps with increasing complexity, each of which will profile different features of React Native.  By putting each concept into a real app, you'll get a better idea of when to use each unique and powerful feature.

1) Build a Tinder-like Swipe Deck. Yes, the classic animated component!  We'll make a big stack of beautiful cards that a user can slide around the screen, swiping right to 'like' an item, or 'left' to dislike an item.  This warmup will get you familiar with interpreting touch input through the PanResponder system, moving elements around with the Animated module, and turning extrapolating animation values through the Interpolation system.

2) Dive into the backend with One Time Password authentication. Ever been prompted to sign in using a code that gets texted to you?  One Time Passwords are a new authentication flow that leverages a user's phone number as their unique identifying token.  We will use the Twilio API to send a text message to a user to verify their identity, while securing our business logic into Firebase's new Google Cloud Functions.

3) Your own Job-Search app.  Tinder for jobs! This app is is 100% feature complete!  We'll build an app with a full welcome-screen tutorial for our new user's, Facebook authentication, and map components.  The user will be presented with a list of jobs to like or dislike based on their location by leveraging Indeed's Job API, then follow up and apply to their choice jobs.

Both OSX and Windows supported - develop iOS or Android!

------------------------------

Here's what we'll learn:

  • Learn the theory and practice of implementing complex Animation systems
  • Bootstrap your app using the new Expo platform
  • Navigate your user around using React-Navigation
  • Engage your users with automated Push Notifications
  • Enhance authentication flows in your app with One Time Passwords with Twilio
  • Increase your app's reliability with Offline Data Persistence
  • Educate your users on how to use your app with Welcome Tutorial pages
  • Authenticate your users using Facebook OAuth
  • Go beyond the mobile front end with Google Cloud Functions: Add custom logic to your Firebase backend
  • Locate your users with cross-platform MapView components


I've built the course that I would have wanted to take when I was learning React Native. A course that explains the concepts and how they're implemented in the best order for you to learn and deeply understand them.

Who is the target audience?
  • This course is for anyone looking to learn advanced topics of React Native
Students Who Viewed This Course Also Viewed
Curriculum For This Course
151 Lectures
16:34:43
+
Expo Setup
5 Lectures 15:07

Github Links
00:04

Creating React Native Apps
02:23

Why Expo?
06:44

Creating Our First App
04:13
+
Animations with React Native
11 Lectures 01:17:58




How Animations Work
09:36

Animation from Another Angle
08:47

Swipe Deck Props
04:17

Component Boilerplate
03:51

Deck Data
00:24

Interplay Between Components
07:34

Customizing Individual Cards
13:51
+
Handling Gestures
4 Lectures 40:32
The Pan Responder System
10:23

Pan Responder's Event Handlers
08:47

The Gesture Object
09:54

Dragging a Card
11:28
+
Applying Animation Styling
10 Lectures 01:00:46
Animating Single Cards
04:38

How to Rotate Elements
06:59

Interpolating Rotation Values
06:14

Linear Relations with Interpolation
05:33

Limiting Rotation with Interpolation
05:33

Springing Back to Default
05:10

Detecting Minimum Swipe Distance
07:22

Programmatic Animation
08:41

Forcing Swipes
04:11

Callbacks on Swipe Completion
06:25
+
Component Reusability
11 Lectures 58:41
Writing Reusable Components
04:49

The DefaultProps System
04:20

Resetting Card Position
06:03

Advancing the Deck
06:10

Handling Empty Lists
06:49

Getting the Cards to Stack
08:31

Troubleshooting Flashing Images
03:09

Cascading Card List
05:34

Animating Advancing Cards
04:22

Resetting the Index
05:15

Deck Wrapup
03:39
+
One Time Password Authentication
14 Lectures 01:47:42
Review of Common Auth Flows
08:20

The Details of One Time Passwords
10:04

Tech Stack with Google Cloud Functions
08:26

Traditional Servers vs Google Cloud Functions
08:21

Layout of Google Cloud Functions
09:49

Firebase Project Setup
07:21

Deploying a Firebase Project
04:35

Testing Deployed Functions
07:42

Project File Structure
05:48

The Request and Response Objects
10:49

Generating a Service Account
05:48

Sanitizing User Inputs
08:54

Creating New Users
06:22

Testing New User Creation
05:23
+
Twilio Integration
9 Lectures 58:22
Texting from Twilio
06:29

Twilio Credentials
07:03

Accessing Saved Users
06:10

Quick Note
00:27

Sending Texts to Users
08:45

Generating Access Codes
09:05

Verifying One Time Passwords
08:00

Invalidating Used Codes
07:52

Generating JWT's
04:31
+
Client Side One Time Passwords
10 Lectures 01:01:48
Transitioning to React Native
02:53

App Boilerplate
06:57

Defining Instance Properties
08:09

Invoking Cloud Functions
06:57

Refactoring with Async/Await
09:07

Debugging with Async/Await
04:33

Async/Await on User Signin
05:59

Capturing Tokens
03:52

Firebase Auth with a JWT
05:58

Breather and Review
07:23
+
Bringing it All Together
20 Lectures 02:11:15
App Overview
05:39

Screen Walkthrough
06:23

More Screen Walkthroughs
06:41

App Challenges and Solutions
05:09

Screens vs Components
03:12

React Native Navigation Options
09:20

React Navigation in Practice
10:24

Screen Boilerplate
07:05

Implementing the First Navigator
07:13

Nesting Navigators
07:11

Wiring Up Stack Navigators
03:15

Class vs Instance Properties
05:39

Customization with Header Options
04:43

Programmatic Navigation
06:41

Styling the NavBar
05:12

The Welcome Screen
06:11

Styling the Welcome Screen
07:40

Even More Welcome Screen Styling!
08:39

Navigation from the Welcome Screen
04:57

More on Welcome Screen Navigation
10:01
+
Facebook Authentication
14 Lectures 01:58:22
Facebook Auth Flow
05:31

The Facebook Dev Console
05:50

Redux Setup
13:00

Using Async Storage
10:06

Crazy Async/Await Syntax
13:00

Logging in With Facebook
17:46

Testing Facebook's Login Flow
10:37

Quick Note
00:16

World's Biggest Gotcha
09:13

The Auth Reducer
05:46

Skipping the Auth Screen
08:49

Testing Auth Flow
03:51

Advancing the Welcome Screen
11:36

Resolving the Loading Screen
03:01
3 More Sections
About the Instructor
Stephen Grider
4.7 Average rating
42,949 Reviews
98,580 Students
13 Courses
Engineering Architect

Stephen Grider has been building complex Javascript front ends for top corporations in the San Francisco Bay Area. With an innate ability to simplify complex topics, Stephen has been mentoring engineers beginning their careers in software development for years, and has now expanded that experience onto Udemy, authoring the highest rated React course. He teaches on Udemy to share the knowledge he has gained with other software engineers. Invest in yourself by learning from Stephen's published courses.