Этот материал находится в платной подписке. Оформи премиум подписку и смотри или слушай Modern React with Redux [2023 Update], а также все другие курсы, прямо сейчас!
Купить сейчас
  • Урок 1. 00:01:02
    How to Get Help
  • Урок 2. 00:07:57
    Let's Build an App!
  • Урок 3. 00:05:50
    Critical Questions
  • Урок 4. 00:08:52
    A Few More Critical Questions
  • Урок 5. 00:01:59
    Node Setup
  • Урок 6. 00:02:39
    Creating a React Project
  • Урок 7. 00:05:51
    What is Create React App?
  • Урок 8. 00:06:42
    Showing Basic Content
  • Урок 9. 00:05:49
    What is JSX?
  • Урок 10. 00:04:30
    Printing JavaScript Variables in JSX
  • Урок 11. 00:01:52
    Shorthand JS Expressions
  • Урок 12. 00:00:43
    Exercise Overview
  • Урок 13. 00:02:06
    Exercise Solution
  • Урок 14. 00:01:59
    Typical Component Layouts
  • Урок 15. 00:07:37
    Customizing Elements with Props
  • Урок 16. 00:05:08
    Converting HTML to JSX
  • Урок 17. 00:06:14
    Applying Styling in JSX
  • Урок 18. 00:02:06
    Exercise Solution
  • Урок 19. 00:04:27
    Extracting Components
  • Урок 20. 00:16:07
    Module Systems Overview
  • Урок 21. 00:05:38
    Project Overview
  • Урок 22. 00:05:01
    Creating Core Components
  • Урок 23. 00:04:52
    Introducing the Props System
  • Урок 24. 00:06:07
    Picturing the Movement of Data
  • Урок 25. 00:03:05
    Adding Props
  • Урок 26. 00:04:58
    Using Argument Destructuring
  • Урок 27. 00:01:32
    Exercise Solution
  • Урок 28. 00:02:38
    The React Developer Tools
  • Урок 29. 00:04:44
    The Most Common Props Mistake
  • Урок 30. 00:08:10
    Including Images
  • Урок 31. 00:06:40
    Handling Image Accessibility
  • Урок 32. 00:06:11
    Review on how CSS Works
  • Урок 33. 00:05:58
    Adding CSS Libraries with NPM
  • Урок 34. 00:09:39
    A Big Pile of HTML!
  • Урок 35. 00:05:46
    Last Bit of Styling
  • Урок 36. 00:02:53
    App Overview
  • Урок 37. 00:05:10
    Initial App Setup
  • Урок 38. 00:03:16
    Introducing the Event System
  • Урок 39. 00:08:12
    Events in Detail
  • Урок 40. 00:06:43
    Variations on Event Handlers
  • Урок 41. 00:01:16
    Exercise Solution
  • Урок 42. 00:03:44
    Introducing the State System
  • Урок 43. 00:08:44
    More on State
  • Урок 44. 00:08:11
    Understanding the Re-Rendering Process
  • Урок 45. 00:08:43
    Why Array Destructuring?
  • Урок 46. 00:03:34
    Back to the App
  • Урок 47. 00:07:12
    Picking a Random Element
  • Урок 48. 00:09:47
    List Building in React
  • Урок 49. 00:05:51
    Loading and Showing SVGs
  • Урок 50. 00:05:52
    Increasing Image Size
  • Урок 51. 00:06:22
    Adding Custom CSS
  • Урок 52. 00:05:59
    Finalizing Styling
  • Урок 53. 00:08:53
    App Wrapup and Review
  • Урок 54. 00:02:25
    App Overview
  • Урок 55. 00:05:54
    Project Setup
  • Урок 56. 00:04:07
    The Path Forward
  • Урок 57. 00:11:17
    Overview of HTTP Requests
  • Урок 58. 00:06:08
    Understanding the API
  • Урок 59. 00:10:37
    Making an HTTP Request
  • Урок 60. 00:02:40
    [Optional] Using Async:Await
  • Урок 61. 00:03:21
    Data Fetching Cleanup
  • Урок 62. 00:08:43
    Thinking About Data Flow
  • Урок 63. 00:06:08
    Child to Parent Communication
  • Урок 64. 00:07:30
    Implementing Child to Parent Communication
  • Урок 65. 00:11:33
    Handling Form Submission
  • Урок 66. 00:09:22
    Handling Input Elements
  • Урок 67. 00:14:22
    [Optional] OK But Why?
  • Урок 68. 00:02:36
    Exercise Solution
  • Урок 69. 00:04:07
    Running the Search
  • Урок 70. 00:03:01
    Reminder on Async:Await
  • Урок 71. 00:12:32
    Communicating the List of Images Down
  • Урок 72. 00:05:04
    Building a List of Images
  • Урок 73. 00:09:11
    Handling List Updates
  • Урок 74. 00:09:23
    Notes on Keys
  • Урок 75. 00:01:49
    Displaying Images
  • Урок 76. 00:04:27
    A Touch of Styling
  • Урок 77. 00:03:42
    App Wrapup
  • Урок 78. 00:03:21
    App Overview
  • Урок 79. 00:05:57
    Initial Setup
  • Урок 80. 00:05:15
    State Location
  • Урок 81. 00:04:52
    Reminder on Event Handlers
  • Урок 82. 00:08:56
    Receiving New Titles
  • Урок 83. 00:02:13
    Adding Styling
  • Урок 84. 00:10:26
    Updating State
  • Урок 85. 00:04:27
    Don't Mutate That State!
  • Урок 86. 00:01:25
    [Optional] Adding Elements to the Start or End
  • Урок 87. 00:02:10
    [Optional] Exercise Solution
  • Урок 88. 00:04:44
    [Optional] Inserting Elements
  • Урок 89. 00:02:10
    [Optional] Exercise Solution
  • Урок 90. 00:07:05
    [Optional] Removing Elements
  • Урок 91. 00:02:10
    [Optional] Exercise Solution
  • Урок 92. 00:06:06
    [Optional] Modifying Elements
  • Урок 93. 00:07:11
    [Super Optional] Why the Special Syntax?
  • Урок 94. 00:02:27
    [Optional] Exercise Solution
  • Урок 95. 00:03:59
    [Optional] Adding, Changing, or Removing Object Properties
  • Урок 96. 00:01:50
    Adding a Book, For Real!
  • Урок 97. 00:02:06
    Generating Random ID's
  • Урок 98. 00:05:36
    Displaying the List
  • Урок 99. 00:06:37
    Deleting Records
  • Урок 100. 00:06:32
    Toggling Form Display
  • Урок 101. 00:07:07
    Default Form Values
  • Урок 102. 00:08:45
    Updating the Title
  • Урок 103. 00:05:07
    Closing the Form on Submit
  • Урок 104. 00:04:31
    A Better Solution!
  • Урок 105. 00:03:19
    Collapsing Two Handlers into One
  • Урок 106. 00:07:59
    Adding Images
  • Урок 107. 00:07:49
    Adding Data Persistence
  • Урок 108. 00:03:45
    Server Setup
  • Урок 109. 00:04:37
    What Just Happened?
  • Урок 110. 00:05:21
    How the API Works
  • Урок 111. 00:05:07
    Introducing the REST Client
  • Урок 112. 00:06:59
    Using the REST Client
  • Урок 113. 00:06:57
    Creating a New Record
  • Урок 114. 00:04:26
    Fetching a List of Records
  • Урок 115. 00:02:52
    Introducing useEffect
  • Урок 116. 00:06:25
    useEffect in Action
  • Урок 117. 00:09:53
    More on useEffect
  • Урок 118. 00:03:19
    Updating a Record
  • Урок 119. 00:05:28
    Thinking About Updates
  • Урок 120. 00:01:19
    Deleting a Record
  • Урок 121. 00:09:13
    Introducing Context
  • Урок 122. 00:06:16
    Context in Action
  • Урок 123. 00:06:52
    Changing Context Values
  • Урок 124. 00:08:47
    More on Changing Context
  • Урок 125. 00:11:52
    Application vs Component State
  • Урок 126. 00:04:39
    Refactoring to Use Context
  • Урок 127. 00:05:33
    Refactoring the App
  • Урок 128. 00:06:13
    Reminder on Sharing with Context
  • Урок 129. 00:03:09
    Props and Context Together
  • Урок 130. 00:05:57
    Last Bit of Refactoring
  • Урок 131. 00:09:54
    A Small Taste of Reusable Hooks
  • Урок 132. 00:08:07
    Return to useEffect
  • Урок 133. 00:07:18
    Understanding the Issue
  • Урок 134. 00:06:24
    Applying the Fix
  • Урок 135. 00:10:58
    ESLint is Good, but be Careful!
  • Урок 136. 00:13:09
    Stable References with useCallback
  • Урок 137. 00:02:09
    Fixing Bugs with useCallback
  • Урок 138. 00:05:34
    useEffect Cleanup Functions
  • Урок 139. 00:05:38
    The Purpose of Cleanup Functions
  • Урок 140. 00:04:26
    Project Overview
  • Урок 141. 00:01:55
    Project Setup
  • Урок 142. 00:08:20
    Some Button Theory
  • Урок 143. 00:03:49
    Underlying Elements
  • Урок 144. 00:04:22
    The Children Prop
  • Урок 145. 00:06:22
    Props Design
  • Урок 146. 00:08:30
    Validating Props with PropTypes
  • Урок 147. 00:06:53
    PropTypes in Action
  • Урок 148. 00:06:38
    Introducing TailwindCSS
  • Урок 149. 00:04:51
    Installing Tailwind
  • Урок 150. 00:06:36
    How to use Tailwind
  • Урок 151. 00:10:23
    Review on Styling
  • Урок 152. 00:11:29
    The ClassNames Library
  • Урок 153. 00:05:56
    Building Some Variations
  • Урок 154. 00:06:08
    Finalizing the Variations
  • Урок 155. 00:09:50
    Using Icons in React Projects
  • Урок 156. 00:07:17
    Issues with Event Handlers
  • Урок 157. 00:06:08
    Passing Props Through
  • Урок 158. 00:05:18
    Handling the Special ClassName Case
  • Урок 159. 00:10:44
    Project Organization
  • Урок 160. 00:05:57
    Refactoring with Organization
  • Урок 161. 00:04:49
    Component Overview
  • Урок 162. 00:03:43
    Component Setup
  • Урок 163. 00:04:05
    Reminder on Building Lists
  • Урок 164. 00:29:31
    State Design Process Overview
  • Урок 165. 00:04:10
    Finding the Expanded Item
  • Урок 166. 00:06:26
    Conditional Rendering
  • Урок 167. 00:10:01
    Inline Event Handlers
  • Урок 168. 00:08:22
    Variation on Event Handlers
  • Урок 169. 00:02:15
    Conditional Icon Rendering
  • Урок 170. 00:01:46
    Displaying Icons
  • Урок 171. 00:03:49
    Adding Styling
  • Урок 172. 00:02:08
    Toggling Panel Collapse
  • Урок 173. 00:08:35
    [Optional] Delayed State Updates
  • Урок 174. 00:11:44
    [Optional] Functional State Updates
  • Урок 175. 00:01:27
    Exercise Solution
  • Урок 176. 00:01:09
    Component Overview
  • Урок 177. 00:05:50
    Designing the Props
  • Урок 178. 00:04:15
    Component Creation
  • Урок 179. 00:20:12
    [Optional] More State Design
  • Урок 180. 00:06:46
    Finally... Implementation!
  • Урок 181. 00:04:48
    Reminder on Event Handlers in Maps
  • Урок 182. 00:04:46
    Dropdown as a Controlled Component
  • Урок 183. 00:05:37
    Controlled Component Implementation
  • Урок 184. 00:04:31
    Existence Check Helper
  • Урок 185. 00:06:35
    Community Convention with Props Names
  • Урок 186. 00:01:38
    Exercise Solution
  • Урок 187. 00:05:34
    Adding Styling
  • Урок 188. 00:07:08
    The Panel Component
  • Урок 189. 00:06:00
    Creating the Reusable Panel
  • Урок 190. 00:05:20
    A Challenging Extra Feature
  • Урок 191. 00:02:47
    Document-Wide Click Handlers
  • Урок 192. 00:06:15
    Event Capture and Bubbling
  • Урок 193. 00:02:21
    Putting it All Together
  • Урок 194. 00:14:35
    Why a Capture Phase Handler?
  • Урок 195. 00:03:53
    Reminder on the useEffect Function
  • Урок 196. 00:05:47
    Reminder on useEffect Cleanup
  • Урок 197. 00:02:57
    Issues with Element References
  • Урок 198. 00:05:06
    useRef in Action
  • Урок 199. 00:03:15
    Checking Click Location
  • Урок 200. 00:09:34
    Traditional Browser Navigation
  • Урок 201. 00:07:57
    Theory of Navigation in React
  • Урок 202. 00:02:44
    Extracting the DropdownPage
  • Урок 203. 00:05:34
    Answering Critical Questions
  • Урок 204. 00:02:57
    The PushState Function
  • Урок 205. 00:02:29
    Handling Link Clicks
  • Урок 206. 00:06:24
    Handling Back:Forward Buttons
  • Урок 207. 00:04:06
    Navigation Context
  • Урок 208. 00:06:20
    Listening to Forward and Back Clicks
  • Урок 209. 00:05:37
    Programmatic Navigation
  • Урок 210. 00:05:26
    A Link Component
  • Урок 211. 00:05:50
    A Route Component
  • Урок 212. 00:02:53
    Handling Control and Command Keys
  • Урок 213. 00:01:19
    Link Styling
  • Урок 214. 00:02:56
    Custom Navigation Hook
  • Урок 215. 00:08:23
    Adding a Sidebar Component
  • Урок 216. 00:07:26
    Highlighting the Active Link
  • Урок 217. 00:01:55
    Navigation Wrapup
  • Урок 218. 00:04:22
    Modal Component Overview
  • Урок 219. 00:05:50
    Toggling Visibility
  • Урок 220. 00:03:06
    At First Glance, Easy!
  • Урок 221. 00:09:27
    We're Lucky it Works At All!
  • Урок 222. 00:07:10
    Fixing the Modal with Portals
  • Урок 223. 00:02:05
    Closing the Modal
  • Урок 224. 00:05:04
    Customizing the Modal
  • Урок 225. 00:01:45
    Additional Styling
  • Урок 226. 00:01:54
    One Small Bug
  • Урок 227. 00:05:49
    Modal Wrapup
  • Урок 228. 00:03:35
    Creating a Reusable table
  • Урок 229. 00:03:04
    Communicating Data to the Table
  • Урок 230. 00:04:26
    Reminder on Table HTML Structure
  • Урок 231. 00:02:53
    Building the Rows
  • Урок 232. 00:03:39
    Better Styling
  • Урок 233. 00:05:11
    Done! But It's Not Reusable
  • Урок 234. 00:02:30
    Here's the Idea
  • Урок 235. 00:04:47
    Dynamic Table Headers
  • Урок 236. 00:05:19
    Rendering Individual Cells
  • Урок 237. 00:05:01
    Fixed Cell Values
  • Урок 238. 00:04:36
    Nested Maps
  • Урок 239. 00:00:58
    Fixing the Color
  • Урок 240. 00:04:13
    Adding a Key Function
  • Урок 241. 00:06:39
    Adding Sorting to the Table
  • Урок 242. 00:06:25
    Reminder on Sorting in JavaScript
  • Урок 243. 00:02:47
    Sorting Strings
  • Урок 244. 00:03:58
    Sorting Objects
  • Урок 245. 00:07:39
    Object Sort Implementation
  • Урок 246. 00:04:27
    Reversing Sort Order
  • Урок 247. 00:04:11
    Optional Sorting
  • Урок 248. 00:03:15
    A Small Extra Feature
  • Урок 249. 00:03:50
    Customizing Header Cells
  • Урок 250. 00:05:59
    React Fragments
  • Урок 251. 00:10:40
    The Big Reveal
  • Урок 252. 00:11:33
    Adding SortableTable
  • Урок 253. 00:01:44
    Watching for Header Cell Clicks
  • Урок 254. 00:06:58
    Quick State Design
  • Урок 255. 00:05:25
    Adding Sort State
  • Урок 256. 00:11:01
    Yessssss, It Worked!
  • Урок 257. 00:05:09
    Determining Icon Set
  • Урок 258. 00:03:38
    Styling Header Cells
  • Урок 259. 00:02:56
    Resetting Sort Order
  • Урок 260. 00:03:54
    Table Wrapup
  • Урок 261. 00:03:40
    Exploring Code Reuse
  • Урок 262. 00:03:11
    Revisiting Custom Hooks
  • Урок 263. 00:04:47
    Creating the Demo Component
  • Урок 264. 00:03:17
    Custom Hook Creation
  • Урок 265. 00:09:43
    Hook Creation Process in Depth
  • Урок 266. 00:11:10
    Making a Reusable Sorting Hook
  • Урок 267. 00:03:04
    App Overview
  • Урок 268. 00:04:27
    Adding the Form
  • Урок 269. 00:06:59
    More on the Form
  • Урок 270. 00:09:48
    useReducer in Action
  • Урок 271. 00:09:23
    Rules of Reducer Functions
  • Урок 272. 00:10:47
    Understanding Action Objects
  • Урок 273. 00:06:36
    Constant Action Types
  • Урок 274. 00:05:35
    Refactoring to a Switch
  • Урок 275. 00:06:21
    Adding New State Updates
  • Урок 276. 00:09:52
    A Few Design Considerations Around Reducers
  • Урок 277. 00:05:00
    Introducing Immer
  • Урок 278. 00:03:22
    Immer in Action
  • Урок 279. 00:05:24
    Into the World of Redux
  • Урок 280. 00:09:18
    Redux vs Redux Toolkit
  • Урок 281. 00:03:04
    App Overview
  • Урок 282. 00:03:33
    The Path Forward
  • Урок 283. 00:04:42
    Implementation Time!
  • Урок 284. 00:09:22
    Understanding the Store
  • Урок 285. 00:03:33
    The Store's Initial State
  • Урок 286. 00:07:51
    Understanding Slices
  • Урок 287. 00:06:34
    Understanding Action Creators
  • Урок 288. 00:04:25
    Connecting React to Redux
  • Урок 289. 00:08:26
    Updating State from a Component
  • Урок 290. 00:06:35
    Accessing State in a Component
  • Урок 291. 00:07:13
    Removing Content
  • Урок 292. 00:06:56
    Practice Updating State!
  • Урок 293. 00:02:03
    Practice Accessing State!
  • Урок 294. 00:04:30
    Even More State Updating!
  • Урок 295. 00:06:26
    Resetting State
  • Урок 296. 00:04:48
    Multiple State Updates
  • Урок 297. 00:06:46
    Understanding Action Flow
  • Урок 298. 00:05:12
    Watching for Other Actions
  • Урок 299. 00:03:08
    Getting an Action Creator's Type
  • Урок 300. 00:09:32
    Manual Action Creation
  • Урок 301. 00:08:42
    File and Folder Structure
  • Урок 302. 00:11:08
    Refactoring the Project Structure
  • Урок 303. 00:04:11
    Project Overview
  • Урок 304. 00:06:09
    Adding Component Boilerplate
  • Урок 305. 00:07:55
    Thinking About Derived State
  • Урок 306. 00:05:18
    Thinking About Redux Design
  • Урок 307. 00:05:35
    Adding the Form Slice
  • Урок 308. 00:09:41
    Maintaining a Collection with a Slice
  • Урок 309. 00:04:34
    Creating the Store
  • Урок 310. 00:08:45
    Form Values to Update State
  • Урок 311. 00:05:18
    Receiving the Cost
  • Урок 312. 00:04:32
    Dispatching During the Form Submission
  • Урок 313. 00:07:19
    Awkward Double Keys
  • Урок 314. 00:03:26
    Listing the Records
  • Урок 315. 00:02:17
    Deleting Records
  • Урок 316. 00:01:29
    Adding Styling
  • Урок 317. 00:03:22
    Form Reset on Submission
  • Урок 318. 00:02:24
    Reminder on ExtraReducers
  • Урок 319. 00:05:37
    Adding a Searching Input
  • Урок 320. 00:05:08
    Derived State in useSelector
  • Урок 321. 00:06:23
    Total Car Cost
  • Урок 322. 00:06:31
    Highlighting Existing Cars
  • Урок 323. 00:08:37
    App Overview
  • Урок 324. 00:02:46
    Adding a Few Dependencies
  • Урок 325. 00:02:10
    Initial App Boilerplate
  • Урок 326. 00:02:52
    API Server Setup
  • Урок 327. 00:03:14
    Adding a Few Components
  • Урок 328. 00:05:35
    Creating the Redux Store
  • Урок 329. 00:09:20
    Thinking About Data Structuring
  • Урок 330. 00:01:56
    Reminder on Request Conventions
  • Урок 331. 00:02:38
    Data Fetching Techniques
  • Урок 332. 00:06:53
    Adding State for Data Loading
  • Урок 333. 00:04:15
    Understanding Async Thunks
  • Урок 334. 00:07:47
    Steps for Adding a Thunk
  • Урок 335. 00:13:18
    More on Adding Thunks
  • Урок 336. 00:05:24
    Wrapping up the Thunk
  • Урок 337. 00:04:31
    Using Loading State
  • Урок 338. 00:03:28
    Adding a Pause for Testing
  • Урок 339. 00:05:40
    Adding a Skeleton Loader
  • Урок 340. 00:12:03
    Animations with TailwindCSS
  • Урок 341. 00:03:17
    Rendering the List of Users
  • Урок 342. 00:12:08
    Creating New Users
  • Урок 343. 00:06:04
    Unexpected Loading State
  • Урок 344. 00:07:36
    Strategies for Fine-Grained Loading State
  • Урок 345. 00:10:08
    Local Fine-Grained Loading State
  • Урок 346. 00:02:56
    More on Loading State
  • Урок 347. 00:05:04
    Handling Errors with User Creation
  • Урок 348. 00:11:35
    Creating a Reusable Thunk Hook
  • Урок 349. 00:05:43
    Creating a Fetch-Aware Button Component
  • Урок 350. 00:03:42
    Better Skeleton Display
  • Урок 351. 00:04:57
    A Thunk to Delete a User
  • Урок 352. 00:04:29
    Updating the Slice
  • Урок 353. 00:03:33
    Refactoring the Component
  • Урок 354. 00:04:47
    Deleting the User
  • Урок 355. 00:05:14
    Fixing a Delete Error
  • Урок 356. 00:04:49
    Album Feature Overview
  • Урок 357. 00:07:22
    Additional Components
  • Урок 358. 00:04:52
    Adding the ExpandablePanel
  • Урок 359. 00:04:01
    Wrapping Up the ExpandablePanel
  • Урок 360. 00:02:44
    Adding the Albums Listing
  • Урок 361. 00:02:48
    [Optional] Getting Caught Up
  • Урок 362. 00:08:01
    Introducing Redux Toolkit Query
  • Урок 363. 00:06:21
    Creating a RTK Query API
  • Урок 364. 00:14:02
    Creating an Endpoint
  • Урок 365. 00:11:02
    Using the Generated Hook
  • Урок 366. 00:05:57
    A Few Immediate Notes
  • Урок 367. 00:04:26
    Rendering the List
  • Урок 368. 00:08:43
    Changing Data with Mutations
  • Урок 369. 00:03:14
    Differences Between Queries and Mutations
  • Урок 370. 00:06:19
    Options for Refetching Data
  • Урок 371. 00:03:51
    Request De-Duplication
  • Урок 372. 00:06:15
    Some Internals of Redux Toolkit Query
  • Урок 373. 00:07:34
    Refetching with Tags
  • Урок 374. 00:09:14
    Fine-Grained Tag Validation
  • Урок 375. 00:03:21
    Styling Fixups
  • Урок 376. 00:03:22
    Adding a Pause for Testing
  • Урок 377. 00:05:35
    Implementing Delete Endpoints
  • Урок 378. 00:04:47
    Refactoring the List
  • Урок 379. 00:07:43
    Remove Implementation
  • Урок 380. 00:05:59
    Easy Tag Invalidation
  • Урок 381. 00:06:25
    Getting Clever with Cache Tags
  • Урок 382. 00:04:48
    More Clever Tag Implementation
  • Урок 383. 00:04:12
    Photos Feature Overview
  • Урок 384. 00:06:02
    Lots of Photos Setup!
  • Урок 385. 00:12:39
    Adding the Endpoints
  • Урок 386. 00:04:38
    Creating the Photo
  • Урок 387. 00:05:15
    Showing the List of Photos
  • Урок 388. 00:06:20
    Adding Mouse-Over Deletes
  • Урок 389. 00:08:36
    Adding Automatic Data Refetching