Loading....

Deploying Next.JS app in Godaddy shared hosting correctly.

Published on:
Modified on:

Hosting a react app (next.js) in Godaddy Shared hosting can be a confusing job. Specially if you are using server side rendering. Godaddy shared hosting (in most cases) does not allow node apps.

But we can take advantage of the Static generation feature. Using Static generation we can generate a static html site. You can follow the following steps:

  • Go to package.json
  • Under Scripts object add a new key value pair like this
    "genetate": "next build && next export"

  • then, navigate to next.config.js

  • Add the following code:

/** @type {import('next').NextConfig} */
const nextConfig = {
  reactStrictMode: true,
  output: 'export',
  distDir: 'dist',
  trailingSlash: true,
  assetPrefix: '.',
}

module.exports = nextConfig;
Enter fullscreen mode Exit fullscreen mode

then from your terminal run the command:
npm run generate

Important thing to note here is the trailingSlash: true,
In godaddy if you navigate the site using the say navigation bar it works but if you reload a page other than the home page
for example /about/
it looks for the about directory which does not exist. So with trailingSlash: true, this command your pages will go on their respective directory.