Deploy static site to VPS

An easy way to deploy files via the terminal with rsync to the server.

This is an explanation on how to deploy static files to the server with one single terminal command. Their are two prerequisites, ssh into the server without a password and on local and the server rsync must be installed.

1. Setup SSH

To setup a ssh key pair the following must be done. Into the terminal enter:

$ ssh-keygen

This creates a .ssh/id_rsa file (the ssh key). The generated key must be uploaded to the server.

$ ssh-copy-id -i ~/.ssh/id_rsa.pub {USER}@{DOMAIN}

2. Install rsync

Install rsync on a debian server

$ sudo apt-get install rsync

Install rsync on a local machine (Linux)

Mac OS ships with rsync. If you don't have it installed it can be done via Homebrew.

# Install homebrew
$ /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)"

# Install rsync
$ brew install rsync

3. Create deployment script

Next we're going to create the deployment script that is executable via the terminal. Create a file called 'deploy' inside the root of your project directory. Below you can find the deploy example file to get you going.

In the example we're using Eleventy as the static site generator and upload the files from the dist/ folder. You can use this script with any static files or SSG (static site generator). Replace npx eleventy build with the build command of the SSG you are using.

Replace {USER}, {DOMAIN} and {DIR} with your credentials. And change dist/ to the folder where your production files are created.

#!/bin/sh
USER={USER}
HOST={DOMAIN}
DIR={/path/to/root/of/project}

npx eleventy build && rsync -avz --delete dist/ ${USER}@${HOST}:${DIR}

exit 0 

Explanation of the rsync command, -a = all files, -v = verbose all files, -z = zip all files to make the transfer faster and --delete is inserted to delete all files from the server that were deleted locally.

After the creation of the deploy file we need to make it executable. Use the following command.

# Make the deploy script executable
$ chmod +x deploy

4. Deploy static website to the server

The next and latest step is deploying your website or updates to the world. Only one command is needed and that is calling the create bash script.

# Execute the deploy script to deploy the files to the server
$ ./deploy

Goodluck and have fun.