node.jsnginxsveltesapper

I want to deploy back-end and front-end seperate apps on the same server with nginx


I've created a restful api with nodejs and I'm planning to use sapper/svelte for front-end. In the end, these will be seperate apps and I want to run them on the same server with same domain. Is this approach reasonable? If it is, what should my nginx configuration file look like? If not, what should be my approach?

This my conf for api:

server {
    server_name domain.name;

    location / {
        proxy_pass http://localhost:5000;
        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;
    }
   .
   .
   .
}

Solution

  • Following best pratice your API will be under BASE/api/

    That will allow you to host backend + Frontend on the same server

    server {
        server_name domain.name;
    
        location /api/ {    # Backend
            proxy_pass http://localhost:5000;
            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;
    
            ...
        }
    
        location / {    # Frontend
            root        /app-path/;
            index       index.html;
            try_files   $uri $uri/ /index.html;
    
            ...
        }
    }