📦 Deploy an Astro.js Site on a Droplet with Nginx + SSL

Jun 13, 2025 • 3 min read

#astro #deployment #nginx #ssl #digitalocean

This tutorial walks step‑by‑step through deploying an Astro.js site to a fresh DigitalOcean Droplet using a static build. You’ll copy the generated files to the server and configure Nginx to serve them efficiently. Optionally, you’ll add HTTPS via Let’s Encrypt (Certbot).

What You Will Build

Generate a static production build of your Astro.js site
Transfer the static files to your server using SCP (or rsync)
Set up Nginx to serve the static site
Optionally configure Nginx as a reverse proxy
Learn how to update your site with new builds

Prerequisites

An Astro.js project set up locally
A DigitalOcean Droplet (Ubuntu 22.04 example)
SSH access to the Droplet
Basic familiarity with Linux commands

Step 1: Build your Astro site

npm run build
# or
yarn build

By default, Astro outputs static files into the dist/ directory:

ls dist

Step 2: Prepare the server

SSH into the Droplet and install Nginx:

ssh root@your_droplet_ip
apt update && apt upgrade -y
apt install -y nginx
systemctl status nginx

Step 3: Transfer static files with SCP (or rsync)

From your local machine (not over SSH), copy your dist contents to the server:

scp -r dist/* root@your_droplet_ip:/var/www/astro-site/

If the directory doesn’t exist yet:

ssh root@your_droplet_ip "mkdir -p /var/www/astro-site"

Alternatively, use rsync (faster incremental sync):

rsync -avz --delete dist/ root@your_droplet_ip:/var/www/astro-site/

Step 4: Configure Nginx to serve the site

Create a new site configuration:

nano /etc/nginx/sites-available/astro-site

Add this (replace yourdomain.com with your domain or use the server IP for testing):

server {
    listen 80;
    server_name yourdomain.com;  # or your server IP

    root /var/www/astro-site;
    index index.html;

    location / {
        try_files $uri $uri/ =404;
    }

    access_log /var/log/nginx/astro-site.access.log;
    error_log  /var/log/nginx/astro-site.error.log;
}

Enable and test the config:

ln -s /etc/nginx/sites-available/astro-site /etc/nginx/sites-enabled/
rm /etc/nginx/sites-enabled/default  # optional
nginx -t
systemctl reload nginx

Step 5: Access your site

Using server IP: http://your_droplet_ip/
Using domain: http://yourdomain.com

You should now see your Astro.js site served by Nginx.

Step 6: Updating your site

Rebuild locally and sync again:

npm run build
scp -r dist/* root@your_droplet_ip:/var/www/astro-site/
# or
rsync -avz --delete dist/ root@your_droplet_ip:/var/www/astro-site/

No Nginx restart is needed for static files.

Optional: Add HTTPS with Certbot (Let’s Encrypt)

apt install -y certbot python3-certbot-nginx
certbot --nginx -d yourdomain.com

Follow the prompts; Certbot will configure Nginx for TLS automatically.

Summary Table

Step	Command or Action
Build Astro static	`npm run build`
Copy files (SCP)	`scp -r dist/* root@your_droplet_ip:/var/www/astro-site/`
Copy files (rsync)	`rsync -avz --delete dist/ root@your_droplet_ip:/var/www/astro-site/`
Edit Nginx config	`nano /etc/nginx/sites-available/astro-site`
Enable site	`ln -s /etc/nginx/sites-available/astro-site /etc/nginx/sites-enabled/`
Test Nginx config	`nginx -t`
Reload Nginx	`systemctl reload nginx`
Install Certbot	`apt install -y certbot python3-certbot-nginx`
Obtain SSL cert	`certbot --nginx -d yourdomain.com`

This straightforward static deployment leverages Nginx’s performance and simplicity. Use rsync for fast updates, and enable HTTPS to protect users and improve SEO.