Serving your Angular SPA with Nginx

If you are creating a Single Page Application and you want to serve those static files under a web serier, Nginx is a good option.

Setting up Nginx for serving static files is easy. First of all, let's install Nginx on Ubuntu.

sudo apt update
sudo apt install nginx

Now create a file under <nginx-root>/sites-available/<vhost-file>

server {
    server_name example.com;

    root /var/www/example.com/;

    location / {
        try_files $uri $uri/ /index.html;
    }
}

Now, serve your app from /var/www/example.com/.

# Clone your repo
git clone git@bitbucket.org:example/example-blog.git

cd example-blog

# Install dependencies
npm i

# Build
npm run prod

# Optional. Create the directory from where you will be serving your static files
sudo mkdir /var/www/example.com

# Copy the build files into it
sudo cp ./dist/** /var/www/example.com/ -r

Done.