Is it possible for me to add the second frontend?

[AkihiroIna]

I need to integrate with two next.js frontend.

one is for regular user and other is for admin.

The two frontends are separated, and one is on 3000 and other is on 3001

I need to use 3001 when I redirect to /admin

How can I solve this problem?

[danialkeimasi]

To integrate with two separate Next.js frontends, you can utilize a reverse proxy. Here is an example using Nginx:

1. Ensure that your Next.js servers are running on separate ports. Let's assume the regular user frontend is on port 3001, and the admin frontend is on port 3002.

2. In your admin Next.js instance, configure the basePath property in the next.config.js file. This property allows you to set a base path for your admin frontend, which will be used in the routing.

   // next.config.js
   module.exports = {
    basePath: '/admin',
   };

   By setting the basePath to /admin, all the admin routes will have the /admin prefix.

3. Configure Nginx to act as a reverse proxy for the two frontends. Here's an example Nginx configuration:

   http {
      server {
          listen 3000;
   
          location /admin/ {
              proxy_pass http://localhost:3002/admin/;
          }
   
          location / {
              proxy_pass http://localhost:3001/;
          }
      }
   }

   In this configuration, requests to /admin will be proxied to the admin frontend running on port 3002. For all other routes, Nginx will proxy the requests to the regular user frontend running on port 3001.

Now, you can just use 3000 with django-nextjs like a usual Next.js app.

Please note that I have wrote this answer on the fly and I didn't test it. So this answer provides a general guideline, and you may need to adapt it based on your specific setup and requirements.