はじめに
WordPressのローカル開発環境といえば、LocalやMAMPを使うのが定番ですが、今回はあえて違う構成を試みました。
使用環境:
| 項目 | 内容 |
|---|---|
| Mac | MacBook Air(Apple Silicon) |
| ローカルサーバー | Laravel Herd |
| PHP | 8.4 |
| ファイル管理 | Dropbox |
| NAS | Synology DS923+ / DSM 7.3.2 |
| DB | MariaDB 10.11(NAS上) |
| ルーター | NTT NSD-G3000T |
| 外部アクセス | DDNS(Synology提供) |
この構成の最大のメリットは、DBをNASに集約することで複数Macからでも同じデータにアクセスできる点です。自宅でも会社でも、同じWordPress環境でそのまま開発できます。
なぜこの構成にしたか
「NASにWordPressを入れればいい」という意見もあるが
SynologyのWeb Stationを使えばNAS上でWordPressを動かすこともできます。ただ、この構成ではあえてDBだけをNASに置き、ファイルはMacのローカルに持つことにしました。
その理由は、ローカルにファイルがあることの強みが大きいからです。
VS Codeで直接編集できる
NAS上のファイルをエディタで編集しようとすると、SFTPやネットワークドライブ経由になりレスポンスが遅くなりがちです。ローカルファイルならVS Codeで即座に開いて編集できます。
ターミナルからwp-cliを直接実行できる
プラグインのインストール、ユーザー管理、データベース操作など、wp-cliのコマンドをそのままターミナルから実行できます。NAS上のWordPressだとSSH経由での操作になり手間が増えます。
オフラインでもファイル作業ができる
DBへの接続が必要な操作はできませんが、テンプレートの編集やCSSの調整など、ファイルだけで完結する作業はネットワーク不要で行えます。
AIエージェントとの相性がいい
Claude CodeなどのAIエージェントはローカルファイルを直接読み書きしてコードを生成・修正します。ファイルがローカルにあることで、AIとの協働開発がスムーズになります。
NAS側の設定
MariaDB 10のインストール
SynologyのDS923+はDSM 7.3.2を使用。パッケージセンターから「MariaDB 10」をインストールして起動します。

phpMyAdminでDB・ユーザーを作成
SynologyにはphpMyAdminパッケージがあり、GUIで操作できます。SynologyのDDNS機能を使えば外部からもアクセス可能で、とても便利です。

WordPressのDBを作成するときのポイントは照合順序を utf8mb4_unicode_ci にすること。utf8mb3(デフォルト)だと絵文字が保存できないため必ず変更します。
ユーザー作成時のホスト名は %(すべてのホスト)にします。接続元の制限はSynologyのファイアウォールで行う方針にした方がシンプルに管理できます。

Herd側の設定
Dropbox内のフォルダをHerdに登録
Herdはデフォルトの ~/Herd/ 以外のフォルダも登録できます。ターミナルでプロジェクトの public_html に移動して:
herd link プロジェクト名これだけで https://プロジェクト名.test にアクセスできるようになります。
登録済みのサイト一覧はこちらで確認できます:
herd linksWordPressのインストール
wp-cliを使います。Homebrewで入れておくと便利です:
brew install wp-cliWordPressのダウンロードはcurlを使う方が安定していました(wp-cliのdownloadコマンドはDropboxフォルダのパスに日本語が含まれるとエラーになることがある):
curl -L https://ja.wordpress.org/latest-ja.zip -o /tmp/wp.zip && \
unzip /tmp/wp.zip -d /tmp/ && \
mv /tmp/wordpress/* . && \
rm -rf /tmp/wordpress /tmp/wp.zip外部からDBに接続する方法(2つの選択肢)
外出先のMacからNASのMariaDBに接続する方法は2つあります。
方式A:DDNS直接接続(VPN不要・シンプル)
SynologyのDDNS機能を使い、3306番ポート経由でDBに直接接続します。
wp-config.phpの設定:
define( 'DB_HOST', 'your-ddns.synology.me:3306' );セキュリティ対策が必須:
3306番ポートをインターネットに公開するため、Synologyのファイアウォールで接続元IPを絞ります。

NSD-G3000Tのポートマッピングで3306番をNASに転送し、Synologyのファイアウォールで自宅・会社のIPのみ許可、それ以外は拒否というルールを設定します。


NuroなどのプロバイダはIPが変動しにくいですが、変わった場合はファイアウォールのルールを更新する必要があります。
外出先での作業:
VPNは不要。https://プロジェクト名.test にそのままアクセスするだけです。
方式B:VPN経由接続(よりセキュア)
Synology VPN Serverを使い、L2TP/IPSec VPNを構築します。macOSが標準対応しているため、Mac側に追加アプリは不要です。

NSD-G3000TのポートマッピングでUDPの500、4500、1701番をNASに転送。MacのシステムからVPN接続を設定します。

重要なポイント: 「すべてのトラフィックをVPN接続経由で送信」にチェックを入れないと、VPN接続しているのにLAN内のNASに到達できないことがあります。

外出先での作業:
- システム設定 → VPN → オン
https://プロジェクト名.testにアクセス
wp-config.phpの設定:
define( 'DB_HOST', '192.168.xx.xxx' );どちらを選ぶか
| 方式A(DDNS直接) | 方式B(VPN) | |
|---|---|---|
| 手軽さ | ◎ VPN不要 | △ VPN接続が必要 |
| セキュリティ | △ IPフィルタで対策 | ◎ |
| IPが変わった時 | ファイアウォール更新が必要 | 影響なし |
| 複数拠点での利用 | 各拠点のIPを登録 | VPN設定のみ |
固定IPがない環境ではVPN方式の方が安定しますが、Nuroのようにほぼ変動しない回線ならDDNS直接接続でも十分実用的です。
Laravel Herd 主要コマンド一覧
Herdを使う上でよく使うコマンドをまとめておきます。
サイト管理
| コマンド | 説明 |
|---|---|
herd link [名前] | 現在のフォルダをサイトとして登録 |
herd unlink [名前] | サイトの登録を解除 |
herd links | 登録済みサイトの一覧表示 |
herd open | 現在のサイトをブラウザで開く |
herd secure | 現在のサイトをHTTPS化 |
herd unsecure | HTTPSを解除 |
サービス管理
| コマンド | 説明 |
|---|---|
herd start | すべてのサービスを起動 |
herd stop | すべてのサービスを停止 |
herd restart | すべてのサービスを再起動 |
PHP管理
| コマンド | 説明 |
|---|---|
herd use php@8.4 | グローバルのPHPバージョンを変更 |
herd isolate php@8.1 | 現在のサイトのみPHPバージョンを変更 |
herd unisolate | サイト個別のPHPバージョン指定を解除 |
herd isolate はクライアント案件で古いWordPressを扱う際にとても便利です。サイトごとにPHPバージョンを切り替えられるので、複数プロジェクトを同時に管理しやすくなります。
ログ確認
| コマンド | 説明 |
|---|---|
herd log | nginxのアクセスログをリアルタイム表示 |
herd log --type=php | PHPのエラーログをリアルタイム表示 |
herd log --type=nginx-error | nginxエラーログをリアルタイム表示 |
開発中にエラーが発生したときは herd log --type=php でリアルタイム監視しながらデバッグするのが効率的です。
よく使う組み合わせ
# 新規プロジェクトを登録してブラウザで開く
cd /path/to/public_html
herd link mysite && herd open mysite
# PHPバージョンをサイトごとに切り替え
herd isolate php@8.1 # このサイトだけ8.1を使用
herd unisolate # グローバル設定に戻すまとめ
Herd + Synology NAS MariaDBの構成は、初回セットアップこそ手順が多いですが、一度できてしまえば新規プロジェクトの追加はフォルダ作成 → herd link → WPインストールの流れで完結します。
NASにWordPressごと乗せてしまう方法と比べると手間はかかりますが、ファイルをローカルに持つことで「VS Codeで直接編集できる」「wp-cliをターミナルから即座に実行できる」「AIエージェントと連携しやすい」といった開発体験の良さが得られます。複数Macで同じDB・同じファイルを使って開発したい方にはとても合理的な構成です。ぜひ試してみてください。

コメント