0

I have 2 apps.

App1 is a ReactJS single page app and I want it as a homepage at www.mydomain.com

App2 has a nodejs back-end exposing graphql APIs + a ReactJs front-end and I want this app's homepage to be rooted at www.mydomain.com/app2

Since app2 has multiple pages, I want them to be available at www.mydomain.com/app2/page1, www.mydomain.com/app2/page2, etc.

Here is how I deployed these 2 apps:

sudo pm2 serve /var/www/mydomain.com/app1 --spa 
sudo pm2 start /var/www/mydomain.com/app2/backend/index.js 
cd /var/www/mydomain.com/app2/frontend ; sudo pm2 start npm -- run "prod"

App1 runs at port 8082

App2 back-end runs at port 4000

App2 front-end runs at port 3003

My Nginx config file looks like this:

server {

        root /var/www/mydomain.com/html;
        index index.html index.htm index.nginx-debian.html;
        server_name mydomain.com www.mydomain.com;

        location / {
                try_files $uri $uri/ =404;
        }

        location /app2 {
                proxy_pass http://localhost:3003;
        }

        location /graphql {
                proxy_set_header   X-Forwarded-For $remote_addr;
                proxy_set_header   Host $http_host;
                proxy_pass         http://localhost:4000/graphql;
                proxy_http_version 1.1;
                proxy_set_header   Upgrade $http_upgrade;
                proxy_set_header   Connection "upgrade";
        }
}

App1 is displaying as expected at www.mydomain.com.

Only the homepage of App2 is displaying at www.mydomain.com/app2, but navigating to any other page leads to a 404 error.

I understand with my current configuration, Nginx is looking for App2's pages in the root directory of App1 and doesn't find them. Since App2 is running with npm and doesn't have a an index.html file in its build folder, I cannot get Nginx to look for an index.html file for App2.

What is the right way to get my two applications to work on this domain?

Fabian
  • 229
  • 3
  • 8
  • Instead of using subdir, why don't you use host on same domain? i mean `www.mydomain.com` for static `app.mydomain.com` for front end and `api.mydomain.com` for back end? – Alaindeseine Aug 12 '22 at 12:53
  • I will consider doing that if there is no better solution to the problem, but it wouldn't be ideal. App2 is a larger website that has an older code base. We want to keep it and replace it over time with App1 which is a more modern website. The first step is to have App1 as the homepage and App2 on all other subdir. As we build additional pages for App1 we will phase out pages for App2. – Fabian Aug 12 '22 at 15:57

0 Answers0