Starting with React & Redux: Build modern apps (2nd edition)

30h 13m 51s
English
Paid

Course description

We will start from beginning to actually building a few applications.You will learn all the logic and practice behind React in different modules, and as we advance through  the course we will be increasing the difficulty.  Since I believe that the best way to fully learn is by coding, after each section we will put everything in practice with some course projects, and after you have a strong base of React we will journey into REDUX, the most beloved state manager.

Read more about the course

To sum everything up, you will learn in this course:

  • The very basics of React.How toy install and run it.How to create different types of components.
  • Learn the tools React provides, just like State and React Lifecycles to handle you application.
  • Work with events and use them in a real life scenario and the importance of props to handle the application
  • How to use React Router to navigate through pages and create transition with React Transition Group
  • How to do typechecking with React Proptypes
  • Learn how to use the Redux cycle properly and handle the information that flows in your entire application
  • We will learn the importance of middlewares.
  • Much more of course...

Watch Online

This is a demo lesson (10:00 remaining)

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

View Pricing
0:00
/
#1: Welcome !!

All Course Lessons (220)

#Lesson TitleDurationAccess
1
Welcome !! Demo
01:48
2
Project overview
04:05
3
IDE
01:13
4
Installing NODE and Using a CLI
11:58
5
The bundle
05:58
6
Starting with the code
09:07
7
JSX behind the scenes
09:10
8
Importing components
08:26
9
Types of components
05:31
10
Adding styles
10:20
11
Events
11:40
12
The STATE
15:05
13
Using Props
10:46
14
Using props 2
14:04
15
Props to class
06:02
16
Childrens
03:43
17
More with styles
06:59
18
Styles plugins
06:35
19
Filtering the news
15:04
20
Installing routes
05:38
21
How it works and creating components
07:21
22
Using routes
06:28
23
Linking
10:53
24
Working with params
06:50
25
Other features from react router
07:19
26
Switch
03:51
27
Redirections
06:55
28
404 and WITHROUTER
09:57
29
Getting ready
11:15
30
Adding header and banner
15:57
31
Bringing the HOME list
10:42
32
Creating the artist detailed view
18:42
33
Component lifecycles
07:22
34
Component lifecycles 2
19:27
35
Conditional rendering
10:24
36
Pure components
08:30
37
Adjacent elements
05:44
38
HOC''s
08:48
39
HOC''s Continued
13:37
40
Using transitions
17:29
41
Using transitions 2
08:56
42
Transitions group
11:51
43
CSS Transitions
15:44
44
Proptypes
10:23
45
Proptypes 2
08:28
46
Controlled components
07:59
47
installation and setup
08:49
48
Routes, Footer and header
09:30
49
Adding a slider
20:05
50
Adding subs
19:36
51
Adding subs...continued
10:08
52
Home blocks
13:26
53
Adding a poll
14:59
54
Finishing the poll
06:13
55
Adding the teams section
14:43
56
Finishing the teams section
08:55
57
Creating the team view
13:27
58
Redux introduction
08:37
59
Creating a Store
07:54
60
The redux flow
05:56
61
Combining reducers
06:35
62
Creating a valid reducer
07:32
63
Creating an action
04:44
64
MapStateToProps and connect
12:44
65
MapDispatchToProps
05:48
66
Types
07:58
67
Using middleware
07:45
68
Installations
06:59
69
Adding Redux
14:10
70
Getting home data
16:46
71
Latest news component
07:06
72
Other news section
08:57
73
Articles page
16:06
74
Adding likes component
12:33
75
Finishing the likes
08:59
76
Clearing data
04:46
77
Introduction to hooks
01:50
78
UseState
13:54
79
UseState 2
13:51
80
UseEffect
16:43
81
UseReducer
12:28
82
Preparing the app for the context
10:00
83
Context and UseContext
15:30
84
Introduction
01:37
85
Windows Users: Installing Node JS
08:04
86
Mac Users: Install Node JS
01:54
87
Runing the Boilerplate: Create React App
05:01
88
Bundle
03:08
89
Getting Started
03:24
90
Imports and render
05:46
91
Project structure
03:42
92
Exporting components
07:08
93
Type of components
06:25
94
Adding some Style
08:16
95
Synthetic Events
09:21
96
ES6 Constructor
08:18
97
Using React State
04:07
98
Changing State
04:33
99
Changing State 2
04:57
100
Working with Props
05:50
101
Working with Props 2
05:33
102
Working with Props 3
07:48
103
Working with Props 4
07:54
104
Filter the news
07:52
105
Filter the news 2
06:49
106
Conclusions
02:17
107
Introduction to React Router
04:17
108
Router Process
02:40
109
Setting up Routes
07:05
110
Using Routes
06:20
111
Linking
03:50
112
Params
08:20
113
More on React Router
09:18
114
Setup and installation
05:48
115
Creating the Routes
07:26
116
Adding a banner
12:23
117
Fetching the list
10:09
118
Showing the list
10:52
119
Styling the list
03:57
120
Creating the detail
10:48
121
Showing the bio
05:45
122
Styling the bio
05:11
123
Album List
10:37
124
Component Lifecycles
09:16
125
Component Lifecycles 2
06:58
126
Component Lifecycles 3
04:07
127
Transitions
04:23
128
Transition enter
07:51
129
Transition leave and appear
06:44
130
Transition from variables
06:53
131
Transition imports
09:24
132
Proptypes intro
02:43
133
Using Proptypes
06:30
134
More on Proptypes
09:27
135
Using Refs
05:27
136
Controlled Components
06:15
137
Uncontrolled Component
05:11
138
INTRO
03:51
139
Installation
06:56
140
Setting up Routes
07:58
141
Adding header and footer
03:17
142
Styling header and footer
09:23
143
Slider
09:14
144
Slider 2
09:58
145
Slider styles
04:36
146
Subscribe component
13:58
147
Saving subscribers
05:53
148
Handling errors
12:21
149
Styling subscribers
04:10
150
Home blocks
10:35
151
Showing the blocks
04:55
152
Styling the blocks
12:45
153
Creating the poll
12:13
154
Creating the poll 2
08:32
155
Adding Hits
06:54
156
Styling the poll
03:59
157
Getting the Teams
11:12
158
Adding effects to the teams
08:14
159
Filtering teams
12:58
160
Styling teams
05:38
161
Rendering team details
10:54
162
Rendering team details 2
04:47
163
Styling the detail
08:50
164
Intro to Redux
02:45
165
Connecting Redux
08:39
166
Action creators and Reducers
04:13
167
Reducers
05:25
168
Reducers 2
08:16
169
Action creators
04:59
170
Connecting
13:54
171
Containers
04:31
172
Setting up
05:58
173
Creating components
13:19
174
Creating search
06:04
175
Setting up Redux
05:20
176
Binding actions
11:26
177
Requests and Middleware
10:37
178
Redux promise
04:58
179
Adding the reducer
02:48
180
Showing results
11:43
181
Creating the list
08:32
182
Creating the detail
09:23
183
Adding reducers
07:28
184
Fixing state
05:41
185
Fixing state 2
03:20
186
Car detail view
08:40
187
Clearing state
06:00
188
Installing
05:33
189
Setting up redux
04:38
190
Setting up routes
03:54
191
Header and Footer
03:56
192
Header and Footer Styles
06:10
193
Home - Latest News
09:45
194
Home - Latest news - Store Data
10:47
195
Home - Latest News - JSX
06:43
196
Home -Latest News - Style
06:03
197
Home - Fetching other news
09:06
198
Home - Rendering other news
08:02
199
Home - Styling other news
10:22
200
Home - Fetching Gallery
09:07
201
Home - Render Gallery JSX
08:58
202
Home - Styling Gallery
04:09
203
News - Fetching article
14:47
204
News - Render Article JSX
07:58
205
News - Styling article
06:48
206
Gallery - Fetching data
10:17
207
Gallery - Render JSX
11:00
208
Gallery - Adding styles
04:04
209
Likes & Dislikes widget
09:44
210
Likes & Dislikes widget 2
05:28
211
Likes & Dislikes widget 3
10:12
212
Likes & Dislikes widget 4
02:35
213
Likes & Dislikes - Styles
05:33
214
Using and Index for types - convention
10:04
215
Intro and setup
08:08
216
Adding form elements
06:53
217
Validation
08:13
218
Validation 2
05:30
219
Submitting Form
08:46
220
Form on success
06:53

Unlock unlimited learning

Get instant access to all 219 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

React Query: Server State Management in React

React Query: Server State Management in React

Sources: udemy
React Query has become the go-to solution for server state management in React apps, and for good reason! This smart, comprehensive solution makes it easy to ke
7 hours 39 minutes 49 seconds
React and Django: A Practical Guide with Docker

React and Django: A Practical Guide with Docker

Sources: udemy
Learn how to create an Admin App using React and Django Rest Framework. Django 3.1, React Typescript, Redux, Docker, Authentication and Authorisation, Upload Im
6 hours 50 minutes 20 seconds
Next.js - The Full Course

Next.js - The Full Course

Sources: fireship.io
Next.js - The Full Course provides a in-depth look into the Next.js App Router introduced in version 13.2. It puts React Server Components into practice by buil
1 hour 14 minutes 14 seconds
Full Stack HATEOAS: Spring Boot 2.1, ReactJS, Redux

Full Stack HATEOAS: Spring Boot 2.1, ReactJS, Redux

Sources: udemy
Full Stack introduction to HATEOAS. In this course, you will learn the core concepts of HATEOAS as well as how to leverage this on a ReactJS Application. HATEOAS stands for: Hyp...
5 hours 51 minutes 37 seconds
Build a Notion Clone with React and TypeScript

Build a Notion Clone with React and TypeScript

Sources: zerotomastery.io
Master React and TypeScript by building a Notion clone. Learn to use Vite for project setup and Supabase for database management. Showcase your skills with a
7 hours 57 minutes 47 seconds