最初のウェブサイトを追加する
ServBayでは、新しいウェブサイトを追加してローカル開発プロジェクトをスタートするのがとても簡単で直感的です。本ドキュメントでは、ServBay上で最初のウェブサイトを追加する手順、主要な設定オプション、便利なヒントについて詳しくご紹介します。
PHPやNode.js、静的サイトの開発はもちろん、リバースプロキシやリダイレクトの設定もServBayなら柔軟にサポートします。
概要
ServBayはWeb開発者向けに、強力かつ管理しやすいローカル開発環境を提供することを目的としています。使いやすいグラフィカルユーザーインターフェース（GUI）によって、複数のローカルサイトを簡単に追加・設定・管理できます。本ガイドの手順に沿えば、ServBayで素早く最初のローカルウェブサイトを作成し、プロジェクトの要件に合わせて設定できます。
前提条件
ウェブサイトの追加を始める前に、以下の点を確認してください。
- macOSにServBayアプリケーションが正しくインストール・起動されていること。
サイト追加の手順
ServBayのGUIを使って新しいウェブサイトを追加する詳細な手順は以下の通りです。
ステップ1：ServBayアプリケーションを起動
まず、macOSのアプリケーションフォルダからServBayアイコンを探し、ダブルクリックしてアプリケーションを開きます。
ステップ2：サイト管理画面へ移動
アプリケーションを起動するとメイン画面が表示されます。左側ナビゲーションメニューの「サイト」と書かれたオプションをクリックしてください。これでServBayのサイト管理ページに移動します。
ステップ3：新しいウェブサイトを追加
サイト管理ページで、画面左下の + ボタンを探してクリックします。クリックすると、画面右側に新しいフォーム入力エリアが表示され、新しいウェブサイトの詳細設定が行えます。
ステップ4：ウェブサイトの設定を行う
新しく表示されたウェブサイト設定フォームに、次の主要項目を入力または選択してください。
- 名前：ローカルウェブサイトを識別しやすい名称を指定します。これはServBay内でサイトを管理・区別するためのものです。
- ドメイン名：ローカルでアクセスする際に使うドメインを入力します。実在のドメインと競合しないよう、
.demoやServBayが設定する他のローカルTLD（例:servbay.demo,myproject.servbay.demo）の利用を強く推奨します。ServBayは自動でローカルDNS解決を行い、このドメインで簡単にアクセスできるようにします。 - プロトコル：サイトが対応するプロトコルを選択します。通常は
HTTP/HTTPSがデフォルトで、ServBayがローカルのHTTPS設定も自動で行います。 - SSL証明書申請方法：ローカルサイトのSSL/TLS暗号化を設定します。
- ServBay CA：ローカル開発にはこちらが推奨。ServBayに組み込まれたPKIを用い、ServBay ルート証明書によるSSL証明書が自動で発行・管理されます。システムでServBayのルート証明書（ServBay User CAまたはServBay Public CA）を信頼すれば、警告なしでHTTPSアクセスが可能です。
- ACME：本番環境のシミュレートが必要な場合、ACMEプロトコル（Let's Encrypt, ZeroSSL, Google Trust Services等）を使って、パブリックに到達可能な自サイトドメインの場合は、実際の公開信頼証明書の発行・自動更新ができます。
- ウェブサイトタイプ：プロジェクトの技術スタックに応じて適切なタイプを選びます。
- PHP：WordPress、Laravel、Symfonyなど、PHPベースのプロジェクト向け。ServBayはWebサーバー（NginxまたはApache）とPHP-FPMの連携を自動構成します。
- Node.js：Node.jsアプリケーション向け。ServBayがリバースプロキシ設定を自動生成し、WebリクエストをNode.jsアプリの待ち受けポートへ転送します。
- 静的：HTML/CSS/JavaScript等、静的ファイルのみのWebサイト向け。ファイルをダイレクトに配信します。
- リバースプロキシ：特定のドメインやパスをローカルまたはリモートの別アドレス・ポートへ転送できます。他サービスやアプリへのプロキシに便利です。
- リダイレクト：このドメインへの全リクエストを他のURLへリダイレクトします。
- PHPバージョン：PHPタイプを選択した場合、インストール・稼働中のPHPバージョンをプルダウンから選びます。必要なPHPバージョンを事前にServBayのパッケージ管理画面でインストールしてください。
- URLリライト（疑似静的）ルール：多くのモダンなWebフレームワークやCMSは、美しいURL（例：
/aboutなど）を実現するためリライトルールが必須です。ServBayはLaravel, WordPress, Discuz!など定番用のプリセットを備えており、簡単に適用できます。特殊ケースやカスタムルールは、Webサーバー（Nginx/Apache）の設定ファイルを手動編集する必要があります。 - ルートディレクトリ：ウェブサイトファイルが保存されているパスを指定します。ここがWebサーバーがファイル配信を開始するディレクトリです。プロジェクトはServBayのデフォルト
wwwディレクトリ（例：/Applications/ServBay/www/servbay-demo）に置くのが推奨です。このディレクトリが存在し、ServBayプロセスに十分な読み取り権限があることを確認しましょう。
WARNING
Laravel等のフレームワークを使う場合は、ルートディレクトリはindex.phpのあるpublicディレクトリ（ではなく、プロジェクト全体のルート）を指定してください。
ステップ5：保存してサイトを有効化
すべての設定を正しく入力したら、フォーム下部の「追加」ボタンをクリックします。ServBayが自動でWebサーバー（NginxやApache）に新しいサイト設定を反映し、ローカルDNSも更新します。
保存が完了すると、新しいサイトがリストページに表示されます。右上のブラウザアイコンをクリックすれば、即座にサイトへアクセスできます。
ステップ6：クイック操作でサイト管理
ServBayは、各サイトに対して様々なクイック操作ボタンを用意しており、ローカル開発の効率的な管理をサポートします。
- IDEで開く：サイトのルートディレクトリを、既定のコードエディタやIDEですぐに開けます。
- ブラウザで開く：デフォルトのWebブラウザでサイトのURLを直接開きます。
- サイトログの閲覧：Webサーバーのアクセスログ・エラーログを簡単に確認でき、デバッグに役立ちます。
- サイトの一時停止/開始：一時的にサイトへのアクセスを無効化・再開できます。
- サイトの削除：ServBay設定からサイトを削除します（※実際のサイトファイルは削除されません）。
簡単な例：静的HTMLサイトを作成
最初に設定したウェブサイトが正しく動作しているかテストするには、以下のような簡単な手順が有効です。
上記手順通りに新しいサイトを追加。ドメインに
servbay.demoを使用し、サイトタイプは「静的」、ルートディレクトリは/Applications/ServBay/www/servbay-demo-staticに設定します。ファイルシステム上で
/Applications/ServBay/www/servbay-demo-staticのディレクトリを作成します。そのディレクトリ内に
index.htmlというファイルを作成します。テキストエディタで
index.htmlを開き、次のようなシンプルなHTMLコードを記述します。html<!DOCTYPE html> <html> <head> <title>ServBay Static Test</title> </head> <body> <h1>おめでとうございます！最初のServBayサイトが正常に動作しています！</h1> <p>このページが表示されれば、ServBayが静的サイトの設定と提供に成功している証です。</p> </body> </html>index.htmlを保存します。ServBayのサイト管理画面に戻り、追加した
servbay.demoサイトのクイック操作からブラウザアイコンをクリック。ブラウザで
http://servbay.demoまたはSSL設定に応じてhttps://servbay.demoが開き、先ほど作成したindex.htmlの内容が表示されればOKです。
注意点
- ドメイン競合：ローカルネットワークやVPNと競合する可能性のあるドメイン名は避けてください。
.demoの利用が安全です。 - ルートディレクトリの権限：ServBayの実行ユーザー（通常は現在のユーザー）に、指定したルートディレクトリおよび配下ファイルの読み取り権限が必要です。
- ポート競合：デフォルトでHTTP 80番、HTTPS 443番ポートを使用します。これらが他のアプリで使用中だと、Webサーバーが正常起動しなかったり、サイトにアクセスできなくなることがあります。ポート使用状況を確認し、必要に応じて他アプリを終了してください。
- ServBay CAの信頼性：ServBay CAでHTTPSを警告なしで利用するには、macOSでServBay User CAまたはServBay Public CAを信頼済みにする必要があります。詳しい手順はServBay公式ドキュメントを参照してください。
よくある質問と回答（FAQ）
- Q: サイトを開くと「HTTP Error 403 - Forbidden」や「HTTP Error 404 - File not found」と表示されるのはなぜ？
- A: 開発者が最もよく遭遇するエラーです。
- まず、サイトのルートディレクトリを正しい場所に指定しているか確認しましょう。多くのモダンフレームワーク（Laravel, Symfony, CakePHPなど）では、プロジェクトルート（
vendor、composer.json、package.json等がある場所）はWebサーバーの公開ディレクトリではありません。 - サイトのルートディレクトリは、実際のエントリーファイル（
index.php、index.htm、index.html）が存在するディレクトリを指す必要があります。 - よく使われるエントリーディレクトリ例：
public、web、www、htdocs、wwwroot、webrootなど。
- Q: サイト追加後、ブラウザでドメインにアクセスできず「このサイトにアクセスできません」や「接続が拒否されました」と表示される場合は？
- A: まずServBayが起動していて、Webサーバー（Caddy、Nginx、Apache）が正常稼働中か、メイン画面で確認しましょう。
- ブラウザの入力ドメインが、ServBayで設定したドメインと完全一致しているか確認します。
- サイト一覧で、該当サイトが「稼働中」状態（停止モードでない）かを確認。
- ルートディレクトリのパスが正しいか、かつ必要なエントリーファイル（
index.htmlやindex.phpなど）が存在するかも確認。 - 80番・443番ポートを他のアプリが使っていないかもチェックしましょう。
- Q: PHPサイトが正常動作せず、白い画面やダウンロードが発生するのはなぜ？
- A: ウェブサイト設定で正しいPHPバージョンが選択され、そのバージョンがServBayのパッケージ管理でインストール・稼働済みか確認。
- サイトルート下のファイル権限を確認。
- クイック操作ボタンからサーバーログを参照し、PHP関連エラーがないかも確認してください。
index.phpや、ServBayで指定しているデフォルトのインデックスファイルが存在するかも確認しましょう。
- Q: HTTPS設定時に、ブラウザが証明書警告を表示する理由は？
- A: ServBay CAまたはACME証明書の利用方法により異なります。ServBay CAを利用している場合は、システムやブラウザでServBayのルート証明書を信頼済みとしてください。詳細はServBay公式のCA証明書ガイドを参照しましょう。
- ACME利用の場合、ドメインがServBayインスタンスに正しく向いており、証明書が正しく発行・インストールされているか、またServBayのログでACME処理の詳細を確認しましょう。
- Q: URLリライトルールが効かず、ページにアクセスできない場合は？
- A: サイト設定で、フレームワークやアプリに合ったリライトルールを選択しているか確認してください。
- Apacheを使っている場合は、
.htaccessがサイトルートまたは子ディレクトリに存在し、かつServBayのApache設定で.htaccessが有効化されているかも確認。 - NginxやCaddyの場合は、リライトルールがServBayによる設定ファイルに正しく組み込まれているかを確認してください。
まとめ
この記事の手順に沿えば、ServBayローカル開発環境に最初のウェブサイトを追加し、正常に稼働させることができるはずです。ServBayの強力なサイト管理機能、柔軟な設定項目（SSL証明書、サイトタイプ、PHPバージョン、URLリライト等）、便利なクイック操作によって、あなたのローカル開発効率は大きく向上します。ソフトウェアパッケージ管理やデータベース管理など、ServBayの他の機能も活用しながらより充実したローカル開発ワークフローを築いてください。