React Native: Mobile App Development (CLI) [2024]

19h 38m 59s
English
Paid

Course description

Unlock the power of React Native and build impressive iOS and Android apps with this comprehensive course. Whether you're a beginner or an experienced developer, this course is designed to equip you with the skills and knowledge needed to create robust mobile applications using React Native.

In the "Getting Started" section, you'll dive into the fundamentals, exploring React Native's core concepts, understanding the difference between React Native CLI and Expo, and setting up your local development environment for both iOS and Android. You'll also get acquainted with important tools like code editors, ESLint, and Prettier.

Once you have a solid foundation, you'll move on to the essentials of React and React Native. Learn about components, stylesheets, props, event handling, and how to create basic UI elements such as buttons, text inputs, and icons. Take a deep dive into React Hooks and gain a solid understanding of useState, useEffect, useRef, useContext, and creating custom hooks.

To create visually appealing and responsive interfaces, the course covers styling techniques with borders, margins, paddings, and flexbox. You'll also explore advanced topics such as debugging, data management with Redux Toolkit, user authentication, building APIs with NodeJS and Express, integrating payment systems using Stripe, and deploying your applications to app stores.

With hands-on assignments and a practical project, you'll gain real-world experience as you apply your newfound knowledge. Whether you're looking to enhance your skills for career advancement or create your own mobile app, this course is the ultimate resource for mastering React Native in 2023.

Enroll now and join the learners who have already transformed their mobile app development skills with this comprehensive React Native course. Take the next step in your coding journey and unleash the potential of React Native today.

Watch Online

This is a demo lesson (10:00 remaining)

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

View Pricing

Watch Online React Native: Mobile App Development (CLI) [2024]

0:00
/
#1: Welcome to This Course & What to Expect

All Course Lessons (184)

#Lesson TitleDurationAccess
1
Welcome to This Course & What to Expect Demo
05:01
2
What is React Native?
02:31
3
React Native CLI vs Expo
05:09
4
(macOS) How to Setup Local Development Environment for iOS React Native Apps
19:36
5
(macOS) How to Setup Local Development Environment for Android React Native Apps
13:34
6
(Windows) How to Setup Local Development Environment for Android
22:08
7
Important - Please watch till the end
05:48
8
What is a Code Editor, ESLint & Prettier? (Optional)
07:14
9
What is JSX? (Optional)
04:28
10
Let's Create Hello World App!
05:41
11
Hello World App - Detailed Overview
02:43
12
Introduction
02:02
13
JavaScript Summary
01:37
14
Syntax Refresher
04:18
15
Let & Const Variables
01:29
16
Arrow Functions
02:29
17
Objects: Properties & Methods
01:41
18
Array & Array Methods
05:03
19
Arrays, Objects & Reference Types
02:29
20
Spread Operator & Rest Operators
04:09
21
Destructuring
04:04
22
Async, Await & Promises - Working with APIs
07:13
23
Summary
01:59
24
Introduction
01:07
25
Borders
05:27
26
Margins
03:34
27
Paddings
02:30
28
Position: Absolute & Relative & zIndex
06:27
29
Text Styles
04:17
30
Summary
01:47
31
Introduction
02:24
32
What is a Component?
04:21
33
What are Stylesheets?
06:43
34
View Component
04:50
35
What are Props & Prop Types
07:28
36
Event Handling
02:35
37
Summary
02:06
38
Introduction
01:47
39
What are React Hooks?
01:32
40
Getting Started with useState
04:17
41
Understanding useEffect
06:53
42
Working with refs and useRef
07:46
43
Working with useContext
11:54
44
Creating Custom Hooks
06:52
45
Summary
01:50
46
Introduction
01:59
47
What is a Class Based Component?
06:51
48
Working with State & Events
02:10
49
Component Lifecycle Methods in Action
03:59
50
Functional Components with Hooks VS Class Based Components with Lifecycle
16:29
51
Summary
01:02
52
Introduction
01:24
53
Image Component
07:41
54
Text Input Component
09:39
55
ScrollView Component
04:47
56
Button Component & Form Submission
07:46
57
Switch Component
04:15
58
Icons with FontAwesome
05:07
59
Deep Dive in Flexbox
13:19
60
Summary
01:34
61
What is Figma?
03:07
62
Figma Tutorial for our Upcoming Projects
08:05
63
Social Media Feed Application Introduction
02:16
64
Installing a New Application
05:05
65
How to Install Custom Fonts
12:49
66
Creating a Title Component
08:07
67
Installing FontAwesome Icons
19:11
68
What is a Flatlist?
01:48
69
Setting Up For Flatlist
03:30
70
Using Flatlist & User Stories
12:09
71
User Profile Image in Flatlist
06:29
72
Infinite Scroll
16:46
73
Setting Up for User Posts
03:46
74
Creating User Posts using Flatlist
23:34
75
Finishing Up Social Media App
10:23
76
Summary
01:37
77
Introduction to Debugging
00:56
78
Handling Errors
12:42
79
Logging to the Console
09:40
80
Documentation
01:52
81
Introduction
01:33
82
What is Dimensions API?
05:35
83
[BEST TAKEAWAY] Responsive Scaling for Fonts, Vertical and Horizontal Sizings
11:36
84
Using Scaling Functions
10:38
85
Writing Platform-Specific Code with the Platform API
08:41
86
Styling the Status Bar
03:28
87
Summary
01:52
88
Introduction
01:09
89
Setting Up Navigation System
04:12
90
Introduction to Stack Navigation
02:46
91
Creating & Using Stack Navigator
15:56
92
How to Navigate to a Different Screen
06:29
93
Creating Main Menu with Drawer Navigator
08:40
94
Getting Started with Profile UI
14:58
95
How to Create Tab Navigation on a Single Screen
07:11
96
How to Style Tab Labels
11:31
97
Creating Components for Our Tab Contents
08:34
98
Summary
01:49
99
Introduction
02:10
100
Creating Project & Setting Up
02:24
101
Installing Custom Fonts
02:39
102
[Please Watch] Custom Fonts - Part 2
08:38
103
Installing React Native Navigation
04:08
104
Setting Up Navigation, Styles & Home Page
09:07
105
Donation App Architectural Plan Discussion
04:01
106
Creating Header Component
08:23
107
Creating Button Component
08:28
108
Creating Tab Component using useRef
09:10
109
Creating Badge Component using useRef
03:29
110
Installing Font Awesome Icons
02:33
111
Creating Search Input Component
13:22
112
Creating a Single Donation Item Component
07:35
113
Styling a Single Donation Item Component
04:35
114
Summary
01:08
115
Introduction
02:04
116
Redux vs Redux Toolkit
03:27
117
Installing Redux JS Toolkit
01:54
118
What is a Slice & How to Create One?
05:47
119
What is combineReducers?
03:01
120
Configuring Store
04:08
121
Actions in Redux Toolkit
02:23
122
Redux Logger
02:51
123
Persisting Store
07:04
124
Using User Reducer for Building Home Header
13:06
125
New Reducer for Categories
04:21
126
useSelector for Creating Categories Flatlist
09:41
127
Paginating through Categories Flatlist
09:56
128
Donation Items Reducer, Purging Persisted Store & Updating from Reducers
07:09
129
Filtering Donation Items According to Selected Category
04:44
130
Displaying Filtered Items on the Home Screen
08:05
131
Displaying Donation Items as a Grid
05:15
132
Using Donations Reducer to Setup Single Donation Screen
05:39
133
Explore Go Back Function from Navigation
08:28
134
Route Params & Single Donation Item Screen
12:31
135
Summary
01:43
136
Introduction
02:19
137
Input Component for Log In & Registration Screens
14:31
138
Log In Screen Creation
05:02
139
Registration Screen
04:38
140
What is Firebase
03:19
141
How Does Authentication Work ?
06:09
142
Firebase Setup
10:09
143
Firebase Authentication Setup
01:34
144
Creating Users using Firebase
04:49
145
Error & Success Handling
07:47
146
Logging Users in Using Firebase
07:17
147
Managing User Authentication State in the App
05:40
148
Navigation Flows (Authenticated, Non Authenticated)
02:47
149
Logging Out
03:30
150
Token Expiration using Firebase & AppState
09:38
151
Summary
02:00
152
Introduction
02:26
153
What is a Server?
02:37
154
What is API?
02:25
155
NodeJS, ExpressJS & Setting Up Server on Local Development Environment
08:48
156
Upgrading our Environment using Nodemon and Babel
06:24
157
What is Postman and How to Use It
03:24
158
Body Parser & Get, Post, Delete & Put Requests
09:26
159
Preparing Our Environment to Use Firebase Cloud Functions
05:34
160
Transferring Local Setup to Firebase And Testing with Postman
12:59
161
Summary
02:08
162
Introduction
02:02
163
What is Stripe?
01:39
164
Signing Up For Stripe
04:04
165
Setting Up Stripe Server Integration
17:16
166
Setting Up Payment Screen for Donation App
07:47
167
Installing Stripe in Donation App
07:29
168
Integrating Stripe Server Side Code in Donation App
17:16
169
Uploading Server Side Code to Firebase Functions
10:04
170
Summary
02:12
171
Introduction
02:21
172
Custom App Icons for iOS & Android
07:22
173
Custom Splash Screen for iOS & Android
11:46
174
(macOS) Apple Developer Account
05:47
175
Google Developer Account
03:12
176
(macOS) What is TestFlight?
06:45
177
Creating Github Account (Optional)
02:22
178
(macOS) What is Fastlane?
02:58
179
(macOS) How to Upload Applications to App Store
22:56
180
(macOS) Updating Firebase Project & Package Naming
06:18
181
(Windows) Updating Firebase Project & Package Naming
11:32
182
(macOS) How to Upload Applications to Google Play Store
32:09
183
(Windows) How to Upload Applications to Google Play Store
20:11
184
Summary
01:39

Unlock unlimited learning

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

Learn more about subscription

Comments

0 comments

Want to join the conversation?

Sign in to comment

Similar courses

Push Notifications with Expo

Push Notifications with Expo

Sources: Simon Grimm
Embrace the dynamic world of mobile notifications with our comprehensive course, “React Native Notifications with Expo.” Learn the art of crafting engaging...
58 minutes 22 seconds
Instagram Clone Coding 3.0

Instagram Clone Coding 3.0

Sources: Nomad Coders
nstagram: backend + frontend + application + server. NodeJS, Prisma, GraphQL, Hooks, React Native. You implement almost all Instagram features, including taking
20 hours 48 minutes 39 seconds
Expo Router Fullstack Apps

Expo Router Fullstack Apps

Sources: Simon Grimm
In this course, you will learn how to build fullstack apps with Expo Router v3 and React Native. We will dive into Expo Router and the file-based routing...
1 hour 39 minutes 18 seconds
Event System with Express API and Authentication

Event System with Express API and Authentication

Sources: Simon Grimm
Let's create a full-fledged event system with authentication using React Native and Express API. Together, we will go through all the stages of full-stack...
NativeBase UI & React Navigation

NativeBase UI & React Navigation

Sources: Simon Grimm
Unlock the world of cross-platform app development with our comprehensive course, “Building Cross Platform Apps with React Native.” Learn how to create high...
1 hour 44 minutes 26 seconds