Урок 1. 00:02:59
Introduction
Урок 2. 00:04:13
What is React?
Урок 3. 00:00:40
Companies that use React
Урок 4. 00:01:42
Environmeny Setup
Урок 5. 00:01:20
Vscode setup
Урок 6. 00:02:59
JavaScript Refersher - Introduction
Урок 7. 00:10:15
Variables - var, let and const
Урок 8. 00:09:09
Arrow functions
Урок 9. 00:06:57
Ternary operator
Урок 10. 00:05:52
Map and Filter
Урок 11. 00:08:10
Spread and Rest operator
Урок 12. 00:06:27
Destructuring
Урок 13. 00:01:07
ES6 Classes - Part 1
Урок 14. 00:06:40
ES6 Classes - Part 2
Урок 15. 00:16:29
Modules - Import and Exports
Урок 16. 00:04:00
Modules - Default Exports
Урок 17. 00:04:54
Create a React app
Урок 18. 00:06:55
Files and Folder Overview
Урок 19. 00:07:25
Hello World App
Урок 20. 00:03:12
Files Clean Up
Урок 21. 00:05:09
Components
Урок 22. 00:02:48
Shortcut For Creating a Component
Урок 23. 00:03:19
Creating a Custom Component
Урок 24. 00:02:46
Create a Custom Component - 2
Урок 25. 00:10:10
JSX
Урок 26. 00:05:48
Outputting Dynamic Values
Урок 27. 00:09:37
Styling in React
Урок 28. 00:10:28
Scoping CSS Files
Урок 29. 00:04:45
Styling Summary
Урок 30. 00:07:59
Props
Урок 31. 00:03:28
Setting Default Props
Урок 32. 00:01:57
Props Destructuring
Урок 33. 00:08:24
Children Props
Урок 34. 00:14:55
Rendering a List
Урок 35. 00:10:52
Handling Events
Урок 36. 00:02:49
Profile App - Intro
Урок 37. 00:06:22
Instructions
Урок 38. 00:02:27
Profile App 1 - Create React App
Урок 39. 00:10:57
Profile App 2 - Create Files And Folder
Урок 40. 00:06:29
Profile App 3 - Installing React Icons
Урок 41. 00:01:19
Profile App 4 - Global Styles
Урок 42. 00:07:20
Profile App 5 - Profile List Jsx And Css
Урок 43. 00:08:58
Profile App 6 - Profile JSX
Урок 44. 00:12:03
Profile App 6 - Profile Css
Урок 45. 00:03:58
Profile App 7 - Add React Icon Context
Урок 46. 00:04:17
Profile App 8 - Card Component
Урок 47. 00:07:08
Profile App 9 - Create Pofiles Props
Урок 48. 00:10:00
Profile App 10 - Mapping Through Profiles
Урок 49. 00:01:32
What Are Hooks
Урок 50. 00:05:52
What Is State
Урок 51. 00:04:30
Hooks Folder Setup
Урок 52. 00:05:31
Css Utility Classes Overview
Урок 53. 00:07:09
Usestate - Comparative Programming 1
Урок 54. 00:13:50
Usestate - Comparative Programming 2
Урок 55. 00:07:34
Virtual Dom Vs Real Dom
Урок 56. 00:09:17
Counter App JS - Comparative Programming 1
Урок 57. 00:09:06
54 Counter App Usestate - Comparative Programming 2
Урок 58. 00:07:51
Counter App - State Updater Function
Урок 59. 00:05:51
Counter App Usestate - When Not To Use Usestate
Урок 60. 00:15:53
Usestate In Array 1
Урок 61. 00:05:30
Usestate In Array 2
Урок 62. 00:09:44
Usestate In Object
Урок 63. 00:01:55
Conditionals Intro
Урок 64. 00:05:51
Conditionals - If Else Statement
Урок 65. 00:04:40
Conditionals - Logical And Operator
Урок 66. 00:03:46
Conditionals - Ternary Operator
Урок 67. 00:09:09
Conditionals - Adding Css Classes Conditionally
Урок 68. 00:10:18
Conditionals - Conditionals With Props
Урок 69. 00:06:58
General project setup
Урок 70. 00:01:20
User Profile App - Demo
Урок 71. 00:10:03
User Profile App - JSX
Урок 72. 00:05:21
User Profile App - CSS
Урок 73. 00:08:37
User Profile App - Logic 1
Урок 74. 00:06:39
User Profile App - Logic 2
Урок 75. 00:01:20
Animated Login Form - Demo
Урок 76. 00:12:05
Animated Login Form - JSX
Урок 77. 00:10:15
Animated Login Form - CSS
Урок 78. 00:05:29
Animated Login Form - Register Component
Урок 79. 00:12:39
Animated Login Form - Reset Component
Урок 80. 00:16:28
Animated Login Form - Logic
Урок 81. 00:05:47
Animated Login Form - Refactoring Logic
Урок 82. 00:01:45
UseEffect Hook - Intro
Урок 83. 00:11:49
UseEffect Hook - Basics
Урок 84. 00:12:13
UseEffect Hook - Cleanup
Урок 85. 00:01:19
Jokes Generator - Demo
Урок 86. 00:04:32
Jokes Generator - JSX
Урок 87. 00:13:35
Jokes Generator - Logic
Урок 88. 00:05:09
Jokes Generator - Fetch Joke On Button Click
Урок 89. 00:00:32
Github User List - Demo
Урок 90. 00:05:42
Github User List - JSX
Урок 91. 00:09:50
Github User List - Fetch Users
Урок 92. 00:05:45
Github User List - Loading State
Урок 93. 00:08:46
Github User List - Handling Errors
Урок 94. 00:01:23
Forms - Intro
Урок 95. 00:06:29
Forms - JSX
Урок 96. 00:10:48
Forms - Controlled Inputs
Урок 97. 00:16:39
Forms - Multiple Controlled Inputs
Урок 98. 00:12:37
Forms - Uncontrolled Inputs
Урок 99. 00:04:47
Password Visibility Toggle & Strength Indicator Demo
Урок 100. 00:05:53
Password Visibility Toggle - JSX
Урок 101. 00:05:53
Password Visibility Toggle - Logic
Урок 102. 00:07:24
Password Strength Indicator - JSX
Урок 103. 00:03:28
Password Strength Indicator - CSS
Урок 104. 00:05:53
Password Strength Indicator - Logic - Show/Hide Indicator
Урок 105. 00:03:44
Password Strength Indicator - Logic - Get Password Input
Урок 106. 00:11:38
Password Strength Indicator - Logic - Set Letter Criterion
Урок 107. 00:09:57
Password Strength Indicator - Logic - Set Number Character And Length Criteria
Урок 108. 00:16:01
Password Strength Indicator - Logic - Disable Enable Button
Урок 109. 00:14:46
Password Strength Indicator - Logic - Lifting The State Up
Урок 110. 00:01:48
Product Filter - Demo
Урок 111. 00:09:12
Product Filter - Product List Component JSX
Урок 112. 00:08:10
Product Filter - Product List Component CSS
Урок 113. 00:01:29
Product Filter - Search Component JSX
Урок 114. 00:02:10
Product Filter - Categories Component JSX & CSS
Урок 115. 00:08:06
Product Filter - Product Component JSX
Урок 116. 00:05:35
Product Filter - Product Component CSS
Урок 117. 00:09:57
Product Filter - Logic - Display Products
Урок 118. 00:10:47
Product Filter - Logic - Add Search Filter
Урок 119. 00:03:20
Product Filter - Logic - No Product Found
Урок 120. 00:23:34
Product Filter - Logic - Add Category Filter
Урок 121. 00:01:18
Dark Mode Toggle - Demo
Урок 122. 00:07:32
Dark Mode Toggle - Set Color Scheme
Урок 123. 00:07:22
Dark Mode Toggle - Header Component JSX
Урок 124. 00:10:57
Dark Mode Toggle - Header Component CSS
Урок 125. 00:03:54
Dark Mode Toggle - Hero Component JSX
Урок 126. 00:07:27
Dark Mode Toggle - Hero Component CSS
Урок 127. 00:02:39
Dark Mode Toggle - Footer Component JSX & CSS
Урок 128. 00:12:11
Dark Mode Toggle - Logic - useLocalStorage Setup
Урок 129. 00:02:43
Dark Mode Toggle - Logic - Set Dark Mode On all Components
Урок 130. 00:11:07
Dark Mode Toggle - Logic - Handle switch button
Урок 131. 00:02:27
Pricing Section - Demo
Урок 132. 00:06:59
Pricing Section - SubList Component JSX
Урок 133. 00:07:54
Pricing Section - SubList Component CSS
Урок 134. 00:04:10
Pricing Section - Sub Component JSX
Урок 135. 00:09:37
Pricing Section - Sub Component CSS
Урок 136. 00:06:00
Pricing Section - Logic - Set Plan and Theme Prop
Урок 137. 00:10:14
Pricing Section - Logic - Set Price and Features Prop
Урок 138. 00:08:09
Pricing Section - Logic - Create Yearly Prop
Урок 139. 00:03:58
Pricing Section - Logic - Animate Toggle Button
Урок 140. 00:11:03
Pricing Section - Logic - Calculate Yearly Price with discount
Урок 141. 00:03:22
Pricing Section - Logic - Add buy prop
Урок 142. 00:05:14
useReducer - Setup
Урок 143. 00:13:09
useReducer - Intro
Урок 144. 00:11:54
useReducer - Add Functionality
Урок 145. 00:02:46
useReducer - Seperate reducer function into a file
Урок 146. 00:04:59
Task Manager - Demo
Урок 147. 00:10:09
Task Manager - Form JSX
Урок 148. 00:07:38
Task Manager - Single Task JSX
Урок 149. 00:04:55
Task Manager - Linking state to form input
Урок 150. 00:02:44
Task Manager - Add Auto-focus on the name input field
Урок 151. 00:15:23
Task Manager - Handle Submit
Урок 152. 00:18:12
Task Manager - Edit Task 1
Урок 153. 00:01:35
Task Manager - Edit Task 2
Урок 154. 00:06:05
Task Manager - Delete Task
Урок 155. 00:05:40
Task Manager - Complete Task
Урок 156. 00:06:11
Task Manager - Save Tasks to Local Storage
Урок 157. 00:01:16
Task Manager Reducer - Demo
Урок 158. 00:04:15
Task Manager Reducer - Project Setup
Урок 159. 00:07:01
Task Manager Reducer - Alert JSX
Урок 160. 00:07:06
Task Manager Reducer - Confirm JSX
Урок 161. 00:11:47
Task Manager Reducer - useReducer setup
Урок 162. 00:06:29
Task Manager Reducer - Making the Alert dynamic
Урок 163. 00:05:56
Task Manager Reducer - Submit with empty fields
Урок 164. 00:06:25
Task Manager Reducer - Close Alert
Урок 165. 00:13:57
Task Manager Reducer - Add New Task
Урок 166. 00:12:12
Task Manager Reducer - Make Modal Dynamic
Урок 167. 00:08:52
Task Manager Reducer - Open Edit Modal
Урок 168. 00:09:56
Task Manager Reducer - Edit Task
Урок 169. 00:03:29
Task Manager Reducer - Close Edit Modal
Урок 170. 00:21:53
Task Manager Reducer - Update Task
Урок 171. 00:13:31
Task Manager Reducer - Open Delete Modal
Урок 172. 00:11:45
Task Manager Reducer - Delete Task
Урок 173. 00:17:42
Task Manager Reducer - Complete Task
Урок 174. 00:04:58
Task Manager Reducer - Export Reducer Function
Урок 175. 00:09:03
Props Drilling
Урок 176. 00:15:14
Replace Props Drilling With Context API
Урок 177. 00:02:35
Use Cases For Context API
Урок 178. 00:03:04
Dark Mode Toggle - Project Review
Урок 179. 00:05:13
Dark Mode Toggle - Context API 1
Урок 180. 00:09:12
Dark Mode Toggle - Context API 2
Урок 181. 00:10:09
Create a custom Theme Context Provider
Урок 182. 00:01:31
Custom Hook - Intro
Урок 183. 00:10:18
Custom Hook - useFetch Hook
Урок 184. 00:01:49
React Router - Demo
Урок 185. 00:04:33
React Router - Installation
Урок 186. 00:06:41
React Router - Setting Up Routes
Урок 187. 00:04:16
React Router - Linking our Routes
Урок 188. 00:03:30
React Router - 404 NotFound page
Урок 189. 00:06:33
React Router - Active Menu Class with NavLink
Урок 190. 00:05:49
React Router - Page Redirect
Урок 191. 00:05:26
React Router - Nested Routes
Урок 192. 00:10:24
React Router - useParams 1
Урок 193. 00:08:03
React Router - useParams 2
Урок 194. 00:06:38
Intro To Redux
Урок 195. 00:05:13
How Redux Works
Урок 196. 00:10:23
Install Redux, Create Store and Reducer
Урок 197. 00:02:14
Setup Redux Devtools
Урок 198. 00:02:46
Provide the store to your App component
Урок 199. 00:03:58
Select/access data from the store
Урок 200. 00:06:53
Dispatch Actions from the component
Урок 201. 00:05:14
Pass data to the Reducer via payload
Урок 202. 00:14:19
Create authReducer
Урок 203. 00:04:29
Conditionally display the counter
Урок 204. 00:03:34
Extract the Reducers into seperate files
Урок 205. 00:11:13
Extract the Actions into seperate files
Урок 206. 00:07:23
Defining Action Types
Урок 207. 00:04:40
Redux Toolkit Intro
Урок 208. 00:12:57
create counterSlice
Урок 209. 00:03:35
create authSlice
Урок 210. 00:04:56
Replace CreateStore With configureStore
Урок 211. 00:07:22
Update useSelector and dispatch
Урок 212. 00:12:03
1. React Ecommerce App - Demo
Урок 213. 00:02:26
2. Ecommerce App - Project Structure
Урок 214. 00:04:58
3. Eshop App - Project Setup
Урок 215. 00:04:37
4. Eshop App - Creating Folder
Урок 216. 00:07:24
5. Eshop App - Warning VS Error
Урок 217. 00:09:44
6. Eshop App - Creating main pages and components
Урок 218. 00:09:42
7. Eshop App - Routing setup
Урок 219. 00:05:59
8. Eshop App - Grouping our imports in a single file
Урок 220. 00:09:40
9. Eshop App - Header Component - logo
Урок 221. 00:12:04
10. Eshop App - Header Component - Nav
Урок 222. 00:22:49
11. Eshop App - Header Component - Responsive menu
Урок 223. 00:08:53
12. Eshop App - Header Component - Set Active Menu Link
Урок 224. 00:03:26
13. Eshop App - Footer Component
Урок 225. 00:07:05
14. Eshop App - Auth components and Routes
Урок 226. 00:16:08
15. Eshop App - Login Page JSX
Урок 227. 00:05:35
16. Eshop App - Card Component
Урок 228. 00:06:54
17. Eshop App - Register Page JSX
Урок 229. 00:06:13
18. Eshop App - Reset Page JSX
Урок 230. 00:08:35
19. Eshop App - Firebase Setup
Урок 231. 00:08:56
20. Eshop App - Loader Component
Урок 232. 00:11:04
21. Eshop App - Regiser User - part 1
Урок 233. 00:18:52
22. Eshop App - Regiser User - part 2
Урок 234. 00:11:58
23. Eshop App - Sign in with Email and Password
Урок 235. 00:08:46
24. Eshop App - Logout
Урок 236. 00:08:48
25. Eshop App - Sign in with Google
Урок 237. 00:09:29
26. Eshop App - Reset Password Logic
Урок 238. 00:09:51
27. Eshop App - Monitor Authentication State
Урок 239. 00:05:40
28. Eshop App - Redux Store setup
Урок 240. 00:25:09
29. Eshop App - Set Active User in Redux - Part 1
Урок 241. 00:09:53
30. Eshop App - Set Active User in Redux - Part 2
Урок 242. 00:05:17
30b. Eshop App - Update on username
Урок 243. 00:09:50
31. Eshop App - Remove Active User in Redux
Урок 244. 00:14:32
32. Eshop App - Show or Hide Links based on auth state
Урок 245. 00:17:57
33. Eshop App - Image Slider JSX
Урок 246. 00:10:16
34. Eshop App - Image Slider Logic
Урок 247. 00:07:16
35. Eshop App - Image Slider Logic - Autoslide effect
Урок 248. 00:05:20
36. Eshop App - Image Slider - Webpack warning
Урок 249. 00:13:07
37. Eshop App - Admin Only Route
Урок 250. 00:06:18
38. Eshop App - Create Admin Section Components
Урок 251. 00:16:34
39. Eshop App - Create Admin Nested Routes
Урок 252. 00:08:02
40. Eshop App - Create Fallback content for Non-Admin
Урок 253. 00:12:10
41. Eshop App - Create Admin Navbar
Урок 254. 00:23:52
42. Eshop App - Add Product component JSX
Урок 255. 00:05:51
43. Eshop App - Handle form input
Урок 256. 00:16:49
44. Eshop App - Upload Image to Firebase Storage
Урок 257. 00:02:39
44.B Update firebase rules
Урок 258. 00:15:07
45. Eshop App - Display upload progress and get image url
Урок 259. 00:22:16
45.B - Eshop App - Upload Product to Firebase
Урок 260. 00:02:45
46. Eshop App - Upload your products
Урок 261. 00:16:02
47. Eshop App - Get products from firestore
Урок 262. 00:15:56
48. Eshop App - Display products on the page
Урок 263. 00:13:13
49. Eshop App - Delete Product
Урок 264. 00:10:24
50. Eshop App - Confirm Dialog Box before Delete Product
Урок 265. 00:12:33
51. Eshop App - Save Products to Redux Store
Урок 266. 00:08:05
52. Eshop App - useParams to add and Edit Product
Урок 267. 00:23:07
53. Eshop App - detectForm based on params
Урок 268. 00:15:54
54. Eshop App - Edit Product
Урок 269. 00:01:55
55. Back to the Home Page
Урок 270. 00:07:02
56. Eshop App - Create Product Component and Sub-components
Урок 271. 00:07:15
57. Eshop App - Product Component Layout
Урок 272. 00:13:09
58. Eshop App - useFetchCollection hook
Урок 273. 00:11:50
59. Eshop App - Testing useFetchCollection hook on Admin page
Урок 274. 00:03:33
60. Eshop App - Fetch products in products Component
Урок 275. 00:14:30
61. Eshop App - ProductList Component - Part 1
Урок 276. 00:03:55
62. Eshop App - getDefault Middleware issues
Урок 277. 00:07:12
63. Eshop App - Search Component
Урок 278. 00:09:27
64. Eshop App - ProductList Component - Part 2
Урок 279. 00:18:21
65. Eshop App - Product Item Component
Урок 280. 00:05:10
66. Eshop App - Show Loading spinner when fetching products
Урок 281. 00:13:42
67. Eshop App - Fetch Single Product
Урок 282. 00:15:04
68. Eshop App - Display Product on Product Details Page
Урок 283. 00:08:42
69. Eshop App - Back To Product Button
Урок 284. 00:06:50
70. Eshop App - Product Filter JSX
Урок 285. 00:22:50
71. Eshop App - Filter Products by Search
Урок 286. 00:16:01
72. Eshop App - Sort Products
Урок 287. 00:21:35
73. Eshop App - Filter Products by Category
Урок 288. 00:09:19
74. Eshop App - Filter Products by Brand
Урок 289. 00:20:22
75. Eshop App - Filter Products by Price
Урок 290. 00:02:28
76. Eshop App - Clear all filter
Урок 291. 00:08:03
77. Eshop App - Make the Product Filter Responsive
Урок 292. 00:10:53
78. Eshop App - Pagination Component - Part 1
Урок 293. 00:31:09
79. Eshop App - Pagination Component - Part 2
Урок 294. 00:09:22
80. Eshop App - Redux cartSlice setup
Урок 295. 00:19:25
81. Eshop App - Add Product To Cart
Урок 296. 00:30:30
82. Eshop App - Cart Component JSX
Урок 297. 00:16:35
83. Eshop App - Decrease product in the cart
Урок 298. 00:06:40
84. Eshop App - Remove product from the cart
Урок 299. 00:04:47
85. Eshop App - Clear Cart
Урок 300. 00:12:19
86. Eshop App - Calculate Subtotal
Урок 301. 00:05:20
87. Eshop App - Calculate Cart Total Quantity
Урок 302. 00:16:38
88. Eshop App - Update Cart in Product Details Page
Урок 303. 00:13:07
89. Eshop App - Make the header sticky and Update Cart in the Header
Урок 304. 00:21:59
90. Eshop App - Redirect User on Checkout
Урок 305. 00:05:45
91. Eshop App - Create the Checkout Components
Урок 306. 00:21:21
92. Eshop App - Create the Checkout Details Page - Part 1
Урок 307. 00:09:07
93. Eshop App - Create the Checkout Details Page - Part 2
Урок 308. 00:11:39
94. Eshop App - Setup Checkout Slice in redux
Урок 309. 00:19:27
95. Eshop App - Create Checkout Summary
Урок 310. 00:03:31
96 Eshop App Create Stripe Test Account
Урок 311. 00:05:08
97. Eshop App - Install Packages For Payment
Урок 312. 00:09:28
98. Eshop App - Create Checkoutform Serverjs And Env File
Урок 313. 00:13:09
99. Eshop App - Setting Up Serverjs
Урок 314. 00:30:50
100. Eshop App - Checkout From The Frontend
Урок 315. 00:12:45
101. Eshop App - Checkout from the backend
Урок 316. 00:14:44
102. Eshop App - Checkout Form Component
Урок 317. 00:24:10
103. Eshop App - Handle Submit on Checkout Form
Урок 318. 00:02:52
104. Eshop App - Checkout Success Page
Урок 319. 00:22:49
105. Eshop App - Save Order to Firebase
Урок 320. 00:13:47
106. Eshop App - OrderHistory Component - Get Orders from Firebase
Урок 321. 00:24:53
107. Eshop App - OrderHistory Component - Display orders on the page
Урок 322. 00:05:22
108. Eshop App - OrderHistory Component - Filter orders by userID
Урок 323. 00:13:23
109. Eshop App useFetchDocument Custom Hook
Урок 324. 00:20:12
110. Eshop App get Order Details
Урок 325. 00:17:14
111. Eshop App Review Product Component
Урок 326. 00:15:41
112. Eshop App - Save review to firebase
Урок 327. 00:16:30
113. Eshop App - Display reviews under product
Урок 328. 00:07:08
114. Eshop App - Back to Admin section - Home Component
Урок 329. 00:11:53
115. Eshop App - InfoBox Component
Урок 330. 00:21:19
116. Eshop App - InfoBox Component Logic
Урок 331. 00:19:34
117. Eshop App - View all orders on Admin dashboard
Урок 332. 00:12:05
118. Eshop App - View order details on Admin dashboard
Урок 333. 00:11:05
119. Eshop App - ChangeOrderStatus Component JSX
Урок 334. 00:15:54
120. Eshop App - ChangeOrderStatus Component Logic
Урок 335. 00:15:48
121. Eshop App - Order status chart - Part 1
Урок 336. 00:11:06
122. Eshop App - Order status chart - Part 2
Урок 337. 00:09:11
123. Eshop App - Add search Filter to admin
Урок 338. 00:04:22
124. Eshop App - Add Pagination to admin
Урок 339. 00:12:40
125. Eshop App - Contact us JSX
Урок 340. 00:14:36
126. Eshop App - Contact us Logic
Урок 341. 00:06:16
127. Eshop App - 404 Not Found page
Урок 342. 00:09:49
128. Eshop App - Testing the App
Урок 343. 00:06:41
129. Eshop App - Cleaning our code with the help of ESLINT
Урок 344. 00:04:21
130. Eshop App - Hide Api keys in .env file
Урок 345. 00:09:00
131. Eshop App - Firebase security rules for production
Урок 346. 00:06:02
132. Eshop App - Push project to Github
Урок 347. 00:08:26
133. Eshop App Setup Heroku
Урок 348. 00:08:58
134. Eshop App - Preparing project for deployment
Урок 349. 00:15:37
135. Eshop App - Deploy app to Heroku
Урок 350. 00:03:13
136. Eshop App - Testing the App