CourseFlix

React Native: Advanced Concepts

16h 35m 38s
English
Paid

Discover the advanced concepts of React Native through an engaging and practical learning experience. This course offers hands-on projects, where you'll build three different applications, each showcasing unique features of React Native. By applying each concept in a real-world app, you'll grasp the best use cases for each feature.

Course Projects

1) Tinder-like Swipe Deck

Master the animated component by creating a stack of interactive cards that users can swipe left or right. This exercise will familiarize you with touch input using the PanResponder, element movement with the Animated module, and animation value extrapolation via the Interpolation system.

2) One Time Password Authentication

Explore backend development with a modern authentication flow using phone numbers as unique identifiers. Implement Twilio API to send verification codes via text, while securing logic with Firebase's Google Cloud Functions.

3) Job-Search App: Tinder for Jobs

Build a comprehensive job search app featuring a welcome-screen tutorial, Facebook authentication, and map components. Utilize Indeed's Job API to present users job listings based on location, allowing them to apply to chosen jobs seamlessly.

Platform Compatibility

Supports both OSX and Windows, enabling development for iOS and Android platforms.

Course Learnings

  • Implement complex Animation systems
  • Bootstrap apps using the Expo platform
  • Navigate through apps with React-Navigation
  • Integrate automated Push Notifications
  • Secure authentication with One Time Passwords via Twilio
  • Ensure reliability through Offline Data Persistence
  • Guide users with Welcome Tutorial pages
  • Authenticate with Facebook OAuth
  • Extend backend capabilities using Google Cloud Functions
  • Implement cross-platform MapView components

Course Philosophy

This course is designed to provide a comprehensive understanding of React Native in an orderly and intuitive manner, just the way I wished I had learned it.

Prerequisites

Requirements:
  • Basic understanding of React Native

Target Audience

Who this course is for:
  • Individuals eager to delve into advanced React Native topics

What You'll Accomplish

  • Create advanced applications with expert React Native features
  • Develop smooth and high-performance animations
  • Construct new React Native apps with Expo
  • Master the latest navigation techniques in React Native
  • Integrate backend logic in Firebase with Google Cloud Functions
  • Implement cross-platform Push Notifications
  • Manage offline scenarios using Redux Persist

About the Authors

Stephen Grider

Stephen Grider thumbnail

Stephen Grider is one of the longest-running and most prolific instructors on Udemy, with a catalog covering essentially every major JavaScript framework, plus Docker, Kubernetes, AWS, and the broader full-stack development landscape. His teaching style is patient and project-oriented — most of his courses are structured around building a substantial application from scratch rather than working through disconnected tutorial examples.

The catalog covers React, Redux, Next.js, Vue, Angular, GraphQL, Node.js, Docker / Kubernetes, AWS infrastructure, React Native and Flutter for mobile, the algorithm / data-structure interview prep track, and the modern TypeScript / Bun / Rust adjacent material that working JavaScript developers increasingly encounter. Few independent instructors have maintained Stephen's breadth this consistently for this long.

The CourseFlix listing under this source carries over 25 Stephen Grider courses spanning that range. Material is paid; Stephen Grider courses are typically sold individually on Udemy. Courses are aimed primarily at developers picking up a specific technology through working through a complete project.

Udemy

Udemy thumbnail

Udemy is the largest open marketplace for online courses on the internet. Founded in 2010 by Eren Bali, Oktay Caglar, and Gagan Biyani and headquartered in San Francisco, the company went public on the Nasdaq in 2021 under the ticker UDMY. The platform hosts well over two hundred thousand courses across software development, IT and cloud, data science, design, business, marketing, and creative skills, taught by tens of thousands of independent instructors. Roughly seventy million learners use it worldwide, and the corporate arm — Udemy Business — supplies a curated subset of that catalog to enterprise customers.

Because Udemy is a marketplace rather than a single editorial publisher, the catalog is uneven by design. The strongest material lives in the long-form, project-based courses authored by working engineers — full-stack JavaScript, React, Node.js, Python data science, AWS, Docker and Kubernetes, mobile development with Flutter and React Native, and cloud certification preparation. The CourseFlix listing under this source is the slice of that catalog that has been mirrored here for offline-friendly viewing, organized by topic and updated as new releases land. Pricing on Udemy itself swings dramatically with the site's near-permanent sales, which is why the platform is best treated as a deep reference catalog: pick instructors with strong reviews and a track record of updating their material rather than buying on the headline price alone.

Watch Online 145 lessons

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 145 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Introduction - Start Here!
All Course Lessons (145)
#Lesson TitleDurationAccess
1
Introduction - Start Here! Demo
01:44
2
Creating React Native Apps
02:24
3
Why Expo?
06:45
4
Creating Our First App
04:14
5
Animation Systems
06:17
6
The Animation Module
09:48
7
Animation from Square One
08:15
8
Moving a Ball
05:24
9
How Animations Work
09:37
10
Animation from Another Angle
08:48
11
Swipe Deck Props
04:18
12
Component Boilerplate
03:52
13
Interplay Between Components
07:35
14
Customizing Individual Cards
13:52
15
The Pan Responder System
10:24
16
Pan Responder's Event Handlers
08:48
17
The Gesture Object
09:55
18
Dragging a Card
11:29
19
Animating Single Cards
04:39
20
How to Rotate Elements
07:00
21
Interpolating Rotation Values
06:15
22
Linear Relations with Interpolation
05:34
23
Limiting Rotation with Interpolation
05:34
24
Springing Back to Default
05:11
25
Detecting Minimum Swipe Distance
07:23
26
Programmatic Animation
08:42
27
Forcing Swipes
04:12
28
Callbacks on Swipe Completion
06:26
29
Writing Reusable Components
04:50
30
The DefaultProps System
04:21
31
Resetting Card Position
06:04
32
Advancing the Deck
06:11
33
Handling Empty Lists
06:50
34
Getting the Cards to Stack
08:32
35
Troubleshooting Flashing Images
03:10
36
Cascading Card List
05:35
37
Animating Advancing Cards
04:23
38
Resetting the Index
05:16
39
Deck Wrapup
03:40
40
Review of Common Auth Flows
08:21
41
The Details of One Time Passwords
10:05
42
Tech Stack with Google Cloud Functions
08:27
43
Traditional Servers vs Google Cloud Functions
08:22
44
Layout of Google Cloud Functions
09:50
45
Firebase Project Setup
07:22
46
Deploying a Firebase Project
04:36
47
Testing Deployed Functions
07:43
48
Project File Structure
05:49
49
The Request and Response Objects
10:50
50
Generating a Service Account
05:49
51
Sanitizing User Inputs
08:55
52
Creating New Users
06:23
53
Testing New User Creation
05:24
54
Texting from Twilio
06:30
55
Twilio Credentials
07:04
56
Accessing Saved Users
06:11
57
Sending Texts to Users
08:46
58
Generating Access Codes
09:06
59
Verifying One Time Passwords
08:01
60
Invalidating Used Codes
07:53
61
Generating JWT's
04:32
62
Transitioning to React Native
02:54
63
App Boilerplate
06:58
64
Defining Instance Properties
08:10
65
Invoking Cloud Functions
06:58
66
Refactoring with Async/Await
09:08
67
Debugging with Async/Await
04:34
68
Async/Await on User Signin
06:00
69
Capturing Tokens
03:53
70
Firebase Auth with a JWT
05:59
71
Breather and Review
07:24
72
App Overview
05:40
73
Screen Walkthrough
06:24
74
More Screen Walkthroughs
06:42
75
App Challenges and Solutions
05:11
76
Screens vs Components
03:13
77
React Native Navigation Options
09:22
78
React Navigation in Practice
10:25
79
Screen Boilerplate
07:06
80
Implementing the First Navigator
07:14
81
Nesting Navigators
07:12
82
Wiring Up Stack Navigators
03:16
83
Class vs Instance Properties
05:41
84
Customization with Header Options
04:44
85
Programmatic Navigation
06:42
86
Styling the NavBar
05:13
87
The Welcome Screen
06:12
88
Styling the Welcome Screen
07:41
89
Even More Welcome Screen Styling!
08:40
90
Navigation from the Welcome Screen
04:58
91
More on Welcome Screen Navigation
10:02
92
Facebook Auth Flow
05:32
93
The Facebook Dev Console
05:51
94
Redux Setup
13:02
95
Using Async Storage
10:07
96
Crazy Async/Await Syntax
13:01
97
Logging in With Facebook
17:47
98
Testing Facebook's Login Flow
10:38
99
World's Biggest Gotcha
09:14
100
The Auth Reducer
05:47
101
Skipping the Auth Screen
08:50
102
Testing Auth Flow
03:52
103
Advancing the Welcome Screen
11:37
104
Resolving the Loading Screen
03:02
105
Showing a Map
05:26
106
Interacting with the MapView
07:24
107
Working around MapView Issues
04:44
108
The Indeed Jobs API
08:56
109
Location API Mismatch
08:59
110
Converting LatLong to Zip Code
10:32
111
Fetching a List of Jobs
07:43
112
Issuing Action Creators from MapScreen
10:05
113
The Jobs Reducer
08:45
114
Navigating from Action Creators
05:30
115
The Deck Screen
03:58
116
Importing the Deck Component
04:25
117
Applying the Swipe Component
06:11
118
Styling Job Cards
08:39
119
Customizing MapViews
10:30
120
Android Compatibility
07:08
121
Dynamic Key Props
04:43
122
One More Swipe Deck Fix
02:09
123
Liking a Job
03:30
124
Considering Only Unique Jobs
10:41
125
The Review Screen
03:21
126
Rendering a List of Liked Jobs
08:01
127
Applying to Jobs
08:20
128
Mapping a Jobs Location
08:26
129
Styling the Job Card
06:34
130
Clearing Liked Jobs
07:37
131
Redirecting Back to the Map
03:24
132
Callback Gotcha
03:27
133
Tab Bar Icons
05:31
134
Tab Bar Config
06:48
135
Android Specific Fixes
04:38
136
Push Notifications and Data Persistence
03:31
137
Persisting Application State
05:26
138
Wiring Up Redux Persist
03:30
139
How Redux Persist Works
06:58
140
Redux Persist - Huge Gotcha!
08:24
141
Push Notification Overview
05:51
142
Registering For Push Notifications
08:18
143
Generating Push Tokens
05:16
144
Testing Notifications
06:16
145
More on Notifications and Wrapup
04:51
Unlock unlimited learning

Get instant access to all 144 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Course content

145 lessons · 16h 35m 38s
Show all 145 lessons
  1. 1 Introduction - Start Here! 01:44
  2. 2 Creating React Native Apps 02:24
  3. 3 Why Expo? 06:45
  4. 4 Creating Our First App 04:14
  5. 5 Animation Systems 06:17
  6. 6 The Animation Module 09:48
  7. 7 Animation from Square One 08:15
  8. 8 Moving a Ball 05:24
  9. 9 How Animations Work 09:37
  10. 10 Animation from Another Angle 08:48
  11. 11 Swipe Deck Props 04:18
  12. 12 Component Boilerplate 03:52
  13. 13 Interplay Between Components 07:35
  14. 14 Customizing Individual Cards 13:52
  15. 15 The Pan Responder System 10:24
  16. 16 Pan Responder's Event Handlers 08:48
  17. 17 The Gesture Object 09:55
  18. 18 Dragging a Card 11:29
  19. 19 Animating Single Cards 04:39
  20. 20 How to Rotate Elements 07:00
  21. 21 Interpolating Rotation Values 06:15
  22. 22 Linear Relations with Interpolation 05:34
  23. 23 Limiting Rotation with Interpolation 05:34
  24. 24 Springing Back to Default 05:11
  25. 25 Detecting Minimum Swipe Distance 07:23
  26. 26 Programmatic Animation 08:42
  27. 27 Forcing Swipes 04:12
  28. 28 Callbacks on Swipe Completion 06:26
  29. 29 Writing Reusable Components 04:50
  30. 30 The DefaultProps System 04:21
  31. 31 Resetting Card Position 06:04
  32. 32 Advancing the Deck 06:11
  33. 33 Handling Empty Lists 06:50
  34. 34 Getting the Cards to Stack 08:32
  35. 35 Troubleshooting Flashing Images 03:10
  36. 36 Cascading Card List 05:35
  37. 37 Animating Advancing Cards 04:23
  38. 38 Resetting the Index 05:16
  39. 39 Deck Wrapup 03:40
  40. 40 Review of Common Auth Flows 08:21
  41. 41 The Details of One Time Passwords 10:05
  42. 42 Tech Stack with Google Cloud Functions 08:27
  43. 43 Traditional Servers vs Google Cloud Functions 08:22
  44. 44 Layout of Google Cloud Functions 09:50
  45. 45 Firebase Project Setup 07:22
  46. 46 Deploying a Firebase Project 04:36
  47. 47 Testing Deployed Functions 07:43
  48. 48 Project File Structure 05:49
  49. 49 The Request and Response Objects 10:50
  50. 50 Generating a Service Account 05:49
  51. 51 Sanitizing User Inputs 08:55
  52. 52 Creating New Users 06:23
  53. 53 Testing New User Creation 05:24
  54. 54 Texting from Twilio 06:30
  55. 55 Twilio Credentials 07:04
  56. 56 Accessing Saved Users 06:11
  57. 57 Sending Texts to Users 08:46
  58. 58 Generating Access Codes 09:06
  59. 59 Verifying One Time Passwords 08:01
  60. 60 Invalidating Used Codes 07:53
  61. 61 Generating JWT's 04:32
  62. 62 Transitioning to React Native 02:54
  63. 63 App Boilerplate 06:58
  64. 64 Defining Instance Properties 08:10
  65. 65 Invoking Cloud Functions 06:58
  66. 66 Refactoring with Async/Await 09:08
  67. 67 Debugging with Async/Await 04:34
  68. 68 Async/Await on User Signin 06:00
  69. 69 Capturing Tokens 03:53
  70. 70 Firebase Auth with a JWT 05:59
  71. 71 Breather and Review 07:24
  72. 72 App Overview 05:40
  73. 73 Screen Walkthrough 06:24
  74. 74 More Screen Walkthroughs 06:42
  75. 75 App Challenges and Solutions 05:11
  76. 76 Screens vs Components 03:13
  77. 77 React Native Navigation Options 09:22
  78. 78 React Navigation in Practice 10:25
  79. 79 Screen Boilerplate 07:06
  80. 80 Implementing the First Navigator 07:14
  81. 81 Nesting Navigators 07:12
  82. 82 Wiring Up Stack Navigators 03:16
  83. 83 Class vs Instance Properties 05:41
  84. 84 Customization with Header Options 04:44
  85. 85 Programmatic Navigation 06:42
  86. 86 Styling the NavBar 05:13
  87. 87 The Welcome Screen 06:12
  88. 88 Styling the Welcome Screen 07:41
  89. 89 Even More Welcome Screen Styling! 08:40
  90. 90 Navigation from the Welcome Screen 04:58
  91. 91 More on Welcome Screen Navigation 10:02
  92. 92 Facebook Auth Flow 05:32
  93. 93 The Facebook Dev Console 05:51
  94. 94 Redux Setup 13:02
  95. 95 Using Async Storage 10:07
  96. 96 Crazy Async/Await Syntax 13:01
  97. 97 Logging in With Facebook 17:47
  98. 98 Testing Facebook's Login Flow 10:38
  99. 99 World's Biggest Gotcha 09:14
  100. 100 The Auth Reducer 05:47
  101. 101 Skipping the Auth Screen 08:50
  102. 102 Testing Auth Flow 03:52
  103. 103 Advancing the Welcome Screen 11:37
  104. 104 Resolving the Loading Screen 03:02
  105. 105 Showing a Map 05:26
  106. 106 Interacting with the MapView 07:24
  107. 107 Working around MapView Issues 04:44
  108. 108 The Indeed Jobs API 08:56
  109. 109 Location API Mismatch 08:59
  110. 110 Converting LatLong to Zip Code 10:32
  111. 111 Fetching a List of Jobs 07:43
  112. 112 Issuing Action Creators from MapScreen 10:05
  113. 113 The Jobs Reducer 08:45
  114. 114 Navigating from Action Creators 05:30
  115. 115 The Deck Screen 03:58
  116. 116 Importing the Deck Component 04:25
  117. 117 Applying the Swipe Component 06:11
  118. 118 Styling Job Cards 08:39
  119. 119 Customizing MapViews 10:30
  120. 120 Android Compatibility 07:08
  121. 121 Dynamic Key Props 04:43
  122. 122 One More Swipe Deck Fix 02:09
  123. 123 Liking a Job 03:30
  124. 124 Considering Only Unique Jobs 10:41
  125. 125 The Review Screen 03:21
  126. 126 Rendering a List of Liked Jobs 08:01
  127. 127 Applying to Jobs 08:20
  128. 128 Mapping a Jobs Location 08:26
  129. 129 Styling the Job Card 06:34
  130. 130 Clearing Liked Jobs 07:37
  131. 131 Redirecting Back to the Map 03:24
  132. 132 Callback Gotcha 03:27
  133. 133 Tab Bar Icons 05:31
  134. 134 Tab Bar Config 06:48
  135. 135 Android Specific Fixes 04:38
  136. 136 Push Notifications and Data Persistence 03:31
  137. 137 Persisting Application State 05:26
  138. 138 Wiring Up Redux Persist 03:30
  139. 139 How Redux Persist Works 06:58
  140. 140 Redux Persist - Huge Gotcha! 08:24
  141. 141 Push Notification Overview 05:51
  142. 142 Registering For Push Notifications 08:18
  143. 143 Generating Push Tokens 05:16
  144. 144 Testing Notifications 06:16
  145. 145 More on Notifications and Wrapup 04:51

Related courses

Frequently asked questions

What is React Native: Advanced Concepts about?
Discover the advanced concepts of React Native through an engaging and practical learning experience. This course offers hands-on projects, where you'll build three different applications, each showcasing unique features of React Native…
Who teaches React Native: Advanced Concepts?
React Native: Advanced Concepts is taught by Stephen Grider, Udemy. You can find more courses by these instructors on the corresponding source pages.
How long is React Native: Advanced Concepts?
React Native: Advanced Concepts contains 145 lessons with a total runtime of 16 hours 35 minutes. All lessons are available to watch online at your own pace.
Is React Native: Advanced Concepts free to watch?
React Native: Advanced Concepts is part of CourseFlix's premium catalog. A CourseFlix subscription unlocks the full video player; the course description, table of contents, and preview information are available to everyone.
Where can I watch React Native: Advanced Concepts online?
React Native: Advanced Concepts is available to watch online on CourseFlix at https://courseflix.net/course/react-native-advanced-concepts. The page hosts every lesson with the integrated video player; no download is required.