This Next.js function simplifies dynamic rendering

แชร์
ฝัง
  • เผยแพร่เมื่อ 26 ก.ย. 2024
  • 📘 T3 Stack Tutorial: 1017897100294....
    🤖 SaaS I'm Building: www.icongenera...
    ▶️ Generate Chapters: ytchaptersgene...
    💬 Discord: / discord
    🔔 Newsletter: newsletter.web...
    📁 GitHub: github.com/web...
    📺 Twitch: / webdevcody
    🤖 Website: webdevcody.com
    🐦 Twitter: / webdevcody

ความคิดเห็น • 47

  • @CaioQuirino
    @CaioQuirino 10 หลายเดือนก่อน +1

    Thanks for such great content! Really straight to the point with showing how to check easily what is static rendered and what's not. I really liked it :) keep going on the good content! Cheers!

  • @eshw23
    @eshw23 10 หลายเดือนก่อน +10

    May I ask how much you work a week? Or maybe you can make a video on time management tips? You seem to put in so much time to side projects, this YT channel, on top of your full time job. Which is great.

    • @josemaker5252
      @josemaker5252 10 หลายเดือนก่อน +4

      Seconded. I'd be interested in a video like that for sure!

    • @WebDevCody
      @WebDevCody  10 หลายเดือนก่อน +10

      I work 40 hour work weeks, and I try to do maybe 30 minutes a day towards my channel and 30 min towards a side project. Sometimes I’ll spend more or less on the side things depending on my motivation

    • @codinginflow
      @codinginflow 10 หลายเดือนก่อน

      ​@@WebDevCody 8 hours a week, I admire you 😅

    • @WebDevCody
      @WebDevCody  10 หลายเดือนก่อน +1

      @@codinginflow oh shoot, I mean a day 😂

  • @aaronmineen5511
    @aaronmineen5511 10 หลายเดือนก่อน

    I ran into this problem a few days ago. I didn't know the solution so I converted my component to a client-side component. Now I know why I was having that behavior where my app was working locally but not in production. Thank you very much.

  • @aleksamitic6655
    @aleksamitic6655 10 หลายเดือนก่อน

    Really good point about this. Someone new coming is deff not going to notice this!

  • @Leanz
    @Leanz 10 หลายเดือนก่อน

    I wish you posted this a few days ago haha. I strugged to figure this out. But yes, as you mentioned the Next.js learn module is great ! I picked up a few things myself. Great video as always, thanks for the help !

  • @rohitkochikkatfrancis
    @rohitkochikkatfrancis 5 หลายเดือนก่อน

    WHOAAAAAAAAA................you just solved my prisma issue so fast !!!!
    thanks for the new knowledge.

  • @Pptruenoz
    @Pptruenoz 10 หลายเดือนก่อน

    Nice, I will start using this function, thank you!

  • @jamjam3448
    @jamjam3448 7 หลายเดือนก่อน +1

    thanks a million bro. You saved me!

  • @adarshdhital007
    @adarshdhital007 10 หลายเดือนก่อน

    The title seem so interesting, Thanks Sir!

  • @chisommuorah2990
    @chisommuorah2990 10 หลายเดือนก่อน

    Thanks for sharing. I had this problem in a small project 😂😂

  • @gareebsportscricket2984
    @gareebsportscricket2984 8 หลายเดือนก่อน

    thank you , you solve my 7 days problem

  • @27sosite73
    @27sosite73 7 หลายเดือนก่อน

    thank you mate
    thank you

  • @thomaslodge5432
    @thomaslodge5432 10 หลายเดือนก่อน +1

    They need to introduce a way to include caching behaviour in dev mode. It's very annoying trying to develop/debug things like ISR and on demand revalidation when everything is forced to be dynamic.

  • @alaeddinemenai5380
    @alaeddinemenai5380 10 หลายเดือนก่อน

    Thank you so much.

  • @TedMosby-fk5gj
    @TedMosby-fk5gj 10 หลายเดือนก่อน +1

    Is this a differnt type of dynamic route? I thought dynamic routes were just the routes in the brackets [route.tsx], that are used for dynamic pages, like group chats, profile pages, etc.

    • @WebDevCody
      @WebDevCody  10 หลายเดือนก่อน

      Yeah maybe I should change the tire, this was related to Dynamically rendered pages

  • @MsGrudy
    @MsGrudy 10 หลายเดือนก่อน

    "export const revalidate = 0 " will also dynamically render the page as far as I can remember, unless they changed it

  • @JEsterCW
    @JEsterCW 10 หลายเดือนก่อน

    Really interesting o.o

  • @slemchik03
    @slemchik03 10 หลายเดือนก่อน

    That's a great video👍. But I still prefer to use {cache: "no-store"} when I use fetch.

    • @WebDevCody
      @WebDevCody  10 หลายเดือนก่อน +1

      and what's your approach if you are not using fetch and directly talking to a database using an ORM?

    • @slemchik03
      @slemchik03 10 หลายเดือนก่อน

      @@WebDevCody In practice, I almost never used database query without any dynamic parameters , I used cookies()/headers() functions or route parameters to query the database, which made my route dynamic. But if you have a case when you do not need any additional information to make a database query, of course you can use the noStore function. Thanks for your response!

    • @WebDevCody
      @WebDevCody  10 หลายเดือนก่อน

      @@slemchik03 ah ok that makes sense

  • @zunnoorainrafi5985
    @zunnoorainrafi5985 10 หลายเดือนก่อน

    Did you learn DSA for becoming a better web developer?
    What's your thoughts on learning DSA and spending time on solving LeetCode problems?
    If you have to advice someone who wants to become a full-stack engineer ,then what advice will you give to him?
    1) Learn DSA first or
    2) Learn HTML,CSS,Javascript, React,MERN,SQL,Nextjs and so on.

  • @jellyfish1772
    @jellyfish1772 5 หลายเดือนก่อน

    force-dynamic wont make a client component dynamically rendered. What can we do in that case?

  • @JackStepanyan
    @JackStepanyan 10 หลายเดือนก่อน +1

    Fun fact. Refreshing static built page returns the same number always, but accessing the same random number page via client routing will give you different number. Another next.js -bug- feature.

    • @WebDevCody
      @WebDevCody  10 หลายเดือนก่อน +1

      Wait what? I’ll have to try that out, that doesn’t seem accurate unless you’re doing a revalidatePath or something

    • @JackStepanyan
      @JackStepanyan 10 หลายเดือนก่อน +1

      @@WebDevCodyTry it out. If you put a log in your random number page and run a build process you'll notice two logs. Next is executing the static page component function twice during build. The first result (a random number) goes into [pageName].rsc file somewhere in .next/server/app, the second result (another random number) goes directly into rendered [pageName].html file. Because of this if you access the page directly you see rendered number, but with client routing you see the other random number from .rsc file.

  • @copilotcoder
    @copilotcoder 10 หลายเดือนก่อน

    How can we use nodejs library in middleware.js as it is a edge function and currently we have libraries for node

  • @SanjayNG125
    @SanjayNG125 6 หลายเดือนก่อน

    Idk why both methods are not working for me why im stuck from a week 😖😖 please reply...

  • @mUrMajster
    @mUrMajster 10 หลายเดือนก่อน +6

    It shows exactly why people should not go beyond Next@12 💯

  • @SeibertSwirl
    @SeibertSwirl 10 หลายเดือนก่อน +1

    Good job babe!!! First 👸🏿

  • @DioArsya
    @DioArsya 10 หลายเดือนก่อน

    niceeeee

  • @valemus8372
    @valemus8372 10 หลายเดือนก่อน

    Thoughts on Next.js compared to Sails.js? I've been using Sails for the past few years but it seems to not receive many updates now. How does Next compare to it?

    • @WebDevCody
      @WebDevCody  10 หลายเดือนก่อน

      Idk if sails is even maintained. Also I don’t think sails is a full stack framework, isn’t it just an api framework

  • @Redyf
    @Redyf 10 หลายเดือนก่อน

    What theme are you using on vscode?

  • @noodlespwn42
    @noodlespwn42 10 หลายเดือนก่อน

    why not just use cache: ‘no-store’ option ?

    • @WebDevCody
      @WebDevCody  10 หลายเดือนก่อน +2

      Put that on what? I’m not using fetch

  • @nekotajni394
    @nekotajni394 10 หลายเดือนก่อน

    How is this different from export const revalidate = 0 ?

    • @WebDevCody
      @WebDevCody  10 หลายเดือนก่อน

      I think revalidate has more to do with if you’re calling fetch inside your component. Next will cache fetch requests by default, so if you need all fetch requests to be fresh you’d revalidate 0

  • @don1041
    @don1041 10 หลายเดือนก่อน

    I still hate the fact that you have to put this line of code to prevent caching. Caching shouldn't be the default, as most web apps don't need it, except for content sites.

  • @eljaz00
    @eljaz00 10 หลายเดือนก่อน

    So noStore() is similar to fetch('...', { cache: 'no-store' }) if you're using something other than fetch!
    Is there also a function to add a revalidation tag to your data fetching function?

    • @WebDevCody
      @WebDevCody  10 หลายเดือนก่อน +1

      Yes there is a unstable cache function where you can pass a custom tag as a second argument to your data and run invalidateTag at a later time if needed