title: 404 errors when serving multiple static sites using NGINX
body: <p>I have a project with the following folder structure</p>
  
  <ul>
  <li><p>public</p>
  
  <ul>
  <li>js</li>
  <li>assets</li>
  <li>index.html</li>
  </ul></li>
  <li><p>event-public</p>
  
  <ul>
  <li>js</li>
  <li>assets</li>
  <li>index.html</li>
  </ul></li>
  <li><p>admin-public</p>
  
  <ul>
  <li>assets</li>
  <li>index.html</li>
  </ul></li>
  </ul>
  
  <p>Each folder has its own set of unique assets (css, images, etc) and their own home page. I've set up my NGINX server to serve all of them from the same address (and proxying to a node server, which works fine).</p>
  
  <pre><code> server {    
      location /api/ {
          proxy_set_header Upgrade $http_upgrade;
          proxy_set_header Connection "upgrade";
          proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
          proxy_set_header Host $host;
          proxy_http_version 1.1;
          proxy_pass http://127.0.0.1:8000/;
      }
      location / {
          root /home/ubuntu/project/public;
          autoindex on;
          try_files $uri $uri/ =404;
  
          # any additional configuration for non-static content
      }
      location /event {
          alias /home/ubuntu/project/event-public;
          autoindex on;
          try_files $uri $uri/ =404;
  
          # any additional configuration for non-static content
      }    
      location /admin {
          alias /home/ubuntu/project/admin-public;
          try_files $uri $uri/ =404;
  
          # any additional configuration for non-static content
      }
  }
  </code></pre>
  
  <p>the public (home website) with the <code>location /</code> is served just fine, and the admin site works too since the most of the JS is in the same directory as the index folder. However, when I try to go to the events page the index.html is able to load just fine, but everything contained in the assets returns a 404. Looking at the console, I see the scripts embedded in index.html are trying to request the server root/whatever (ex. <a href="https://localhost/js/angular.min.js" rel="nofollow noreferrer">https://localhost/js/angular.min.js</a>). my script tags in the event index.html look like this:</p>
  
  <pre><code>&lt;script src="js/angular.min.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>I understand that I could just change this to event/js/angular.min.js, but is there a way to configure NGINX to recognize these paths relative to their location in the folder? I run this on my localhost and it works fine, but for deploying on the server I would rather not have to change these script tags every time.</p>