React Project Tutorial for Beginners - Hooks, Context API, Tailwind, TypeScript, Authentication

React Project Tutorial for Beginners - Hooks, Context API, Tailwind, TypeScript, Authentication

ByteGrad via YouTube Direct link

2:56:43 TypeScript in React

20 of 30

20 of 30

2:56:43 TypeScript in React

Class Central Classrooms beta

YouTube videos curated by Class Central.

Classroom Contents

React Project Tutorial for Beginners - Hooks, Context API, Tailwind, TypeScript, Authentication

Automatically move to the next video in the Classroom when playback concludes

  1. 1 00:00 Intro
  2. 2 02:10 Project setup
  3. 3 04:12 Fresh React app look-around
  4. 4 12:25 Tailwind CSS setup
  5. 5 16:52 Google font
  6. 6 19:54 Kinde setup
  7. 7 21:33 Creating components + styling with Tailwind
  8. 8 59:43 Reusable button component
  9. 9 1:03:50 Props
  10. 10 1:15:15 List / map initial todos
  11. 11 1:31:05 Manipulate styling line-through
  12. 12 1:33:25 useState hook toggle, delete
  13. 13 2:10:18 Event bubbling
  14. 14 2:13:45 Counter prop drilling
  15. 15 2:27:07 Add todo
  16. 16 2:29:08 Controlled input
  17. 17 2:35:38 Conditional rendering empty state
  18. 18 2:39:15 Restrict functionality for guest users
  19. 19 2:42:05 Better app structure
  20. 20 2:56:43 TypeScript in React
  21. 21 3:26:00 State management: State / derived state / event handlers
  22. 22 3:33:40 Folder structure: lib folder types
  23. 23 3:35:15 Context API for state management
  24. 24 4:03:45 Custom hook for Todos Context
  25. 25 4:10:02 useEffect: Data fetching in React
  26. 26 4:17:20 useEffect: Persist data in localStorage
  27. 27 4:32:12 Add authentication
  28. 28 4:50:21 Deploy to Vercel
  29. 29 4:54:07 Build npm run build
  30. 30 5:02:49 Outro

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.