ServBay

Bahasa Indonesia

English
简体中文
繁體中文
Español
العربية
Português
Русский
日本語
Deutsch
Français
Tiếng Việt
Türkçe
Italiano
हिन्दी
Bahasa Melayu
Polski
Nederlands
Українська
ไทย
한국어

Bahasa Indonesia

English
简体中文
繁體中文
Español
العربية
Português
Русский
日本語
Deutsch
Français
Tiếng Việt
Türkçe
Italiano
हिन्दी
Bahasa Melayu
Polski
Nederlands
Українська
ไทย
한국어

Appearance

Menambahkan Website File Statis ​

ServBay adalah alat lingkungan pengembangan web lokal yang kuat, mendukung berbagai bahasa dan database. Selain website dinamis, ServBay juga sangat cocok untuk hosting dan pengujian website file statis, misalnya halaman web sederhana atau aplikasi frontend yang dibangun dengan HTML, CSS, dan JavaScript.

Dokumen ini akan memandu Anda menambahkan dan mengonfigurasi website file statis di ServBay.

Gambaran Umum ​

Website file statis terdiri dari file yang langsung dilayani oleh web server, tanpa menjalankan skrip sisi server (seperti PHP, Node.js, Python, dll). Jenis website ini biasanya mencakup halaman HTML, stylesheet CSS, file JavaScript, gambar, font, dan aset statis lainnya.

Dengan ServBay untuk hosting website statis secara lokal, Anda dapat dengan mudah melakukan pengembangan, debugging, dan pengujian—terutama saat perlu mensimulasikan akses domain seperti di lingkungan produksi, koneksi HTTPS, atau pengujian CORS (Cross-Origin Resource Sharing).

Kegunaan ​

  • Pengembangan dan pengujian proyek frontend murni (HTML/CSS/JS).
  • Hosting dokumentasi statis atau website blog.
  • Pengujian respons server web (Caddy/Nginx) terhadap file statis.
  • Mensimulasikan domain produksi dan akses HTTPS secara lokal.
  • Menguji hasil build framework frontend (seperti React, Vue, Angular).

Prasyarat ​

  • Anda sudah berhasil menginstal dan menjalankan ServBay di sistem macOS.
  • Anda sudah memiliki file website statis yang akan didesain.

Langkah-langkah ​

Ikuti langkah berikut untuk menambahkan website file statis Anda di ServBay:

Langkah 1: Siapkan File Website Anda ​

Pastikan semua file website statis Anda (misal index.html, style.css, script.js, dll) sudah terkumpul di satu folder terpisah.

Disarankan membuat direktori website Anda di root website ServBay default /Applications/ServBay/www, agar mudah tertata. Misalnya, jika Anda ingin membuat website bernama my-static-site, buat folder my-static-site di /Applications/ServBay/www/ dan taruh semua file website ke dalamnya.

bash
# Membuat direktori contoh di Terminal
mkdir -p /Applications/ServBay/www/servbay-static-demo
cd /Applications/ServBay/www/servbay-static-demo

# Membuat file index.html sederhana
echo '<!DOCTYPE html>
<html lang="zh-Hans">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Contoh Website Statis ServBay</title>
    <style>
        body { font-family: sans-serif; text-align: center; margin-top: 50px; }
        h1 { color: #333; }
    </style>
</head>
<body>
    <h1>Selamat! Konfigurasi website statis ServBay berhasil!</h1>
    <p>Anda sedang mengakses halaman statis lokal ini melalui ServBay.</p>
</body>
</html>' > index.html

# Struktur file Anda kini seperti ini:
# /Applications/ServBay/www/servbay-static-demo/index.html

Langkah 2: Tambahkan Website di ServBay ​

  1. Buka aplikasi ServBay.
  2. Pada menu navigasi sebelah kiri, klik Website (Catatan: pada versi lama mungkin tertulis "Host", pada versi baru sudah menjadi "Website").
  3. Di bagian bawah daftar website, klik tombol Tambah. Jendela konfigurasi akan muncul.

Langkah 3: Atur Pengaturan Website ​

Pada jendela konfigurasi yang muncul, isi atau pilih informasi berikut:

  • Domain: Masukkan domain yang ingin Anda gunakan untuk mengakses website ini secara lokal. Disarankan menggunakan domain dengan akhiran .servbay.demo, misalnya static.servbay.demo atau my-static-site.servbay.demo. ServBay secara otomatis menangani resolving domain .servbay.demo secara lokal, jadi Anda tidak perlu mengatur hosts file secara manual.
    • Penjelasan: Penggunaan domain .servbay.demo menghindari bentrok dengan domain online sungguhan, dan DNS Resolver bawaan ServBay memastikan domain tetap diarahkan ke komputer lokal Anda.
  • Path (Jalur): Klik ikon folder di sebelah kanan, lalu pilih direktori file website yang dibuat pada Langkah 1, misal /Applications/ServBay/www/servbay-static-demo/.
    • Penjelasan: Path menunjukkan root direktori file website pada web server (Caddy/Nginx), juga dikenal sebagai Document Root. Saat Anda mengakses http://static.servbay.demo/, server akan mencari file index.html atau homepage lainnya di direktori ini. Pastikan path Anda menunjuk ke folder yang berisi file website, bukan file individual (seperti index.html).
  • Port: Biasanya cukup gunakan default. Port HTTP default adalah 80 dan HTTPS biasanya 443. Jika perlu menggunakan port khusus, Anda bisa atur di sini.
  • Web Server: Pilih web server yang ingin digunakan. Untuk website statis, Caddy dan Nginx adalah pilihan sangat baik.
    • Caddy: Konfigurasi sangat mudah, mendukung HTTP/2 dan HTTPS otomatis (bersama ServBay User CA), menjadi rekomendasi utama dari ServBay.
    • Nginx: Sangat powerful, fleksibel dalam konfigurasi, umum digunakan di server produksi.
    • Cukup pilih salah satu.
  • PHP Version: Tidak diperlukan untuk website statis. Pilih None.
  • Node.js Version: Tidak diperlukan untuk website statis. Pilih None.
  • Python Version: Tidak diperlukan untuk website statis. Pilih None.
  • Go Version: Tidak diperlukan untuk website statis. Pilih None.
  • Java Version: Tidak diperlukan untuk website statis. Pilih None.
  • SSL: Jika ingin mengakses website statis lokal Anda melalui HTTPS, centang opsi ini. ServBay akan otomatis mengonfigurasi sertifikat SSL tepercaya lokal menggunakan CA User ServBay—memudahkan pengujian fitur-fitur HTTPS.
  • CORS: Jika website statis Anda memerlukan Cross-Origin Resource Sharing (misal, untuk memuat font atau data API dari domain lokal lain), centang opsi ini dan lakukan konfigurasi sesuai kebutuhan. ServBay mendukung pengaturan header CORS untuk setiap website.

Langkah 4: Simpan dan Terapkan Perubahan ​

  1. Setelah memasukkan semua pengaturan, klik tombol Simpan di bagian bawah jendela.
  2. Kembali ke daftar website ServBay. Anda akan melihat entri website baru yang barusan dibuat.
  3. Klik tombol Terapkan Perubahan di bagian atas daftar website.
    • Penjelasan: Tombol Terapkan Perubahan membuat ServBay memuat ulang file konfigurasi web server (Caddy/Nginx), sehingga pengaturan website baru langsung aktif. Ini langkah krusial, tanpa ini situs yang baru ditambahkan belum bisa diakses.

Verifikasi Pengaturan ​

Setelah konfigurasi disimpan dan perubahan diterapkan, buka browser Anda dan akses domain yang tadi Anda input (misal http://static.servbay.demo atau https://static.servbay.demo jika SSL diaktifkan).

Jika tidak ada masalah, Anda akan melihat isi website statis Anda—misalnya halaman index.html contoh pada langkah sebelumnya.

Catatan ​

  • Pastikan Path diatur ke root direktori file website Anda.
  • Setiap kali menambah, mengubah, atau menghapus konfigurasi website, Anda wajib klik tombol Terapkan Perubahan agar perubahan berlaku.
  • Untuk website statis, mengatur bahasa server-side (PHP, Node.js, dll) ke None merupakan best practice, agar menghindari penggunaan resource yang tidak diperlukan serta risiko keamanan.
  • Jika website tidak dapat diakses, cek apakah ServBay sedang berjalan, periksa status web server (Caddy/Nginx), dan pastikan domain di browser sama persis dengan yang dikonfigurasi ServBay.

FAQ (Pertanyaan yang Sering Diajukan) ​

T: Kenapa saat mengunjungi domain terkonfigurasi saya melihat “Website Tidak Dapat Diakses” atau “Server Tidak Ditemukan”?

J:

  1. Pastikan aplikasi ServBay sedang berjalan.
  2. Pastikan sudah klik Terapkan Perubahan di ServBay.
  3. Periksa apakah nama domain di browser 100% sama dengan yang dikonfigurasi di ServBay (termasuk awalan http:// atau https://).
  4. Pastikan Path mengarah ke direktori file website dengan benar.
  5. Cek file log ServBay, biasanya ada detail error lebih lanjut.

T: Mengapa setelah mengatur path, yang muncul daftar direktori dan bukan file index.html saya?

J: Ini biasanya karena di direktori root website tidak ada file halaman utama (misal index.html). Pastikan di root website Anda ada file bernama index.html (atau file default lainnya yang didukung web server), dengan nama dan ekstensi benar (sensitif terhadap huruf kapital/kecil).

T: Bisakah saya mengaktifkan HTTPS untuk website statis lokal?

J: Tentu! Aktifkan opsi SSL di konfigurasi ServBay. ServBay akan menggunakan User CA bawaannya untuk menghasilkan serta memercayai sertifikat SSL domain lokal, sehingga Anda bisa mengakses website secara HTTPS di lingkungan lokal.

Kesimpulan ​

Dengan ServBay, Anda dapat dengan mudah menambah dan mengelola website file statis secara lokal—baik itu halaman HTML sederhana maupun hasil build frontend yang kompleks. Manfaatkan fitur manajemen website, resolusi domain lokal, serta dukungan SSL ServBay untuk memaksimalkan efisiensi pengembangan dan pengujian frontend Anda.