search

Skyleen77 / next-nprogress-bar

NProgress integration on Next.js compatible with /app and /pages folders
https://next-nprogress-bar.vercel.app
315 stars 24 forks source link

Is there a reason for making the whole layout client side? #15

Closed tomelliot closed 1 year ago

tomelliot commented 1 year ago

More of a question than an issue - is there a reason to make the whole layout.tsx "use client", rather than just the ? That seems to defeat the purpose of NextJS's server side rendering.

I've embedded the progress bar in a component, which is marked "use client" and then imported into the layout.tsx, so the layout can stay server side. It seems to be working - any reasons why that wouldn't work?

Skyleen77 commented 1 year ago

The component must be used in a "use client" because it uses react hooks (which only work on the client side).

The solution I proposed in the readme is to create a "use client" provider that you add to your layout.tsx, without having to put "use client" in your layout.tsx.

I hope I was able to answer your question.

tomelliot commented 1 year ago

Oh I see - I misunderstood your documentation here, my bad. I just made a little PR if you're open to suggestions.