Revision history [back]

Yes, it is possible to utilize Server-side rendering (SSR) in NextJS 13 in a location other than the recently introduced "app" directory. NextJS allows developers to configure the location of the file responsible for server-side rendering using the serverRuntimeConfig option in the Next.js configuration file (next.config.js).

For example, if you want to create a custom SSR file named custom-ssr.js in the root directory of your project, you can add the following lines of code to your next.config.js file:

module.exports = {
  serverRuntimeConfig : {
    // Point to the custom SSR file location
    mySsr: './custom-ssr.js',
  },
}

After that, you can use the mySsr key to reference the custom SSR file anywhere in your NextJS application.

import { getServerSideProps } from 'next';
import getConfig from 'next/config';

const { serverRuntimeConfig } = getConfig();

export const getServerSideProps = async () => {
  const { mySsr } = serverRuntimeConfig;
  // Call the custom SSR function
  const result = await mySsr();
  return {
    props: {
      data: result,
    },
  };
};

By using this approach, you can easily organize application files in a way that is more suitable for your project requirements.