Static Sites

A static site serves plain, unchanging files from a folder on the droplet; front end builds or plain html.

Content Directory

As the communal ‘git’ user,

create a directory to hold this content /home/git/my-site

 mkdir ~/my-site

create simple test page

vi ~/my-site/index.html

<html>
    <head>
        <title>Welcome to your_domain!</title>
    </head>
    <body>
        <h1>Success!  The your_domain server block is working!</h1>
    </body>
</html>

If following /var/www convention (simplifies file permissions management)

create symbolic link providing site content from /home/git/my-site to /var/www/my-site.root-domain.ca
grant all users write + execute permissions to the symlink

sudo ln -s /home/git/my-site /var/www/my-site.root-domain.ca
sudo chmod 755 /var/www/my-site.root-domain.ca

Nginx¹

create and populate corresponding nginx site configuration file (requires sudo)

sudo vi /etc/nginx/sites-available/my-site.root-domain.ca

server {
  root /var/www/my-site.root-domain.ca;
  error_page 404 /404.html;
  index index.html;
  
  server_name my-site.root-domain.ca www.my-site.root-domain.ca;
  
  if ($host = www.my-site.root-domain.ca) {
    return 301 https://my-site.root-domain.ca$request_uri
  } #redirect www.my-site.root-domain.ca to my-site.root-domain.ca secured

  location / {
    try_files $uri $uri.html $uri/index.html =404
  }
  
  location /404.html {
    internal;
  }
}

create symbolic link to /etc/nginx/sites-enabled, enabling site

sudo ln -s /etc/nginx/sites-available/<sitename> /etc/nginx/sites-enabled/<sitename>

check for syntax errors in your nginx config

sudo nginx -t

restart nginx to enable your changes

sudo systemctl restart nginx

HTTPs configuration

In order to serve your site to a new domain (or subdomain) securely over the internet (https), you’ll need to set up ssl certificates. Before that, you’ll need to add DNS record*(s)* pointing to the droplet through the relevant registar.

add an A record for each desired subdomain site, www.site, etc, where the final address is site.bci4kids.ca with a value of the droplet’s IPv4 address: 146.190.153.1
- note that DNS changes can have a delay before propogating
run certbot to issue and automatically renew certificates for the desired domains
- this will automatically add the certificates to your nginx config

sudo certbot --nginx -d <site>.bci4kids.ca -d www.<site>.bci4kids.ca

certbot will automatically renew certificates for the provided domains when they are close to expiry, notifying a provided email if this renewal fails. To change the reminder email run:

sudo certbot update_account --email <email address>

verify nginx config

sudo nginx -t

restart nginx to enable changes

sudo systemctl restart nginx

CI/CD

Repository setup will differ depending on your desired build process. If you are pushing built files, you could simply initialize the content directory as a repository to push new builds to from a script.

If building on the droplet itself,

create a separate directory for the repository
initialize it as a bare repository (only tracking, no files)

mkdir ~/my-site.git
cd my-site.git
git init --bare

edit template post-receive hook to build new content when changes are pushed

vi hooks/post-receive

Post-Receive Hook Example²

Hugo is used as an example build tool. See Wiki for another example

#!/bin/bash

WORK_TREE=$HOME/my-site-worktree/
GIT_DIR=$HOME/my-site.git
DESTINATION=$HOME/my-site

echo "Changes pushed, deploying..."

if [[ ! -d $WORK_TREE ]]; then
    mkdir $WORK_TREE || exit 1
fi

echo "Populating source files..."
git --work-tree=$WORK_TREE --git-dir=$GIT_DIR checkout -f || exit 1

cd $WORK_TREE
echo "Rebuilding..."
hugo -d $DESTINATION --cleanDestinationDir || exit 1

cd ..
echo "Cleaning build files..."
rm -rf $WORK_TREE || exit 1

Static Sites

Content Directory

Nginx1

HTTPs configuration

CI/CD

Post-Receive Hook Example2

References

Nginx¹

Post-Receive Hook Example²