Next js error 'Unexpected Token <' when using nginx to open a page directly

Question

I am trying to use nginx on my VPS to open a particular page other than index.js (when someone opens the homepage by typing mysite.com in the browser).

Why does next js generate 'uncaught syntax error in console. Unexpected Token <' when trying to achieve that?

Here is the nginx config code:

server {
    server_name mysite.com; # managed by Certbot
        

        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;

        location / {
        # reverse proxy for next server
        proxy_pass  http://127.0.0.1:3000/OtherPage; # your nextJs service and port
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;

        # we need to remove this 404 handling
        # because next's _next folder and own handling
        # try_files $uri $uri/ =404;
    }

    error_page 404 /404.html;
            location = /40x.html {
        }

    error_page 500 502 503 504 /50x.html;
            location = /50x.html {
        }


    listen [::]:443 ssl ipv6only=on;
    listen 443 ssl; 
    
}

However there is no such error when I modify the nginx config file to remove the OtherPage.

proxy_pass  http://127.0.0.1:3000;

It is worth to mention here that OtherPage.js exists in the pages folder of the project. Why this error is happening?