Learn React Router v6 - Full Course

Learn how to use React Router. You'll learn about setting up a basic routes, protecting authenticated routes, custom route transitions and more.
Course created by @CounterSyntax
💻 Starter Project/Boilerplate code: github.com/Kolosafo/git-explorer-starter
💻 Git Explorer Final: github.com/Kolosafo/git-explo...
⭐️ Contents ⭐️
⌨️ (0:00:00) Course Overview
⌨️ (0:02:23) Introduction To React Router
⌨️ (0:05:08) Project Overview
⌨️ (0:07:01) Project Setup
⌨️ (0:09:23) Installing React Router
⌨️ (0:10:33) Setting up React Router
⌨️ (0:14:11) Introduction to Routing
⌨️ (0:20:37) Boilerplate code
⌨️ (0:21:23) Adding a new Route
⌨️ (0:22:12) How to Navigate between Pages
⌨️ (0:25:01) Nested Routes
⌨️ (0:31:37) Creating a custom "Not Found" page
⌨️ (0:35:30) Dynamic Routing
⌨️ (0:43:34) Programmatic Navigation
⌨️ (0:53:27) Route Guarding
⌨️ (1:02:45) Navbar Adjustment
⌨️ (1:06:07) Navigation Transition Animation
⌨️ (1:16:54) Lazy Loading
⌨️ (1:24:34) Advanced Route Config
⌨️ (1:37:09) The Final Project
⌨️ (1:38:09) The END!
🎉 Thanks to our Champion and Sponsor supporters:
👾 davthecoder
👾 jedi-or-sith
👾 南宮千影
👾 Agustín Kussrow
👾 Nattira Maneerat
👾 Heather Wcislo
👾 Serhiy Kalinets
👾 Justin Hual
👾 Otis Morgan
👾 Oscar Rahnama
--
Learn to code for free and get a developer job: www.freecodecamp.org
Read hundreds of articles on programming: freecodecamp.org/news

Пікірлер: 42

  • @iamtharunraj
    @iamtharunraj28 күн бұрын

    Omg I was looking for a course on React Router. Thank you!!

  • @unluckyhozay
    @unluckyhozay28 күн бұрын

    this is awesome thank you!

  • @hamaadafzal2490
    @hamaadafzal249028 күн бұрын

    Sir thanks for that video kindly make a complete react course

  • @kehindegilbert2699
    @kehindegilbert269928 күн бұрын

    This is a very nice content. God bless the creator

  • @olisaemekaaghabuilo8688
    @olisaemekaaghabuilo868813 күн бұрын

    Nice course. Thanks for this quality content

  • @mahendranath2504
    @mahendranath250428 күн бұрын

    Wow nice thanks for sharing the knowledge, awesome content 🫡🙏🤲👍👌

  • @gaintakwa9057
    @gaintakwa905728 күн бұрын

    Waiting for this

  • @The_Developer_
    @The_Developer_12 күн бұрын

    Great tutorial ❤

  • @jirayuvijjakajohn295
    @jirayuvijjakajohn29528 күн бұрын

    Just finished the video. Good work👍👍. Please more DevOps course😘

  • @khalidelgazzar

    @khalidelgazzar

    28 күн бұрын

    How did you finish a video that is 100+ minutes long and was just uploaded 6 minutes ago?? That would be 1000X speed viewing

  • @jostasizzi818

    @jostasizzi818

    28 күн бұрын

    What the hell man?

  • @smartdriver2990

    @smartdriver2990

    28 күн бұрын

    You're kidding😅

  • @bullyversal5313

    @bullyversal5313

    28 күн бұрын

    Lol this is not even devops course😂

  • @iamtharunraj

    @iamtharunraj

    28 күн бұрын

    Bot 😂😂😂

  • @drazzo777cod7
    @drazzo777cod727 күн бұрын

    Thanks n word guys op brother

  • @forellko8600
    @forellko860027 күн бұрын

    Cool!

  • @khalidelgazzar
    @khalidelgazzar28 күн бұрын

    Adding to my to-watch list

  • @igetpaidtocode

    @igetpaidtocode

    28 күн бұрын

    and youll never gonna watch it like the other ones :D

  • @sudo_sunil

    @sudo_sunil

    2 күн бұрын

    @@igetpaidtocode lol true

  • @ashish2438
    @ashish243827 күн бұрын

    Isn't the mew method is createBrowserRouter?

  • @moodposts
    @moodposts24 күн бұрын

    Bob ziroll already made a more comprehensive course about react Router V6, the best thing you'd have done is create one on how to use react Router v6 and Redux/toolkit and RTK Query. but good job anyway

  • @kantorobo7718
    @kantorobo771828 күн бұрын

    I built a page for a client and he was screaming for more pages well here you go :) thank you

  • @gaintakwa9057
    @gaintakwa905728 күн бұрын

    🎉

  • @MrKsvignesh
    @MrKsvignesh28 күн бұрын

    Bring the new browser functionality in new version

  • @kishorekevin5372
    @kishorekevin537212 күн бұрын

    The features used in this course are not from react router dom version 6 , these are the features which are belonged to version 5 , isn't it

  • @ichiroutakashima4503
    @ichiroutakashima450327 күн бұрын

    This doesn't look like v6, correct me if I'm wrong though...

  • @pratiksavaliya3890

    @pratiksavaliya3890

    26 күн бұрын

    I don't think its latest release.

  • @AbdulAziz-pm6lk
    @AbdulAziz-pm6lk27 күн бұрын

    Please make updated react appwrite course

  • @cocoatea57
    @cocoatea5728 күн бұрын

    🎉🎉🎉🎉🎉🎉

  • @krishmistry1422
    @krishmistry142228 күн бұрын

    Cyber security course needed

  • @Aman_yadav1419
    @Aman_yadav141928 күн бұрын

    Please give us dev ops course

  • @sohanhossain3449
    @sohanhossain344927 күн бұрын

    getting this error on the latest routing dom, I am using vite, react + ts please help "dependencies": { "react": "^18.2.0", "react-dom": "^18.2.0", "react-router-dom": "^6.22.3" }, here there is a red line under exact Type '{ exact: true; path: string; Component: () => Element; }' is not assignable to type 'IntrinsicAttributes & RouteProps'. Property 'exact' does not exist on type 'IntrinsicAttributes & RouteProps'.ts(2322)

  • @dexter00076

    @dexter00076

    26 күн бұрын

    I think it should be "element" attribute instead of "Component"

  • @sourya111

    @sourya111

    25 күн бұрын

    'component' prop is from React Router 5 and has been replaced by 'element' prop in React Router 6

  • @sohanhossain3449

    @sohanhossain3449

    25 күн бұрын

    @@sourya111 Thanks a lot boss.

  • @sohanhossain3449

    @sohanhossain3449

    25 күн бұрын

    @@dexter00076 great. thanks

  • @FrontierDevCode

    @FrontierDevCode

    17 сағат бұрын

    "exact" prop is removed

  • @mayureshbalsaraf2696
    @mayureshbalsaraf269628 күн бұрын

    Sir pls bring AIML complete course

  • @AkuBapakMu24
    @AkuBapakMu2428 күн бұрын

    Laravel 11

  • @sleepingdog12
    @sleepingdog1226 күн бұрын

    John appears to be a potato ☠️

  • @kishorekevin5372
    @kishorekevin537212 күн бұрын

    The features used in this course are not from react router dom version 6 , these are the features which are belonged to version 5 , isn't it