CODEWITHSUNDEEP
reactjsnext.js
Minsik Park
Minsik Park

Reputation: 697

how to change NextJS root path page

I am using next js for my toy project.

if nextjs is requested url that is root path, It find page named index.js in the pages folder.

However, I want to show user the page named home.js, not index.js when they request root url.

How can I change it? I guess It can be resolve if I custom next js server. But I want to more simple way. Is it possible?

Upvotes: 1

Views: 9410

Answers (2)

Ayodeji Adeniyi
Ayodeji Adeniyi

Reputation: 11

There should be a standard way, but here's what I did: I cleared the content in my index.js, imported my home.js into it, then I rendered it as its content.

Upvotes: 0

subashMahapatra
subashMahapatra

Reputation: 6857

This is possible without using a custom server, but the caveat is you have to use experimental features redirects or rewrites depending on how you want to build your home.js page.

For example if you want to just redirect the user to /home when they visit the root / path, you can define a redirect rule in next.config.js in the root dir of your project.

// in next.config.js (should be located in the root of your project if not create one)
module.exports = {
  experimental: {
    async redirects() {
      return [
        { source: '/', destination: '/home', permanent: true }, // a permanent redirect
      ];
    },
  },
};

However, if you plan to take your project to production I suggest using a custom server for now, make use of the redirects and rewrites features when they become available in stable branch.

Upvotes: 3

Related Questions