Tambah Laman Web Pertama Anda

Menambah laman web baharu untuk memulakan projek pembangunan web lokal anda di ServBay adalah mudah dan intuitif. Dokumen ini akan menerangkan secara terperinci cara menambah laman web pertama anda dalam ServBay, termasuk langkah-langkah, pilihan konfigurasi penting, dan beberapa tip praktikal.

Sama ada anda membangun laman PHP, Node.js, laman web statik, atau ingin menubuhkan reverse proxy atau redirect, ServBay menyediakan sokongan yang fleksibel.

Gambaran Umum

ServBay direka untuk memberikan pembangun web persekitaran pembangunan lokal yang berkuasa dan mudah diurus. Antaramuka grafik (GUI) yang mesra pengguna membolehkan anda menambah, mengkonfigurasi, dan mengurus banyak laman web lokal dengan mudah. Dengan mengikuti langkah-langkah di bawah, anda dapat mencipta laman web lokal pertama anda dengan pantas di ServBay dan menyesuaikan tetapan mengikut keperluan projek.

Prasyarat

Sebelum mula menambah laman web, pastikan:

• Anda telah memasang dan memulakan aplikasi ServBay dengan jayanya pada sistem macOS anda.

Langkah-langkah Menambah Laman Web

Berikut adalah langkah-langkah terperinci untuk menambah laman web baharu menggunakan GUI ServBay:

Langkah 1: Buka Aplikasi ServBay

Mula-mula, cari ikon ServBay dalam folder aplikasi macOS anda dan klik dua kali untuk membuka aplikasi tersebut.

Langkah 2: Navigasi ke Antara Muka Pengurusan Laman Web

Setelah aplikasi ServBay dimulakan, anda akan melihat muka utama. Dalam menu navigasi di sebelah kiri, klik pada pilihan bertanda 网站 (Laman Web). Ini akan membawa anda ke halaman pengurusan laman web ServBay.

Langkah 3: Mula Tambah Laman Web Baharu

Dalam halaman pengurusan laman web, cari dan klik butang + di bahagian bawah kiri halaman. Selepas diklik, sebuah borang konfigurasi baharu akan muncul di sebelah kanan untuk memasukkan maklumat konfigurasi laman web.

Langkah 4: Konfigurasi Tetapan Laman Web

Dalam borang konfigurasi laman web yang baru muncul, anda perlu mengisi atau memilih maklumat penting berikut:

1. Nama: Tetapkan nama yang mudah dikenali untuk laman web lokal anda. Ini hanya digunakan untuk pengurusan laman dalam ServBay.
2. Domain: Masukkan domain yang anda mahu gunakan untuk mengakses laman web secara lokal. Bagi mengelak konflik dengan domain sebenar dunia nyata, sangat disarankan menggunakan .demo atau TLD lokal lain yang disokong oleh ServBay, seperti servbay.demo atau myproject.servbay.demo. ServBay secara automatik mengurus penyelesaian DNS lokal supaya boleh diakses melalui pelayar.
3. Protokol: Pilih protokol yang disokong laman web. Biasanya HTTP/HTTPS dipilih secara lalai dan ServBay akan menguruskan tetapan HTTPS lokal tanpa perlu tetapan manual.
4. Kaedah Permohonan Sijil SSL: Konfigurasi enkripsi SSL/TLS laman web lokal anda.
   • ServBay CA: Disyorkan untuk pembangunan lokal. ServBay secara automatik menjana dan mengurus sijil SSL yang ditandatangani oleh Root Certificate ServBay melalui PKI terbina dalam. Anda cuma perlu mempercayai root certificate ServBay dalam sistem anda (ServBay User CA atau ServBay Public CA) supaya boleh akses HTTPS tanpa amaran di pelayar.
   • ACME: Sekiranya anda mahu mensimulasikan persekitaran produksi, gunakan protokol ACME (seperti Let's Encrypt, ZeroSSL, Google Trust Services dsb.) untuk mendaftar sijil awam sekiranya domain boleh diakses secara awam dan menunjuk ke instance lokal ServBay. ServBay menyokong permohonan automatik dan pembaharuan sijil melalui ACME.
5. Jenis Laman Web: Pilih jenis mengikut stack teknologi projek anda:
   • PHP: Untuk projek berasaskan PHP seperti WordPress, Laravel, Symfony, dsb. ServBay akan konfigurasi pelayan web (Nginx atau Apache) bersama PHP-FPM untuk memproses permintaan PHP.
   • Node.js: Untuk aplikasi Node.js. ServBay biasanya menyiapkan reverse proxy yang mengalihkan permintaan web ke port aplikasi Node.js anda.
   • Statik: Untuk laman web berasaskan HTML, CSS, JavaScript tanpa backend – pelayan web terus menyajikan fail statik.
   • Reverse Proxy: Benarkan anda mengalihkan domain atau path tertentu ke alamat/port lokal atau jauh lain. Berguna untuk proksi ke servis atau aplikasi lain.
   • Redirect: Mengalihkan semua permintaan ke domain ini ke URL lain.
6. Versi PHP: Sekiranya jenis laman memilih PHP, anda perlu pilih salah satu versi PHP yang telah dipasang & sedia dijalankan menerusi pengurusan pakej ServBay.
7. Peraturan Penulisan Semula URL (Pseudo-Static): Kebanyakan rangka kerja web atau CMS moden menggunakan peraturan rewrite supaya struktur URL lebih cantik (contoh: /about dan bukan /index.php?page=about). ServBay menyediakan pilihan peraturan rewrite pra-set untuk aplikasi popular (seperti Laravel, WordPress, Discuz! dll.) anda boleh terus pilih guna. Jika aplikasi anda tidak tersenarai, anda perlu tambah peraturan sendiri dalam fail konfigurasi pelayan web (Nginx atau Apache).
8. Root Directory: Tetapkan laluan fizikal fail laman web. Ini direktori permulaan di mana pelayan web akan mencari/menyajikan fail. Disarankan simpan fail projek dalam direktori www lalai ServBay seperti /Applications/ServBay/www/servbay-demo. Pastikan direktori ini wujud dan proses ServBay mempunyai keizinan membaca.

WARNING

Bagi pembangun yang menggunakan rangka kerja (seperti Laravel), pastikan anda tetapkan root directory ke folder public yang mengandungi index.php, dan bukan ke root projek.

Langkah 5: Simpan dan Aktifkan Laman Web

Selepas mengisi dan semak semua maklumat konfigurasi, klik butang 添加 (Tambah) di bawah borang. ServBay akan secara automatik menjana dan muatkan konfigurasi baru ke pelayan web (seperti Nginx atau Apache) dan mengemaskini tetapan DNS lokal.

Jika berjaya, konfigurasi laman web baru anda akan tersenarai di halaman senarai laman. Anda juga boleh terus mengakses laman menerusi klik ikon pelayar di penjuru kanan atas.

Langkah 6: Gunakan Operasi Pintas Untuk Pengurusan

ServBay menyediakan butang operasi pantas untuk setiap laman web dalam senarai, memudahkan aliran kerja pembangunan lokal anda:

1. Buka dengan IDE: Terus buka directory root laman web dalam editor kod atau IDE lalai anda.
2. Buka di Pelayar: Buka URL laman web di pelayar web lalai.
3. Lihat Log Laman Web: Dapatkan akses kepada log akses & ralat pelayan web berkaitan laman berkenaan, memudahkan debugging.
4. Jeda/Start Laman Web: Aktifkan atau nyah-aktifkan laman dengan sementara.
5. Padam Laman Web: Buang laman web ini dari konfigurasi ServBay. Perhatian, ini tidak memadamkan fail laman sebenar dari sistem anda.

Contoh Mudah: Cipta Laman Web HTML Statik

Untuk mengesahkan bahawa laman web pertama anda telah berjaya disetkan, anda boleh lakukan ujian mudah berikut:

1. Ikut langkah di atas untuk menambah satu laman dengan domain seperti servbay.demo, jenis laman pilih Statik, root directory ialah /Applications/ServBay/www/servbay-demo-static.

2. Cipta folder /Applications/ServBay/www/servbay-demo-static dalam sistem fail anda.

3. Dalam folder ini, cipta fail bernama index.html.

4. Buka fail index.html dengan editor teks dan tambah kod HTML ringkas berikut:

   <!DOCTYPE html>
   <html>
   <head>
       <title>ServBay Static Test</title>
   </head>
   <body>
       <h1>Tahniah! Laman web ServBay pertama anda telah berjaya dijalankan!</h1>
       <p>Jika anda melihat halaman ini, ini bermakna ServBay berjaya dikonfigurasi dan sedang menyajikan laman web statik anda.</p>
   </body>
   </html>

5. Simpan fail index.html.

6. Kembali ke antara muka pengurusan laman ServBay, cari laman servbay.demo yang baru ditambah dan klik ikon pelayar pada operasi pantas.

7. Pelayar sepatutnya terbuka ke http://servbay.demo (atau https://servbay.demo, bergantung kepada tetapan SSL anda) dan memaparkan kandungan index.html yang anda cipta.

Perkara Penting

• Konflik Domain: Elakkan guna domain yang mungkin bertembung dengan rangkaian lokal atau VPN anda. Menggunakan .demo adalah pilihan yang selamat.
• Kebenaran Root Directory: Pastikan pengguna yang menjalankan ServBay (kebiasaannya akaun pengguna anda) mempunyai kebenaran membaca ke direktori root laman & semua subfailnya.
• Port Sudah Digunakan: ServBay menggunakan port standard (HTTP 80, HTTPS 443) secara lalai. Jika port itu dipakai aplikasi lain, ServBay mungkin gagal memulakan pelayan web atau laman anda tidak boleh diakses. Sila tutup aplikasi yang guna port yang sama.
• Kepercayaan ServBay CA: Jika anda guna ServBay CA dan mahu akses HTTPS tanpa amaran, anda perlu mempercayai ServBay User CA atau ServBay Public CA dalam sistem macOS. Rujuk dokumentasi ServBay untuk panduan terperinci.

Soalan Lazim (FAQ)

• S: Mengapa laman web saya memaparkan HTTP Error 403 - Forbidden atau HTTP Error 404 - File not found?
  • J: Ini adalah salah satu masalah paling biasa dihadapi oleh pembangun.
  • Mula-mula, semak sama ada root directory laman telah diarahkan ke direktori yang betul. Dalam banyak rangka kerja moden seperti Laravel, Symfony, CakePHP, dsb., direktori root projek (biasanya menyimpan fail seperti vendor, composer.json, package.json dan lain-lain) bukanlah root laman web/pintu masuk sebenar.
  • Jadi, anda perlu pastikan root directory laman web benar-benar menunjuk ke folder yang mengandungi fail pintu masuk sebenar (index.php, index.htm, index.html).
  • Antara folder pintu masuk biasa termasuk: public, web, www, htdocs, wwwroot, webroot dan sebagainya.
• S: Saya tambah laman web, tapi bila buka domain di pelayar muncul “Tidak dapat mengakses laman ini” atau “Sambungan ditolak”?
  • J: Pastikan ServBay sedang berjalan dan status pelayan web (Caddy/Nginx/Apache) ditandakan sebagai berfungsi (rujuk muka utama ServBay).
  • Pastikan domain yang ditaip di pelayar sepadan sepenuhnya dengan konfigurasi dalam ServBay.
  • Semak dalam senarai laman web sama ada laman berada dalam status berjalan (bukan dijeda).
  • Pastikan root directory laman betul dan terdapat fail pintu masuk (seperti index.html, index.php).
  • Periksa jika terdapat program lain menggunakan port 80 atau 443.
• S: Laman web PHP saya tidak berfungsi dengan betul, memaparkan halaman kosong atau memuat-turun fail?
  • J: Pastikan anda telah memilih versi PHP yang betul dalam konfigurasi laman dan ia telah dipasang serta berjalan melalui ServBay.
  • Semak kebenaran fail dalam root directory laman.
  • Periksa log laman web (guna operasi pantas) jika terdapat ralat PHP.
  • Pastikan projek anda ada index.php atau fail lain yang ditetapkan ServBay sebagai default index.
• S: Saya tetapkan HTTPS, tapi pelayar beri amaran sijil tidak dipercayai?
  • J: Jika menggunakan ServBay CA, anda perlu mempercayai root certificate ServBay dalam sistem operasi atau pelayar. Ikuti panduan rasmi ServBay untuk mempercayai sijil CA.
  • Jika menggunakan ACME, pastikan domain menunjuk ke instance ServBay yang betul dan sijil berjaya didaftarkan & dipasang. Semak log ServBay untuk maklumat lanjut.
• S: Peraturan rewrite URL tidak berfungsi menyebabkan laman tidak dapat diakses?
  • J: Pastikan anda telah pilih peraturan penulisan semula URL yang sepadan dengan framework/aplikasi dalam konfigurasi laman.
  • Jika menggunakan Apache, pastikan .htaccess wujud dalam root directory laman atau subfolder, dan konfigurasi Apache ServBay membenarkan pembacaan .htaccess.
  • Untuk Nginx atau Caddy, peraturan rewrite biasanya dalam fail konfigurasi yang dijana oleh ServBay – semak sama ada aturan berjaya dimuatkan.

Rumusan

Dengan mengikut langkah dalam panduan ini, anda sepatutnya telah berjaya menambah dan menjalankan laman web pertama anda di dalam persekitaran pembangunan lokal ServBay. Fungsi pengurusan laman web yang hebat, pilihan konfigurasi fleksibel (seperti sijil SSL, jenis laman, versi PHP, penulisan semula URL), dan operasi pantas ServBay akan meningkatkan kecekapan pembangunan lokal anda dengan ketara. Teruskan meneroka ciri-ciri lain ServBay, seperti pengurusan pakej dan pengurusan pangkalan data, untuk membina aliran kerja pembangunan lokal yang lebih lengkap.