Chapter 3: Deploy Hugo Site ke Server
Sekarang kita akan build Hugo site dan upload ke server yang sudah di-setup.
Build Hugo Site
Di komputer lokal Anda, di directory Hugo project:
# Masuk ke Hugo project directory
cd /path/to/your/hugo-site
# Build untuk production
hugo --minify
# Output akan ada di folder ./public
ls public/
Output:
blog/ css/ index.html js/ tutorials/ ...
Folder public/ ini yang akan kita upload ke server.
Upload Methods
Ada 3 cara upload file ke server:
Method 1: SCP (Simple & Direct)
Mac/Linux:
# Upload folder public ke server
scp -r public/* deploy@YOUR_SERVER_IP:/var/www/yourdomain.com/html/
# Contoh:
scp -r public/* deploy@139.59.123.45:/var/www/yourdomain.com/html/
Windows (PowerShell):
scp -r public/* deploy@YOUR_SERVER_IP:/var/www/yourdomain.com/html/
Atau pakai WinSCP (GUI):
- Download WinSCP
- Connect: Host: YOUR_SERVER_IP, User: deploy
- Drag & drop folder
public/*ke/var/www/yourdomain.com/html/
Method 2: Rsync (Recommended - Faster)
Rsync hanya upload file yang berubah:
# Install rsync (jika belum ada)
sudo apt install rsync
# Sync files
rsync -avz --delete public/ deploy@YOUR_SERVER_IP:/var/www/yourdomain.com/html/
# Flags:
# -a : archive mode (preserve permissions)
# -v : verbose (show progress)
# -z : compress during transfer
# --delete : delete files di server yang tidak ada di local
Method 3: Git Deploy (Advanced)
Setup Git repository di server:
Di server:
# Install git
sudo apt install git -y
# Create bare repo
mkdir -p ~/repos/site.git
cd ~/repos/site.git
git init --bare
# Create post-receive hook
cat > hooks/post-receive << 'EOF'
#!/bin/bash
GIT_WORK_TREE=/var/www/yourdomain.com/html
git --work-tree=$GIT_WORK_TREE checkout -f
EOF
chmod +x hooks/post-receive
Di komputer lokal:
# Add remote
git remote add production deploy@YOUR_SERVER_IP:~/repos/site.git
# Push to deploy
git add .
git commit -m "Deploy update"
git push production master
Automated Deploy Script
Buat script untuk automate build & deploy:
deploy.sh:
#!/bin/bash
echo "🏗️ Building Hugo site..."
hugo --minify
if [ $? -eq 0 ]; then
echo "✅ Build successful!"
echo "📤 Uploading to server..."
rsync -avz --delete \
public/ \
deploy@YOUR_SERVER_IP:/var/www/yourdomain.com/html/
if [ $? -eq 0 ]; then
echo "✅ Deploy successful!"
echo "🌐 Site is live at: http://yourdomain.com"
else
echo "❌ Deploy failed!"
exit 1
fi
else
echo "❌ Build failed!"
exit 1
fi
Usage:
# Make executable
chmod +x deploy.sh
# Run deploy
./deploy.sh
Set Correct Permissions
Di server, pastikan permissions benar:
# Set ownership to www-data (nginx user)
sudo chown -R www-data:www-data /var/www/yourdomain.com/html/
# Set directory permissions
sudo find /var/www/yourdomain.com/html/ -type d -exec chmod 755 {} \;
# Set file permissions
sudo find /var/www/yourdomain.com/html/ -type f -exec chmod 644 {} \;
Verify Deployment
1. Check Files
# Di server
ls -la /var/www/yourdomain.com/html/
# Harusnya ada:
# index.html, css/, js/, blog/, tutorials/, dll
2. Test in Browser
Buka http://YOUR_SERVER_IP atau http://yourdomain.com
Harusnya site Anda muncul!
3. Check Nginx Logs
# Access log
sudo tail -f /var/log/nginx/yourdomain.com.access.log
# Error log (kalau ada masalah)
sudo tail -f /var/log/nginx/yourdomain.com.error.log
Optimize Hugo Config for Production
Edit config.toml / hugo.toml:
baseURL = 'https://yourdomain.com/'
languageCode = 'id'
title = 'Your Site Title'
# Production optimization
[minify]
disableCSS = false
disableHTML = false
disableJS = false
disableJSON = false
disableSVG = false
disableXML = false
[imaging]
quality = 85
resampleFilter = "Lanczos"
# Sitemap
[sitemap]
changefreq = 'weekly'
filename = 'sitemap.xml'
priority = 0.5
Setup Automatic Backups
Backup Script
Create di server:
sudo nano /usr/local/bin/backup-site.sh
Content:
#!/bin/bash
# Config
BACKUP_DIR="/home/deploy/backups"
SITE_DIR="/var/www/yourdomain.com/html"
DATE=$(date +%Y%m%d_%H%M%S)
BACKUP_FILE="site_backup_$DATE.tar.gz"
# Create backup directory
mkdir -p $BACKUP_DIR
# Create backup
cd /var/www
tar -czf "$BACKUP_DIR/$BACKUP_FILE" yourdomain.com/html/
# Keep only last 7 backups
cd $BACKUP_DIR
ls -t | tail -n +8 | xargs -r rm
echo "✅ Backup created: $BACKUP_FILE"
# Make executable
sudo chmod +x /usr/local/bin/backup-site.sh
# Test
sudo /usr/local/bin/backup-site.sh
Automate with Cron
# Edit crontab
crontab -e
# Add line (backup setiap hari jam 2 pagi):
0 2 * * * /usr/local/bin/backup-site.sh >> /home/deploy/backup.log 2>&1
Update Workflow
Ketika Anda update content:
# 1. Edit content di local
nano content/blog/new-post.md
# 2. Test locally
hugo server -D
# 3. Build
hugo --minify
# 4. Deploy
./deploy.sh
# atau manual:
rsync -avz --delete public/ deploy@YOUR_SERVER_IP:/var/www/yourdomain.com/html/
CI/CD with GitHub Actions (Optional)
Automate deploy on git push:
.github/workflows/deploy.yml:
name: Deploy Hugo Site
on:
push:
branches: [ main ]
jobs:
deploy:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- name: Setup Hugo
uses: peaceiris/actions-hugo@v2
with:
hugo-version: 'latest'
extended: true
- name: Build
run: hugo --minify
- name: Deploy to Server
uses: easingthemes/ssh-deploy@v2
env:
SSH_PRIVATE_KEY: ${{ secrets.SSH_PRIVATE_KEY }}
REMOTE_HOST: ${{ secrets.REMOTE_HOST }}
REMOTE_USER: ${{ secrets.REMOTE_USER }}
TARGET: /var/www/yourdomain.com/html/
SOURCE: public/
Setup Secrets di GitHub:
- Go to repository Settings
- Secrets → New repository secret
- Add:
SSH_PRIVATE_KEY: Your SSH private keyREMOTE_HOST: Server IPREMOTE_USER: deploy
Troubleshooting
404 Not Found
Penyebab: File tidak ditemukan atau path salah
Check:
# Verify files di server
ls -la /var/www/yourdomain.com/html/
# Check nginx config
sudo nginx -t
# Check logs
sudo tail /var/log/nginx/error.log
CSS/JS Tidak Load
Penyebab: baseURL salah di Hugo config
Solusi:
# hugo.toml
baseURL = 'https://yourdomain.com/' # Pastikan ada trailing slash!
Rebuild:
hugo --minify
Permission Denied saat Upload
Solusi:
# Di server, set ownership ke user deploy
sudo chown -R deploy:deploy /var/www/yourdomain.com/html/
# Atau tambahkan deploy ke www-data group
sudo usermod -aG www-data deploy
Rsync Connection Failed
Check:
- ✅ SSH connection works:
ssh deploy@SERVER_IP - ✅ Path correct
- ✅ Permissions correct
Performance Testing
Test site speed:
# GTmetrix
# Go to: https://gtmetrix.com
# Enter: yourdomain.com
# PageSpeed Insights
# Go to: https://pagespeed.web.dev/
# Enter: yourdomain.com
# Check response time
curl -o /dev/null -s -w 'Total: %{time_total}s\n' http://yourdomain.com
Monitoring Site Uptime
Free monitoring services:
- UptimeRobot - Free, checks every 5 min
- StatusCake - Free tier available
- Pingdom - Free trial
Kesimpulan
Sekarang Anda sudah:
✅ Build Hugo site untuk production ✅ Upload ke server dengan SCP/Rsync ✅ Set correct permissions ✅ Create deploy script ✅ Setup backup automation ✅ Know troubleshooting steps
Di chapter selanjutnya, kita akan setup domain dan SSL/HTTPS!
Previous: ← Chapter 2 - Install Nginx Next: Chapter 4 - Setup Domain & SSL →