Next.js 14 Tutorial - 30 - Conditional Routes

Поділитися
Вставка
  • Опубліковано 30 вер 2024
  • 📘 Frontend Interview Course - learn.codevolu...
    💖 Support UPI - support.codevo...
    💖 Support Paypal - www.paypal.me/...
    💾 Github - github.com/gop...
    📱 Follow Codevolution
    + Twitter - / codevolutionweb
    + Facebook - / codevolutionweb
    📫 Business - codevolution.business@gmail.com
    Next.js 14
    Next.js Tutorial
    Next.js 14 Tutorial
    Next.js Tutorial for Beginners
    Conditional Routes
    Conditional Routesin Next.js

КОМЕНТАРІ • 57

  • @miguelwayas6784
    @miguelwayas6784 2 місяці тому +12

    Hi all
    If you have the blank page issue even if you restarted dev server just delete “.next” folder then re run dev server again and that’s all 👌🏼

  • @dhavalvanjara572
    @dhavalvanjara572 9 місяців тому +44

    To complete the given task, added the default.tsx in @login slot folder

  • @sohamdebnathpopo
    @sohamdebnathpopo 7 місяців тому +20

    make sure to restart the dev server if page.tsx from @login is not working conditionally.

  • @justtil6749
    @justtil6749 6 місяців тому +19

    In the default.tsx you can use the following:
    import LoginPage from "./page";
    export default LoginPage;
    this will import the LoginPage Export default from your page.tsx, which means that the default.tsx will always be up/to date with the page.tsx. There are scenarios where this may be helpful.

    • @shahanahmedkhan6101
      @shahanahmedkhan6101 2 місяці тому +5

      inside default.tsx, we can write this line only ```export { default } from './page'```

    • @ayushkushwaha171
      @ayushkushwaha171 Місяць тому

      good idea! thanks :)

  • @faizanahmed9304
    @faizanahmed9304 9 місяців тому +15

    Completed task: by adding default.tsx file in login slot.

  • @ragtop63
    @ragtop63 Місяць тому +3

    Something must have changed in Next.js between the time this video was created to now.
    When navigating to /complex-dashboard/archived while isLoggedIn = false, the page will render the header and footer but nothing in between (no 404 message).
    Restarting the server and the browser does not change the behavior.

    • @moathal-zaol8937
      @moathal-zaol8937 Місяць тому +3

      I have same issue, just remove the .next folder and restarting the server and will working fine

    • @momentswithmanisha
      @momentswithmanisha 12 днів тому

      @@moathal-zaol8937 Any reason why it started giving 404 error after we deleted the .next folder and re ran npm run dev.

  • @sharpesthawk
    @sharpesthawk 9 місяців тому +9

    I needed to restart the server with 'yarn dev' to see the 'login' component get rendered. Why?

    • @omkumarsaini692
      @omkumarsaini692 8 місяців тому +1

      same thing happened with me as well. Do you now know why ?

    • @sharpesthawk
      @sharpesthawk 8 місяців тому +1

      @@omkumarsaini692 yeah sometimes when you make changes to certain components like 'layout.jsx' nextjs breaks.....so you need to restart the app.

    • @vanshverma4950
      @vanshverma4950 4 місяці тому

      caching issue bro its fixed in 15 u can use the release candidate version the stable version will be there by the end of the year

  • @genztechman
    @genztechman 5 місяців тому +3

    i use default.tsx in @login slot but it didnt work, i dont know why i also restarted the dev server but default.tsx is not being displayed

  • @stylinali
    @stylinali 3 місяці тому +1

    If Login page is not working on condition, make sure to restart the server.

    • @Random-Wonderer
      @Random-Wonderer 3 місяці тому +2

      Navigating to complex-dashboard/archived does not show 404 page, instead header and footer with empty space within appears. Same happens with and without default.tsx in @login. Plzz assist if you know the solution

    • @terencescott433
      @terencescott433 2 місяці тому

      @@Random-Wonderer I‘ve encountered the same problem ..... tried many ways and even asked ChatGPT but to no avail. If anyone knows how to fix it, please feel free to let me know. Thanks in advance!

  • @vinitpatel-q3h
    @vinitpatel-q3h 3 дні тому

    it is showing 404 page bcz isLoggedIn false if you change it true and then you set url as archived it will print archived page

  • @momentswithmanisha
    @momentswithmanisha 12 днів тому

    Was able to make it work by adding default.jsx file under @login slot.
    Note:- This error occured because for "isLoggedInUser" value is "false" which means under "complex-dashboard" route Next.js will try to identify the fallback UI for login slot, and since it was not present "page-not-found" page will get triggered.

  • @ONEHLOFIOCHIOCHEME
    @ONEHLOFIOCHIOCHEME 24 дні тому

    while navigating to /complex-dashbaord/archived path, the page worls well when the isLoggedIn is set to true, but the page loads only the header and the footer section when isLoggedIn is set to false without the 404 in between. i'm not sure if this bahaviour is the expected outcome.

  • @YashSolanki-p8j
    @YashSolanki-p8j 2 місяці тому +1

    Make the file default.js or default.tsx in @login folder to handle the 404 error

  • @parth31patel
    @parth31patel 6 місяців тому +1

    3:37 create default.tsx file in archive route then remove that error

  • @xingshenglim1268
    @xingshenglim1268 5 місяців тому +2

    It doesn't show the 404 page, but it shows empty...

    • @elie3423
      @elie3423 4 місяці тому

      I had this problem, you need to clear the browser cache and have the same file structure as in github.

    • @Anshv-p1y
      @Anshv-p1y 4 місяці тому +2

      I have got the same issue. it doesnt showing 404 error nor Login... only showing header and footer. Did you find the solution?

    • @mubeenqaiser8844
      @mubeenqaiser8844 3 місяці тому

      @@Anshv-p1y same, I cant figure out why is this technically happening

  • @OldYgg
    @OldYgg 6 місяців тому

    I had to add {login} - for it to work properly - but maybe that would have worked with the default.tsx, too. I don't know.

  • @User1851kki
    @User1851kki 2 місяці тому

    로그인 Card가 나타나지 않는 경우
    1. 서버 종료 후 npm run dev
    2. @login 슬롯 폴더에 default.tsx 추가

  • @legendm2411
    @legendm2411 9 місяців тому +1

    Please start tailwind css series 😊

  • @muhammadfadll4579
    @muhammadfadll4579 6 місяців тому

    the condition is working, but why is nothing displayed even login.tsx?

  • @shaheryarasif5666
    @shaheryarasif5666 2 місяці тому

    what if we have a logic in any slot and we have parallel routes, do we need to add the same logic in default.tsx as well? for each unmatched routes?

  • @actingkeedapresents9276
    @actingkeedapresents9276 Місяць тому

    404 error is not coming for me that you stated in the last instead i see only Header and Footer. Can you please answer why that could have happened? i followed the code along with you

    • @actingkeedapresents9276
      @actingkeedapresents9276 Місяць тому

      I am not sure about the root cause but when i added default.tsx and deleted it once i started seeing the 404 error

    • @karanmodi6970
      @karanmodi6970 Місяць тому

      same issue for me

  • @firewatermoonsun
    @firewatermoonsun 3 місяці тому

    It looks like there will be 2 login pages - one in @login slot and in (auth) section.

  • @gobicorner
    @gobicorner 8 місяців тому +1

    its working for me

  • @romanyfayiez3829
    @romanyfayiez3829 9 місяців тому

    added a default.tsx page in the @login folder

  • @JinoDocena
    @JinoDocena 5 місяців тому

    i did add on the login folder a default.tsx

  • @Gabriel-kl6bt
    @Gabriel-kl6bt 7 місяців тому

    Isn't there a better way to have a page.tsx and a default.tsx without duplicating the whole code?

    • @amitbhandari3149
      @amitbhandari3149 6 місяців тому +2

      import page inside the default.tsx and it will work

  • @11テッチャン
    @11テッチャン 7 місяців тому

    To complete the given task

  • @AyushDas-t7y
    @AyushDas-t7y 9 місяців тому

    done adding the default.tsx in @login slot

  • @animallover993
    @animallover993 4 місяці тому

    you are really great sir😄

  • @skanwar1351
    @skanwar1351 9 місяців тому +2

    task Completed Sir and Noted in Notes ,Thank you soo much . Waiting for Upcoming Class.

  • @SahilMalik-jl1te
    @SahilMalik-jl1te 7 місяців тому

    add default.tsx in @login

  • @cuneytdonmez214
    @cuneytdonmez214 8 місяців тому

    thanks