React Native: Advanced Concepts

Focused View

Stephen Grider

16:33:13

39 View

01 - Expo Setup

001 Introduction - Start Here!.mp4

01:43

002 Github Links.html

003 Creating React Native Apps.mp4

02:23

004 Why Expo.mp4

06:44

005 Creating Our First App.mp4

04:13

02 - Animations with React Native

001 Animation Systems.mp4

06:16

002 The Animation Module.mp4

09:47

003 Animation from Square One.mp4

08:14

004 Moving a Ball.mp4

05:23

005 How Animations Work.mp4

09:36

006 Animation from Another Angle.mp4

08:47

007 Swipe Deck Props.mp4

04:17

008 Component Boilerplate.mp4

03:51

009 Deck Data.html

010 Interplay Between Components.mp4

07:34

011 Customizing Individual Cards.mp4

13:51

03 - Handling Gestures

001 The Pan Responder System.mp4

10:23

002 Pan Responders Event Handlers.mp4

08:47

003 The Gesture Object.mp4

09:54

004 Dragging a Card.mp4

11:28

04 - Applying Animation Styling

001 Animating Single Cards.mp4

04:38

002 How to Rotate Elements.mp4

06:59

003 Interpolating Rotation Values.mp4

06:14

004 Linear Relations with Interpolation.mp4

05:33

005 Limiting Rotation with Interpolation.mp4

05:33

006 Springing Back to Default.mp4

05:10

007 Detecting Minimum Swipe Distance.mp4

07:22

008 Programmatic Animation.mp4

08:41

009 Forcing Swipes.mp4

04:11

010 Callbacks on Swipe Completion.mp4

06:25

05 - Component Reusability

001 Writing Reusable Components.mp4

04:49

002 The DefaultProps System.mp4

04:20

003 Resetting Card Position.mp4

06:03

004 Advancing the Deck.mp4

06:10

005 Handling Empty Lists.mp4

06:49

006 Getting the Cards to Stack.mp4

08:31

007 Troubleshooting Flashing Images.mp4

03:09

008 Cascading Card List.mp4

05:34

009 Animating Advancing Cards.mp4

04:22

010 Resetting the Index.mp4

05:15

011 Deck Wrapup.mp4

03:39

06 - One Time Password Authentication

001 Review of Common Auth Flows.mp4

08:20

002 The Details of One Time Passwords.mp4

10:04

003 Tech Stack with Google Cloud Functions.mp4

08:26

004 Traditional Servers vs Google Cloud Functions.mp4

08:21

005 Layout of Google Cloud Functions.mp4

09:49

006 Firebase Project Setup.mp4

07:21

007 Deploying a Firebase Project.mp4

04:35

008 Testing Deployed Functions.mp4

07:42

009 Project File Structure.mp4

05:48

010 The Request and Response Objects.mp4

10:49

011 Generating a Service Account.mp4

05:48

012 Sanitizing User Inputs.mp4

08:54

013 Creating New Users.mp4

06:22

014 Testing New User Creation.mp4

05:23

07 - Twilio Integration

001 Texting from Twilio.mp4

06:29

002 Twilio Credentials.mp4

07:03

003 Accessing Saved Users.mp4

06:10

004 Quick Note.html

005 Sending Texts to Users.mp4

08:45

006 Generating Access Codes.mp4

09:05

007 Verifying One Time Passwords.mp4

08:00

008 Invalidating Used Codes.mp4

07:52

009 Generating JWTs.mp4

04:31

08 - Client Side One Time Passwords

001 Transitioning to React Native.mp4

02:53

002 App Boilerplate.mp4

06:57

003 Defining Instance Properties.mp4

08:09

004 Invoking Cloud Functions.mp4

06:57

005 Refactoring with AsyncAwait.mp4

09:07

006 Debugging with AsyncAwait.mp4

04:33

007 AsyncAwait on User Signin.mp4

05:59

008 Capturing Tokens.mp4

03:52

009 Firebase Auth with a JWT.mp4

05:58

010 Breather and Review.mp4

07:23

09 - Bringing it All Together

001 App Overview.mp4

05:39

002 Screen Walkthrough.mp4

06:23

003 More Screen Walkthroughs.mp4

06:41

004 App Challenges and Solutions.mp4

05:10

005 Screens vs Components.mp4

03:12

006 React Native Navigation Options.mp4

09:21

007 React Navigation in Practice.mp4

10:24

008 Screen Boilerplate.mp4

07:05

009 Implementing the First Navigator.mp4

07:13

010 Nesting Navigators.mp4

07:11

011 Wiring Up Stack Navigators.mp4

03:15

012 Class vs Instance Properties.mp4

05:40

013 Customization with Header Options.mp4

04:43

014 Programmatic Navigation.mp4

06:41

015 Styling the NavBar.mp4

05:12

016 The Welcome Screen.mp4

06:11

017 Styling the Welcome Screen.mp4

07:40

018 Even More Welcome Screen Styling!.mp4

08:39

019 Navigation from the Welcome Screen.mp4

04:57

020 More on Welcome Screen Navigation.mp4

10:01

10 - Facebook Authentication

001 Facebook Auth Flow.mp4

05:31

002 The Facebook Dev Console.mp4

05:50

003 Redux Setup.mp4

13:01

004 Using Async Storage.mp4

10:06

005 Crazy AsyncAwait Syntax.mp4

13:00

006 Logging in With Facebook.mp4

17:46

007 Testing Facebooks Login Flow.mp4

10:37

008 Quick Note.html

009 Worlds Biggest Gotcha.mp4

09:13

010 The Auth Reducer.mp4

05:46

011 Skipping the Auth Screen.mp4

08:49

012 Testing Auth Flow.mp4

03:51

013 Advancing the Welcome Screen.mp4

11:36

014 Resolving the Loading Screen.mp4

03:01

11 - MapViews on React Native

001 Showing a Map.mp4

05:25

002 Interacting with the MapView.mp4

07:23

003 Working around MapView Issues.mp4

04:43

004 Indeed API Key.html

005 The Indeed Jobs API.mp4

08:55

006 Location API Mismatch.mp4

08:58

007 Converting LatLong to Zip Code.mp4

10:31

008 Fetching a List of Jobs.mp4

07:42

009 Issuing Action Creators from MapScreen.mp4

10:04

010 The Jobs Reducer.mp4

08:44

011 Navigating from Action Creators.mp4

05:29

012 The Deck Screen.mp4

03:57

013 Importing the Deck Component.mp4

04:24

014 Applying the Swipe Component.mp4

06:10

015 Styling Job Cards.mp4

08:38

016 Customizing MapViews.mp4

10:29

017 Android Compatibility.mp4

07:07

018 Dynamic Key Props.mp4

04:42

019 One More Swipe Deck Fix.mp4

02:08

020 Liking a Job.mp4

03:29

021 Considering Only Unique Jobs.mp4

10:40

022 The Review Screen.mp4

03:20

023 Rendering a List of Liked Jobs.mp4

08:00

024 Applying to Jobs.mp4

08:19

025 Mapping a Jobs Location.mp4

08:25

026 Styling the Job Card.mp4

06:33

027 Clearing Liked Jobs.mp4

07:36

028 Redirecting Back to the Map.mp4

03:23

029 Callback Gotcha.mp4

03:26

030 Tab Bar Icons.mp4

05:30

031 Tab Bar Config.mp4

06:47

032 Android Specific Fixes.mp4

04:37

12 - Offline Data Persistence

001 Push Notifications and Data Persistence.mp4

03:30

002 Persisting Application State.mp4

05:25

003 Wiring Up Redux Persist.mp4

03:29

004 How Redux Persist Works.mp4

06:57

005 Redux Persist - Huge Gotcha!.mp4

08:23

13 - Push Notifications

001 Push Notification Overview.mp4

05:50

002 Registering For Push Notifications.mp4

08:17

003 Generating Push Tokens.mp4

05:15

004 Testing Notifications.mp4

06:15

005 More on Notifications and Wrapup.mp4

04:50

14 - Bonus!

001 Bonus!.html

Description

Master the advanced topics of React Native: Animations, Maps, Notifications, Navigation and More!

What You'll 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

Who is this for?

This course is for anyone looking to learn advanced topics of React Native

What You Need to Know?

Basic understanding of React Native

More details

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Â Persistence?Â Of 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 this course is for:
This course is for anyone looking to learn advanced topics of React Native

User Reviews

Rating

average 0

Total votes0

Focused display

React Native

Stephen Grider

Instructor's Courses

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.

Udemy

View courses Udemy

Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.