#02 Shifterをローカル環境で試そうの会

黒い画面を一緒にやってみませんか?Shifterをローカル環境で試そうの会

5月26日水曜日にオンラインにて開催しました!
今回は、私のための私の勉強会…みたいになってしまい集中しすぎたこと地味に反省しております。。。

当日のイベントの流れ

今回は、はじめての参加された方がいらっしゃらなかったので、そのまま本題の「黒い画面でshifter-local!!」の実践に入りました。

今どきの?WordPress用のローカル環境とは。。

  • DevKinsta
  • Local (Local by Flywheel)
  • MAMP
  • Valet
  • VCCW
  • wocker
  • wp-env
  • XAMPP
  • shifter-local

「フルでGUIな Local と DevKinsta が楽」という話でしたが、種類多すぎない?(;^_^A
聞いたことない名前もあるんですが…
個人的には、MAMPやXAMPPは懐かしい印象かな。
最近はもっぱらLocalに頼りっぱなしです。ホント便利な世の中になったよ。

それで「shifter-local」ってなぁに?

Shifterの環境を簡単にローカル環境に作れるよっていうツールなんですが。

Shifterの環境へアップロードする前にローカルで動作や見た目をチェックしようかなというくらいであればLocal (Local by Flywheel)で充分だし楽!楽することは大切だ。

Shifterでサイトを作るために必ず「shifter-local」が必要なわけではありません。

ただ継続的にShifter専用にデバッグ環境が必要というならshifter-localは便利とのこと。

そう、無理に頑張る必要はありません。だってビギナーズだから。(←大切!!

とはいっても、今日はちょっとみんなでやってみましょう!という話です。

まずはDockerが必須…

先程「shifter-local」はShifterの環境を簡単にローカル環境に作れるツール…と説明しましたが、正しくは。。。

Shifterに移行するときにWordPressのテーマやプラグインをテストするためのDockerイメージです。

https://github.com/getshifter/shifter-local

そうDockerがなくては、はじまらないのです。。
(なんだよDockerって思われた方はちょっと調べてみてください…)

Dockerをインストールしよう!

公式サイト:Docker DesktopからDocker Desktopをダウンロード!

インストールは基本、ポチポチで行けます。Macはね。。
Windowsは、再起動を挟みまして…「Linuxカーネル更新プログラムパッケージをダウンロードする」のひと手間があります。
参考サイト:Windows 10 HomeへのDocker Desktop (ver 3.0.0) インストールが何事もなく簡単にできるようになっていた (2020.12時点) をご参考に。

Dockerが正常にインストールされるとDocker Desktopの画面が起動するので、スタートボタンをポチる。

その後も、ポチポチ進めていってOKです。

チュートリアルのコンテナが入っております。

ここまでくると、このままこっちは立ち上げたまま置いときます。

shifter-Localのインストール

手順は下記サイトをそのまんま参考にしました。
参考サイト:Shifter-LocalでWordPressテーマ開発環境を作る

はい、黒い画面入りますよ~!!

まず、どっかに新しくディレクトリを作ります。
私はデスクトップにtest01というディレクトリを作りました。

ターミナルで、新しく作ったディレクトリに移動。

cd c:\Users\yotigory\Desktop\test01

そこに「shifter-Local」をgit cloneします。

git clone https://github.com/getshifter/shifter-local

cloneしたディレクトリに移動します。

cd c:\Users\yotigory\Desktop\test01\shifter-local

ここでDockerを起動

docker-compose up -d

これで終わりよ!!スゴイでキタ――(゚∀゚)――!!

Docker Desktopのコンテナの一覧に新しく「shifter-local」が表示されています!

で https://127.0.0.1:8443/ をブラウザで開くと、見慣れた画面が表示されています!
(ブラウザの警告は無視で…)

日本語を選択し、パスワードの設定などをして進み管理画面に入ると。。Shifterのロゴが入ったShifterのローカル環境が出来上がりです!!

ログインは https://127.0.0.1:8443/wp-login.php からできます。

豆知識

shifter-localを二重起動したい場合は、docker-compose.yml に記載されているポート番号を変えればOK!

作業を終了したいときは、Docker Desktopの画面から停止ボタンをポチっとな。
グレーアウトされます。

次回はいつ?のまえにWordCamp Japan 2021!!!

今月は、WordCamp Japan 2021が6月20日(日)から開催されます。

WordPressのことをたくさん知れる良いチャンス!是非参加してみましょう~

一緒にビギナーズやってるマリコさんもスピーカーとして参加しています!
6月20日(日)13時~13時45分
WordPressは駆け出しデザイナーを救う

楽しみですね!!!

この記事を書いた人

yotigory

Web制作会社でマークアップやってます。やってみよう!という感覚で工作したりカメラとったりコミュニティ活動したりしてます。みんなでワイワイ飲んだりするのが好きです♪
気分でフラリとおでかけします。