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

Join premium to watch
Go to premium
# Title Duration
1 Welcome !! 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

Comments

0 comments

Want to join the conversation?

Sign in to comment

Similar courses

Make 20 React Apps

Make 20 React Apps

Sources: Chris Sev
Learn React best practices and concepts that you can use on the job, in side projects, and in any React app.
12 hours 20 minutes 3 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
React Hooks

React Hooks

Sources: ui.dev (ex. Tyler McGinnis)
If you never develop a convincing answer for both of those questions, you won’t have a solid enough foundation to build upon when you dive into the specifics. These questions ar...
3 hours 47 minutes 48 seconds
Zero to Full Stack Hero

Zero to Full Stack Hero

Sources: papareact.com
PAPA React presents.. Zero to Full Stack Hero. It's NOT just another COURSE. It's the world's BEST COMMUNITY. From learning the Basics of Web Development to Mastering React!
101 hours 29 minutes 59 seconds
Uber Eats Clone

Uber Eats Clone

Sources: Nomad Coders
Best Way to Learn to Code. We believe that the best way to become a developer is by doing clone coding. It is very easy to get bored and unmotivated in the begi
40 hours 22 minutes 44 seconds