Hi all, this is a Crash Course for Tanstack React Router. In this tutorial, I will be covering a lot of different Tanstack React Router Features like Setting up file-based routes, flat and nested routes, accessing query/search and URL params, loading data for pages etc. Code: https://github.com/usmanabdurrehman/tanstack-router-tutorials/tree/CrashCourse You can follow me on: https://www.instagram.com/usmanabdurrehman97/ https://twitter.com/usmanselen 00:00 Intro 00:07 Setup for Vite Projects 00:57 Root Layout 01:33 Outlet Component 02:22 Exploring Route Gen Tree 02:53 Steps for Non-Vite Projects 03:30 Linking Route Tree with Router 05:01 Adding First Route 05:27 Lazy Loading Routes 06:09 If Automatic Route Tree Generation does not work 06:26 Adding Second Route 07:56 Adding Links 08:43 Dev Tools 09:44 Styling Links 10:25 Prefetching Routes 11:24 Directory Routes 12:58 Loading Data using loader function 14:41 Using Loader Data 15:23 Showing Pending/Loading Component 16:20 Navigating to a route with Query/Search params 16:39 validateSearch function 17:34 Adding Search/Query params in URL 18:54 beforeLoad function 19:13 Using Search/Query params inside loader 20:07 Adding a Variable/Param Route 20:53 Loading Data in Variable Route using loader function 21:29 Getting URL params inside loader function 22:44 Navigating to another route 23:11 Navigating to route with URL params 23:54 Adding Custom Not Found Component 24:33 Showing Not Found Component for No Resource Found from DB 25:45 Adding Custom Error Component 26:18 Outro