next js disable ssr

To disable server-side rendering (SSR) in Next.js, you can follow these steps:

  1. Create a custom _app.js file: In your Next.js project, create a new file called _app.js in the root directory (if it doesn't already exist). This file is used to override the default App component provided by Next.js.

  2. Import the necessary dependencies: In the _app.js file, import the App component from next/app and the Component object from react.

javascript import App from 'next/app'; import { Component } from 'react';

  1. Create a custom App component: Define a custom App component that extends the default App component provided by Next.js.

javascript class MyApp extends App { // Your custom implementation }

  1. Disable server-side rendering: Inside the MyApp component, override the render method to disable server-side rendering.

javascript class MyApp extends App { render() { const { Component, pageProps } = this.props; return <Component {...pageProps} />; } }

By returning only the Component with its pageProps, you are effectively disabling server-side rendering.

  1. Export the custom App component: Export the custom MyApp component as the default export of the _app.js file.

javascript export default MyApp;

That's it! By following these steps, you have successfully disabled server-side rendering (SSR) in Next.js.