Situs statis: dari file ke domain

Situs statis adalah kumpulan file siap pakai: HTML, CSS, gambar, hasil build frontend. Situs ini tidak memerlukan PHP maupun basis data, sehingga berjalan nyaman bahkan di VDS-1 dan mampu menangani lalu lintas yang cukup besar: hingga 500 Mbit/s.

Di mana menaruh file

Buat direktori terpisah untuk setiap situs:

mkdir -p /var/www/example.ru
chown -R www-data:www-data /var/www/example.ru

Unggah dari mesin lokal Anda dengan scp atau rsync biasa:

scp -r ./dist/* root@YOUR_ADDRESS:/var/www/example.ru/
rsync -avz --delete ./dist/ root@YOUR_ADDRESS:/var/www/example.ru/

rsync --delete menghapus file di server yang sudah tidak ada lagi di hasil build. Tanpa opsi itu, potongan JS lama akan menumpuk selama bertahun-tahun.

Melayani melalui web server

Konfigurasi Nginx minimal:

server {
    listen 80;
    server_name example.ru;
    root /var/www/example.ru;
    index index.html;

    location / {
        try_files $uri $uri/ /index.html;
    }

    location ~* \.(js|css|png|jpg|svg|woff2)$ {
        expires 30d;
        add_header Cache-Control "public, immutable";
    }
}

Baris try_files ... /index.html diperlukan untuk aplikasi single-page yang dibangun dengan React, Vue, dan Svelte: tanpa itu, membuka langsung /about akan mengembalikan 404.

Selanjutnya pasang sertifikat Let's Encrypt, dan situs pun terbuka melalui HTTPS.

Domain

Di panel domain, buat record A yang mengarah ke alamat publik mesin (tab "Overview" di /hosting/vds/m/<id>) dan record yang sama untuk www. Periksa:

dig +short example.ru

Record dapat memerlukan waktu hingga beberapa jam untuk menyebar. Selama menunggu, situs dapat diakses melalui alamat mesin.

Memperbarui tanpa downtime

Jangan mengunggah file langsung ke direktori yang sedang aktif — pengunjung bisa saja melihat situs yang belum selesai dibangun. Build di direktori terpisah lalu ganti symlink-nya:

rsync -avz ./dist/ /var/www/releases/$(date +%s)/
ln -sfn /var/www/releases/1724400000 /var/www/example.ru-current
systemctl reload nginx

root pada konfigurasi kemudian mengarah ke /var/www/example.ru-current.

Kesalahan umum

Sebaiknya build frontend secara lokal lalu unggah dist yang sudah jadi. Di VDS-1 dengan memori 2 GB, build proyek besar bisa gagal karena kekurangan memori.