DEV Community

Russell 👨🏾‍💻
Russell 👨🏾‍💻

Posted on

Deploy a SvelteKit Static Site with a Simple Bash Script

#linux #cicd #svelte #pocketbase

As a full-stack engineer, I often work across both frontend and backend, and deployment pipelines are a key part of the workflow. While modern CI/CD pipelines and cloud-native deployment platforms are essential for large-scale production systems, sometimes a lightweight, controlled deployment approach is the most practical choice.

Here’s a small Linux tutorial showing how to deploy a SvelteKit static site with adapter-static and PocketBase using pure Bash.

Step 1: Build Your Project

Navigate to your project root and build the SvelteKit app:

cd /path/to/project
pnpm run build
Enter fullscreen mode Exit fullscreen mode

Step 2: Archive PocketBase Data

Package your database, migrations, and hooks into a zip file:

cd pocketbase
zip -rq data.zip pb_public pb_migrations pb_hooks
cd ..
Enter fullscreen mode Exit fullscreen mode

Step 3: Define Your Deployment Variables 

SERVER_USER="grace"
SERVER_IP="myserver.com"
REMOTE_DIR="/opt/apps/emr"
PORT="22"
PASSWORD_FILE="./.serverPass"
Enter fullscreen mode Exit fullscreen mode

Step 4: Upload and Extract on Remote Server 

sshpass -f "$PASSWORD_FILE" scp -P "$PORT" pocketbase/data.zip \
  "$SERVER_USER@$SERVER_IP:$REMOTE_DIR"

sshpass -f "$PASSWORD_FILE" ssh -p "$PORT" "$SERVER_USER@$SERVER_IP" "
  unzip -o $REMOTE_DIR/data.zip -d $REMOTE_DIR &&
  rm $REMOTE_DIR/data.zip &&
  systemctl restart emr-service
"
Enter fullscreen mode Exit fullscreen mode

Step 5: Cleanup Local Artifacts 

rm pocketbase/data.zip
Enter fullscreen mode Exit fullscreen mode

Why This Approach Matters

This lightweight Bash workflow highlights some core full-stack engineering skills that recruiters look for:

  • Linux system proficiency: SSH, zip/unzip, file management
  • Deployment automation: Streamlined, repeatable steps
  • Backend service management: Restarting services with systemctl
  • Operational awareness: Minimizing downtime, predictable rollouts
  • Full-stack control: Connecting frontend static assets with backend data

Even a small, self-contained deployment script demonstrates the ability to operate across the full stack — from building frontend assets to managing server-side services.

Full Script Example 

#!/usr/bin/env bash
set -euo pipefail

SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
PROJECT_ROOT="$SCRIPT_DIR/.."

cd "$PROJECT_ROOT"

echo "Building SvelteKit app..."
pnpm run build

echo "Preparing PocketBase data archive..."
cd pocketbase
zip -rq data.zip pb_public pb_migrations pb_hooks
cd ..

SERVER_USER="grace"
SERVER_IP="myserver.com"
REMOTE_DIR="/opt/apps/emr"
PORT="22"
PASSWORD_FILE="$SCRIPT_DIR/.serverPass"

echo "Uploading archive..."
sshpass -f "$PASSWORD_FILE" scp -P "$PORT" pocketbase/data.zip \
  "$SERVER_USER@$SERVER_IP:$REMOTE_DIR"

echo "Extracting on remote server..."
sshpass -f "$PASSWORD_FILE" ssh -p "$PORT" "$SERVER_USER@$SERVER_IP" "
  unzip -o $REMOTE_DIR/data.zip -d $REMOTE_DIR &&
  rm $REMOTE_DIR/data.zip &&
  systemctl restart emr-service
"

echo "Cleaning up local archive..."
rm pocketbase/data.zip

echo "Deployment complete."
Enter fullscreen mode Exit fullscreen mode

Takeaway: Small, well-structured deployment scripts show that you can manage both frontend and backend responsibilities, maintain operational control, and automate production workflows — all critical skills for full-stack engineers.

Top comments (0)