How to disable SSR in Next JS 13 for a single Page / Component

Next JS has become very popular in last few years, and with release of nextjs 13, Now it has become better and faster in so many ways.

Issue with SSR

NextJs Pre renders every page by default, so that our application speed improves, as well as reduction in waterfall.

But when you need browser specific libraries, to work like like the window or localStorage . it will not work, the build will be failed in production.

You may get this type of error, or window is not defined.

While this is an intended behavior, but sometimes we need to disable SSR for a single page or component. Luckily NextJs has provided a way to disable SSR for a single page or component.

Just open your page/component and write -

export const dynamic = 'force-dynamic'

Thats it!

Now next will not pre render this page, and it will work as intended.

for more information you can visit NextJs Docs

Also published on Medium