Tambahkan Situs Web Pertama Anda

Di ServBay, menambahkan situs web baru untuk memulai proyek pengembangan lokal sangatlah mudah dan intuitif. Dokumen ini akan menjelaskan secara detail cara menambahkan situs web pertama Anda di ServBay, termasuk langkah operasional, pilihan konfigurasi penting, dan beberapa tips praktis.

Baik Anda mengembangkan situs berbasis PHP, Node.js, situs statis, atau ingin mengatur reverse proxy maupun pengalihan URL, ServBay memberikan dukungan yang fleksibel.

Gambaran Umum

ServBay dirancang untuk memberikan lingkungan pengembangan lokal yang kuat dan mudah dikelola bagi web developer. Antarmuka grafis yang ramah pengguna (GUI) memudahkan Anda menambah, mengatur, serta mengelola banyak situs web lokal secara praktis. Ikuti langkah-langkah berikut untuk dengan cepat membuat situs web lokal pertama Anda di ServBay dan sesuaikan pengaturannya sesuai kebutuhan proyek.

Prasyarat

Sebelum mulai menambahkan situs web, pastikan bahwa:

• Anda telah berhasil menginstal dan menjalankan aplikasi ServBay di sistem macOS Anda.

Langkah-langkah Menambahkan Situs Web

Berikut langkah detail menggunakan GUI ServBay untuk menambahkan situs web baru:

Langkah 1: Buka Aplikasi ServBay

Pertama, cari ikon ServBay di folder aplikasi macOS Anda, lalu klik ganda untuk membukanya.

Langkah 2: Navigasi ke Antarmuka Pengelolaan Situs

Setelah aplikasi ServBay terbuka, Anda akan melihat antarmuka utama. Pada menu navigasi di sisi kiri, klik opsi bertanda 网站 (Situs). Ini akan membawa Anda ke halaman pengelolaan situs ServBay.

Langkah 3: Mulai Menambahkan Situs Web Baru

Pada halaman manajemen situs, cari dan klik tombol + di pojok kiri bawah. Setelah diklik, sebuah area formulir baru akan muncul di sisi kanan layar untuk memasukkan detail konfigurasi situs web baru Anda.

Langkah 4: Konfigurasi Pengaturan Situs Web

Pada formulir konfigurasi yang muncul, isi atau pilih informasi penting berikut:

1. Nama: Berikan nama yang mudah dikenali untuk situs web lokal Anda. Ini hanya digunakan untuk membantu Anda membedakan dan mengatur konfigurasi situs di dalam ServBay.
2. Domain: Masukkan domain yang ingin Anda gunakan untuk mengakses situs ini secara lokal. Untuk menghindari konflik dengan domain nyata, sangat disarankan menggunakan .demo atau TLD lokal lain yang disediakan ServBay, misalnya servbay.demo atau myproject.servbay.demo. ServBay akan otomatis mengatur DNS lokal sehingga Anda bisa mengakses situs melalui domain ini di browser.
3. Protokol: Pilih protokol yang akan didukung situs Anda. Umumnya, default adalah HTTP/HTTPS, dan ServBay secara otomatis membantu Anda mengatur HTTPS lokal.
4. Metode Permintaan Sertifikat SSL: Atur enkripsi SSL/TLS untuk situs web lokal Anda.
   • ServBay CA: Direkomendasikan untuk pengembangan lokal. ServBay menggunakan PKI bawaannya untuk mengelola dan membuat sertifikat SSL yang diterbitkan oleh root certificate ServBay. Anda hanya perlu mempercayai root certificate (ServBay User CA atau ServBay Public CA) di sistem; Anda kemudian bisa mengakses HTTPS tanpa peringatan di browser.
   • ACME: Jika ingin meniru lingkungan produksi, gunakan protokol ACME (seperti Let's Encrypt, ZeroSSL, Google Trust Services, dll) untuk menerbitkan sertifikat publik yang valid untuk domain lokal Anda (asalkan domain tersebut dapat diakses publik dan mengarah ke ServBay lokal Anda). ServBay mendukung permintaan dan perpanjangan sertifikat otomatis lewat ACME.
5. Jenis Situs: Pilih tipe sesuai stack teknologi proyek Anda:
   • PHP: Untuk proyek PHP seperti WordPress, Laravel, Symfony, dan lainnya. ServBay akan mengonfigurasi server web (Nginx/Apache) bersama PHP-FPM untuk melayani permintaan PHP.
   • Node.js: Untuk aplikasi Node.js. Umumnya, ServBay mengatur reverse proxy guna meneruskan permintaan web ke port yang didengarkan aplikasi Node.js Anda.
   • Statis: Untuk situs web berbasis file statis HTML, CSS, JavaScript, dll. Server web akan langsung melayani file tersebut.
   • Reverse Proxy: Memungkinkan meneruskan permintaan domain atau path tertentu ke alamat atau port lokal/remote lain—sangat berguna bila ingin proxy ke layanan/aplikasi lain.
   • Redirect: Mengalihkan seluruh permintaan dari domain ini ke URL lain.
6. Versi PHP: Jika memilih tipe PHP, Anda harus memilih versi PHP terpasang dan berjalan dari dropdown yang ingin digunakan untuk situs ini. Pastikan versi PHP yang dibutuhkan sudah diinstal melalui pengelola paket ServBay.
7. Aturan Penulisan Ulang URL (Pseudo Statis): Framework modern dan CMS biasanya membutuhkan aturan rewrite URL (agar URL menjadi estetis, misalnya /about bukan /index.php?page=about). ServBay menyediakan preset rules untuk banyak aplikasi populer (seperti Laravel, WordPress, Discuz!, dll) yang bisa langsung dipilih. Jika framework Anda tidak dalam daftar, atau butuh aturan custom, Anda mungkin perlu menyesuaikan konfigurasi web server (Nginx/Apache) secara manual.
8. Direktori Root: Tentukan path fisik file situs Anda. Ini adalah direktori awal tempat server web mencari dan melayani file. Disarankan menyimpan file proyek di direktori default ServBay www, misalnya /Applications/ServBay/www/servbay-demo. Pastikan direktori ini ada dan proses ServBay punya hak baca atasnya.

WARNING

Untuk pengembang yang menggunakan framework (misalnya Laravel), pastikan root direktori Anda diarahkan langsung ke folder public yang berisi index.php, bukan ke root proyek.

Langkah 5: Simpan dan Aktifkan Situs Web

Setelah semua detail sudah diisi dan dicek, klik tombol 添加 (Tambahkan) di bagian bawah formulir untuk menyimpan. ServBay secara otomatis akan menghasilkan dan memuat konfigurasi baru ke web server (mis. Nginx/Apache) dan memperbarui pengaturan DNS lokal.

Jika penyimpanan berhasil, konfigurasi situs baru Anda akan muncul di daftar situs. Anda dapat mengaksesnya dengan cepat melalui ikon browser di pojok kanan atas.

Langkah 6: Manfaatkan Aksi Cepat untuk Mengelola Situs

ServBay menyediakan serangkaian tombol aksi cepat untuk setiap situs di daftar, memudahkan workflow pengembangan lokal Anda:

1. Buka dengan IDE: Langsung buka direktori root situs di editor kode/IDE default yang telah dikonfigurasi.
2. Buka di browser: Langsung buka URL situs di web browser utama Anda.
3. Lihat log situs: Lihat akses dan error log server web yang terkait dengan situs, sangat membantu untuk debugging.
4. Jeda/Jalankan situs: Nonaktifkan atau aktifkan kembali akses ke situs sementara waktu.
5. Hapus situs: Menghapus situs dari konfigurasi ServBay (tidak menghapus file fisik situs).

Contoh Sederhana: Membuat Situs HTML Statis

Untuk memverifikasi apakah situs web pertama Anda sudah diatur dengan benar, Anda dapat mencoba langkah berikut:

1. Ikuti langkah sebelumnya untuk menambah situs misal dengan domain servbay.demo, jenis situs Statis, dan root direktori /Applications/ServBay/www/servbay-demo-static.

2. Buat direktori root ini /Applications/ServBay/www/servbay-demo-static di file system Anda.

3. Di dalamnya, buat file bernama index.html.

4. Buka index.html dengan teks editor lalu tambahkan kode HTML sederhana berikut:

   <!DOCTYPE html>
   <html>
   <head>
       <title>ServBay Static Test</title>
   </head>
   <body>
       <h1>Selamat! Situs ServBay pertama Anda sudah berjalan!</h1>
       <p>Jika Anda melihat halaman ini, berarti ServBay sudah berhasil mengonfigurasi dan melayani situs statis Anda.</p>
   </body>
   </html>

5. Simpan file index.html.

6. Kembali ke antarmuka manajemen situs di ServBay, temukan situs servbay.demo yang baru Anda buat, lalu klik ikon browser di aksi cepat.

7. Browser Anda seharusnya akan membuka http://servbay.demo (atau https://servbay.demo tergantung pengaturan SSL), dan menampilkan isi halaman index.html Anda.

Hal-hal yang Perlu Diperhatikan

• Konflik domain: Hindari menggunakan domain yang berpotensi bertabrakan dengan jaringan lokal atau VPN Anda. .demo adalah pilihan yang aman.
• Izin direktori root: Pastikan user yang menjalankan ServBay (biasanya user Anda sendiri) punya hak akses baca ke folder root situs dan semua file di dalamnya.
• Port yang digunakan: ServBay secara default memakai port standar (HTTP 80, HTTPS 443). Jika port ini dipakai program lain, ServBay mungkin tidak bisa memulai server web atau situs Anda tidak dapat diakses. Periksa dan tutup aplikasi lain yang memakai port-port ini bila perlu.
• Kepercayaan pada ServBay CA: Jika memakai ServBay CA dan ingin akses HTTPS tanpa peringatan di browser, Anda perlu mempercayai ServBay User CA atau ServBay Public CA di macOS. Biasanya dokumen ServBay menyediakan panduan detail langkah ini.

FAQ (Pertanyaan Umum)

• Q: Mengapa situs saya menampilkan HTTP Error 403 - Forbidden atau HTTP Error 404 - File not found?
  • A: Ini adalah kesalahan paling umum yang ditemui pengembang.
  • Pertama, periksa apakah root direktori situs sudah diarahkan dengan benar. Pada framework modern seperti Laravel, Symfony, CakePHP, dsb., demi keamanan dan manajemen proyek, root proyek (tempat file seperti vendor, composer.json, package.json) bukanlah root situs.
  • Jadi Anda harus mengarahkannya ke folder berisi file entry-point sebenarnya seperti (index.php, index.htm, index.html).
  • Beberapa direktori entry-point yang umum: public, web, www, htdocs, wwwroot, webroot, dsb.
• Q: Saya sudah menambahkan situs, tetapi ketika diakses di browser muncul “tidak dapat mengakses situs ini” atau “koneksi ditolak”?
  • A: Cek apakah ServBay berjalan dan status server web (Caddy/Nginx/Apache) normal (lihat di antarmuka utama ServBay).
  • Pastikan domain yang diketik di browser sama persis dengan yang dikonfigurasi di ServBay.
  • Pastikan situs di daftar ServBay dalam keadaan "berjalan" (bukan dijeda).
  • Pastikan path root situs benar dan terdapat file entry-point (misal index.html, index.php).
  • Pastikan tidak ada aplikasi lain yang memakai port 80 atau 443.
• Q: Situs PHP saya tampak tidak berjalan sesuai harapan, misal hanya menampilkan layar putih atau mendownload file?
  • A: Pastikan Anda memilih versi PHP yang benar di konfigurasi situs, dan bahwa versi tersebut sudah diinstal via pengelolaan paket ServBay serta sedang berjalan.
  • Cek hak akses file di direktori root situs.
  • Lihat log situs (dengan aksi cepat) apakah ada error PHP.
  • Pastikan proyek Anda memiliki file index.php atau file lain yang diset sebagai file index oleh konfigurasi ServBay.
• Q: Saya telah mengaktifkan HTTPS, tapi browser memperingatkan sertifikat tidak valid?
  • A: Jika menggunakan ServBay CA, Anda wajib mempercayai root certificate ServBay di OS atau browser. Lihat panduan resmi ServBay tentang cara mempercayai CA.
  • Jika memakai ACME, pastikan domain Anda sudah diarahkan dengan benar ke ServBay dan sertifikat sudah sukses dipasang. Lihat log ServBay untuk detail proses ACME.
• Q: Aturan rewrite URL tidak berfungsi, halaman tidak bisa diakses?
  • A: Pastikan Anda telah memilih aturan rewrite URL yang sesuai dengan framework atau aplikasi Anda.
  • Jika memakai Apache, pastikan file .htaccess ada di root situs/subfolder dan konfigurasi Apache ServBay mengizinkan penggunaan .htaccess.
  • Jika menggunakan Nginx/Caddy, aturan rewrite biasanya diatur dalam konfigurasi yang dihasilkan ServBay. Cek aturan apakah sudah diload dengan benar.

Kesimpulan

Dengan mengikuti langkah-langkah pada artikel ini, seharusnya Anda sudah berhasil menambahkan dan menjalankan situs web pertama Anda di lingkungan pengembangan lokal ServBay. Fitur manajemen situs yang kuat, opsi konfigurasi fleksibel (seperti sertifikat SSL, jenis situs, versi PHP, penulisan ulang URL), dan tombol aksi cepat yang praktis akan sangat meningkatkan efisiensi workflow pengembangan lokal Anda. Jelajahi juga fitur ServBay lainnya seperti pengelolaan paket dan database untuk membangun workflow pengembangan lokal yang lebih optimal.