Actions and Protected Routes

This playlist is part of Learn React Router 6

Actions and Protected Routes

40 lessons2 hours 39 min

1. Initial Login Form

2. Note from the future: importing image assets in Vite

3. Protected Routes Intro

4. Protected Routes - AuthRequired Layout Route

5. Protected Routes - Conditionally send to /login page

6. Protected Routes Quiz

7. Protected Routes - with loaders

8. Protected Routes w/ loaders

9. Parallel Loaders demo

10. Challenge: Protected Routes w/ loaders

11. Challenge: Protected Routes in VanLife - Part 1

12. Aside challenge: move remaining fetching to loaders - Part 1

13. Aside challenge: move remaining fetching to loaders - Part 2

14. Challenge: Protected Routes in VanLife - Part 2

15. Send login message prompt to login page

16. Consume message from search param on login page

17. Pass message to Login page

18. 🌶️ Take: Forms in React are bad

19. Setting up for authentication - happy path

20. Setting up for authentication - sad path

21. useNavigate()

22. React Router Form Component

23. Setting up the Action function

24. Add form and action to VanLife

25. Action function - params

26. Action function - request

27. Get form data in VanLife

28. Use data in action to log in

29. Better (but still fake) auth

30. Challenge: send user to /host route after log in

31. Form replace

32. useActionData

33. Action error handling

34. Action error handling in VanLife

35. useNavigation()

36. useNavigation in VanLife

37. get previous route pathname

38. redirectTo - part 1

39. redirectTo - part 2

40. redirectTo in VanLife