WordPressのローカル環境のためのGUIツール”Local by Flywheel”が便利 便利すぎて正直びっくりした。"Local by Flywheel" というWordPressのローカル環境構築ツールの紹介。スピード、環境選択の自由、UIの綺麗さ、ngrok, Mailcatcher, SSL といったものが面倒な設定無しで使えるのは素晴らしい。

便利すぎて、正直びっくりした。

Local by Flywheel のウェブサイト
Local by Flywheel のウェブサイト

WordCamp US へ参加した際にブースを出していたのを見かけていたのが “Local by Flywheel” というローカル環境を構築するためのツール(https://local.getflywheel.com/)。

MAMP (Pro) の UI が綺麗で速くて各サイトが分離されていて、機能がとても多い版というと分かりやすいでしょうか。また、WordPress の環境に特化しており、ワンクリックインストールやマルチサイト、SSL、Apache/Nginx の選択や切り替え、メールのデバッグツールや開発中のサイトの一時的な公開など、WordPressを使ってウェブサイトを作りましょう、となった場合に必要になりそうな機能を備えています。

で、無料です。

トップページに書かれているその機能は以下のようになっています。太字にしているところは、この記事の後半でスクリーンショットなども使いながら深掘りしてみます。

  1. Docker を利用してお互いに隔離されたサイトを作れる
  2. サイトの環境の管理が簡単
    • Nginx/Apache を選べるしすぐに切り替えられる
    • PHP のバージョンも簡単に変えられる
    • サイトのURLも簡単に変えられる
  3. サイトをクローンする
    • 全ファイル、データベース、設定などが全部クローンされる
    • URL がちゃんと変わる
  4. PHP
    • 執筆時点で利用できるのは次のバージョン: 5.2.4, 5.2.17, 5.3.29, 5.6.20, 7.0.3 (もっと追加予定)
    • Xdebug が使えてワンクリックでPHPStormの設定が完了
    • Opcache が利用可能
  5. HTTP/HTTPS のトンネリングが使える
    • ngrok! ローカルのWordPress サイトを別の端末(離れたところにいる他のPC、モバイルデバイスとかなんでも)で見れる
    • Stripe の WebHooks, PayPal IPN, REST APIs がテストできる
  6. マルチサイト
    • サブドメイン、サブディレクトリどっちも可能
    • hosts ファイルも更新してくれる
  7. ブループリント(青写真。次回のためのテンプレート)
    • あとで再利用するためのテンプレートが作れる
    • 全ファイル、データベースや環境設定が全部保存できる
  8. インポート/エクスポート
    • 全ファイル、データベースや環境設定をエクスポート/インポートできる
    • 除外ファイル指定ができる
  9. コンフィグファイルが触れる
    • 各バージョンのPHP、Nginx, Apache, MySQL は全部編集可能
  10. TLS/HTTPS
    • 新規にサイトを作ると(自己署名の)証明書が作成される
    • “Trust”ボタンをクリックすればブラウザの警告を抑制できる
  11. MailCather
    • 会員サイトやECサイトでのメールの内容編集や、コンタクトフォームの作成などをする際のデバッグに使える便利ツール
  12. SSH + WP-CLI
    • root アクセス
    • wp-cli はもちろん使える

そもそも”Local by flywheel”とは

詳細は、Flywheel Acquires WordPress Local Development Tool Pressmatic – WordPress Tavern に詳しく書かれていますが、”Local by Flywheel” は Pressmatic という名前でしたが、2016年後半に Flywheel というデザイナーや制作会社をターゲットにしたホスティング会社に買収されました。Pressmatic が開始されたのが2016年6月で、半年経たずに買収されたというのがすごいですね。

買収される前は、$129だったそうですが、フリーミアムのモデルに移行ということで、無料で利用が可能です。

機能を見る

では少しだけですが、機能を見てみましょう。

Docker を利用しているので環境が分離されている、あと速い

アプリケーション内には、複数のサイトをぽこぽこ作れるのですが、それぞれの環境は分離されています。Webサーバは、Apache/Nginx、PHPのバージョン、MySQLバージョンは別々に選択・変更できますし、各サイトはバラバラな環境となっています。

Local by Flywheel にサイトを追加する画面
Local by Flywheel にサイトを追加する画面

新しいサイトをローカルに作成するのも30秒未満でした。また、立ち上げや停止が速く、1秒かからずに立ち上がります。

アプリケーション自体は500MBで、一番最初だけ Virtual Box や、Docker に使われるイメージのダウンロードに時間がかかった後は、かなり迅速にサイトを作ったり開発することができそうです。

Webサーバ、PHPバージョン、サイトのURLの変更画面が便利

サイトをひとつ作ると以下のような画面になります。UIも分かりやすくて綺麗。

途中で環境の設定を変更するもの楽で、PHPのバージョンを変更、nginx を Apacheにする、サイトのドメイン名を変更するなどがごく短時間(数秒)で実行できます。

PHPやWebサーバなどの環境を管理する画面
PHPやWebサーバなどの環境を管理する画面

コンフィグファイルもログファイルもちゃんと見える

ひとつのサイトを作ると、サイト名を元にしたフォルダが作成されて、その中に、

  • WordPress がある app/ フォルダ(ドキュメントルートがある感じ)
  • Webサーバ、PHPなどのミドルウェアの設定ファイル置き場である conf/ フォルダ
  • ログファイルが見れる logs/ フォルダ

が作成されます。細かい設定はサイト内で手書きで変更できます。かならず使う部分はGUIで行い、残りの細かい部分は設定ファイルで管理することになっています。

ひとつのサイトに含まれるファイルや設定ファイルなど
ひとつのサイトに含まれるファイルや設定ファイルなど

ngrok を利用してローカルの様子を一時的に人に見せることができる

ngrok というのは、ローカルホストにあるウェブサイトを一時的にインターネット上に公開するためのツールです。

ngrok – secure introspectable tunnels to localhost

百聞は一見に如かず。以下のようなことができるということです。テスト環境にいちいちアップロードして見せるのが面倒くさいという場面で重宝します。会議中、特にリモートの会議の際にうまく使うと便利です。

ローカル環境にある最初の状態のサイト。ドメインが https://first-local-site.dev になっている。
ローカル環境にある最初の状態のサイトローカル環境にある最初の状態のサイト。ドメインが https://first-local-site.dev になっている。
ngrok 経由でインターネット上に公開しているもの。URL以外は全部同じ。
ngrok 経由でインターネット上に公開しているもの。URL以外は全部同じ。
ngrok 経由でインターネット上に公開されているサイト。僕のモバイル端末からアクセスしたら見れる。
ngrok 経由でインターネット上に公開されているサイト。僕のモバイル端末からアクセスしたら見れる。

ローカルでのSSL環境がすぐにできる

ウェブサイトをひとつ作ると専用の証明書が作成されます。外部で使えるものではありませんがローカル開発環境で使うだけであれば十分です。

サイトを作ったら自動的にオレオレ証明書が発行される。Trustボタンをクリックしたらブラウザからの警告も出なくなる。
サイトを作ったら自動的にオレオレ証明書が発行される。Trustボタンをクリックしたらブラウザからの警告も出なくなる。

今、https がデフォルトになっていますので、少しでも本番とローカルの状態を整えたいという時に便利です。

サイトのクローンがすぐに作れる。テンプレートも作成できる。

ウェブサイトのクローンをすぐに作ることができます。左側のメニューに並んでいるところでエクスポートやテンプレートとして保存することができます。ここで対象になるのは、全ファイル、データベースの状態に加えて、nginx, apache, php などのすべての設定です。コンフィグファイルで変更した箇所もそのまま引き継がれますので、特定の環境がある場合にも便利です。

MailCatcher が入っているのでメールのメッセージのデバッグも簡単

ローカルでのメールの確認ができるMailCatcherをMacで使う – Shinichi Nishikawa’sでスクリーンショットを含めてどういうものなのか確認できますが、ローカル開発環境でメールが絡む作業をしている時に、

  • メールが送れない
  • 送られても困る
  • いちいちメーラーを開くのも面倒だ

という問題を解決してくれるツールです。WordPress から送られるメールを途中でキャッチして、一時的にローカルのウェブメール的な画面で内容を確認できるというものです。

もちろん SSH + WP-CLI が使える

使えます。

今後、追加される予定の機能

このツールに欠けている機能はなんでしょうか。僕が真っ先に思ったのはデプロイ周辺の機能です。このあたりについては、今後の開発予定のようです。ただ、Flywheel へのデプロイに限られるようにも見えます。これは辛い。

私の手元では、ローカルマシン側(ホスト側という意味で。このアプリケーションが作るゲストではなくという意味で。)の git/wordmove/wp-cli などの各種ツールは使えますので、組み合わせればできるのですが、せっかくGUIなので、そこまで揃えばいいのになぁと思いました。

また、Windows版の開発も進んでいるようです。

それにしても、スピード、環境選択の自由、UIの綺麗さ、ngrok, mailcatcher, ssl といったものが面倒な設定無しで使えるのは素晴らしい。

それともう一つ思ったのは、このツールがあればワークショップなどで開発環境を揃えるのにも便利そうだなぁということです。

いずれにせよ要注目ですね!

“WordPressのローカル環境のためのGUIツール”Local by Flywheel”が便利”への2件の反応

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください