React Router 7 Tutorial (framework mode)
This is walkthrough of the React Router v7 Address Book tutorial
You can find the full tutorial here 👉 https://reactrouter.com/tutorials/add...
This tutorial covers:
how to setup a React Router project
various rendering strategies, such as client-side rendering, server-side rendering, and static pre-rendering
data flow in React Router with loaders and actions
type safety
pending and optimistic UI
and much more
Chapters:
00:00 - Introduction
00:13 - Setup
00:46 - The Root Route
01:38 - The Contact Route
03:12 - Nested Routes and Outlets
03:50 - Client Side Routing
04:33 - Loading Data
05:41 - Type Safety
06:42 - Adding a HydrateFallback
08:06 - Index Routes
09:25 - Adding an About Route
10:07 - Layout Routes
12:51 - Pre-rendering a Static Route
13:38 - Server-Side Rendering
14:37 - URL Params in Loaders
15:54 - Throwing Responses
16:35 - Data Mutations
17:19 - Creating Contacts
18:59 - Updating Data
20:00 - Updating Contacts with FormData
21:16 - Redirecting new records to the edit page
21:58 - Active Link Styling
23:09 - Global Pending UI
24:06 - Deleting Records
25:47 - Cancel Button
26:47 - URLSearchParams and GET Submissions
28:06 - Synchronizing URLs to Form State
29:21 - Submitting Form's onChange
30:35 - Adding Search Spinner
31:53 - Managing the History Stack
33:05 - Forms Without Navigation
34:14 - Optimistic UI
35:01 - Wrapping Up
On this page of the site you can watch the video online React Router 7 Tutorial (framework mode) with a duration of hours minute second in good quality, which was uploaded by the user Remix 12 December 2024, share the link with friends and acquaintances, this video has already been watched 59,917 times on youtube and it was liked by 1.1 thousand viewers. Enjoy your viewing!
