#vccw

[nolefturnsinc]

So this happened today and I couldn’t be prouder... I’m a worker bee, I don’t like the spotlight so public speaking has never been my thing but after being invited by the director, I agreed to speak without hesitation. 10 sec after hanging up, I asked myself “WHAT did I just agree to”. This was my very first speaking engagement with a huge crowd. I just recently joined Toastmasters to work on public speaking and I wrote notes and practiced and prepared and was still nervous. The ladies were so amazing, I’m truly humbled and was so glad I didn’t say no. I didn’t use one note, I just shared my story from the heart and it was just as much therapy for me as it was for them. Im thankful for the 26 graduates; they’ve overcome so much. This is just the beginning...they will all be home soon. #changeisbeauty #vccw #findingforgiveness #endmassincarceration #criminaljusticereform #juvenilejusticereform (at Virginia Correctional Center for Women) https://www.instagram.com/p/BqN_rl9npkV/?utm_source=ig_tumblr_share&igshid=2ua0s7x9qehd

[cunelwork]

【VCCW】WordPressのローカル開発環境を作ってみた！【Windows10】

【VCCW】WordPressのローカル開発環境を作ってみた！【Windows10】 | スタッフブログ | 株式会社クーネルワーク - 新潟

こんにちは、ぶっきーです。 WordPressの開発環境、あなたはどう作ってますか？ XAMPP(ザンプ)やDocker(ドッカー)など色々方法はあるかと思いますが、今回は「VCCWを使ったWordPressローカル開発環境の構築方法」をご紹介します。 VCCWとは？ VCCWとは、Vagrant、Chef、CentOS、WordPressの頭文字を取ったもので、VirtualBox上で動くWordPressの開発環境のことです。 なんだか見慣れない単語が… そもそもVirtualBoxやVagrantって？ 「VirtualBox(バーチャルボックス)」 PC内に仮想的なPCを作成し、元のOSとは別のOSを起動させることが出来るソフトです。。 例えば、Windowsを起動しながらLinuxを動作させることができちゃったりします。…

View On WordPress

[paranoa-taiyo]

ギターレッスンサイトが。。

ここ数週間ず~っとWebサイト作りしています。4月に公開したいけど。。

自分の納期であれですが何とか間に合わせたいです。

今回色々考えてギターレッスンの記事部分のみwordpressで、基本のウェブサイトは独自のプログラムの中に入れ込んでいます。

今後運用するうえでとにかく楽である事。現行のウェブサイトで思い知らされてますからね。

サーバーにファイルをアップロードするのも今まで手でアップロードしていましたが開発環境も整えました。

wordpressはvagrantのvccwで、その他はgitで自動デプロイというのを想定してます。これでテスト環境も作れるし、なにより公開サーバーに触らなくてよくなるので運用が本当に楽になる、その代わり最初の実装時にしっかり作りこまないといけないので時間がかかってしまっています。

環境構築から始まってサーバー回りから表側のデザインまで一人で全部やるのって大変。。

もうちょっと。。だ、、

[moonglows76]

VCCW勉強会に参加しました！

WordPressを使う人はみんな、ほんと、VCCWを使ったら幸せになれるのに！という西村さん（@marushu）の言葉に誘われて勉強会に参加しました！ うん、ほんとにこれはすごい！

VCCW http://vccw.cc/

なんといっても仮想環境で動かすので失敗した、ってときにさくっと削除できるのがありがたい。 あとリモート環境からリソースをさくっと持ってきて、作業後さくっとリモート環境に戻せるwordmoveが入っていること。 YEOMANといい、VCCWといい、いろーんなプログラムを組み合わせた開発の自動化がものすごく進んでますね。

ということでまとめをば。

環境の準備

端末にVCCWまわりをインストール

VirtualBoxをインストール http://pc-karuma.net/mac-virtualbox-install/

Vagrantをインストール https://www.vagrantup.com/downloads.html

ターミナルを起動して下記コマンドを実行

vagrant plugin install vagrant-hostsupdater

さらにターミナルで下記コマンドを実行

vagrant box add miya0001/vccw

プロジェクトフォルダにVCCW導入

プロジェクトのフォルダを作る（プロジェクトのフォルダ名は任意で）

mkdir vccw-test

フォルダに移動

cd vccw-test

vccwをクローン

git clone [email protected]:vccw-team/vccw.git もしくは git clone https://github.com/vccw-team/vccw.git を実行

vccwフォルダに移動

cd vccw

念のためprovisionなどのフォルダやファイルが入ってきていることを確認

ls -la

site.ymlをprovisionフォルダからコピー

cp provision/default.yml site.yml

念のためsite.ymlコピーできたことを確認

ls -la

起動する環境の設定ファイルを編集（site.ymlは中身を読んで設定を変えるなど。site.ymlが提供されている場合はそのファイルをvccwフォルダの直下にコピペ）

vi site.yml

通信が安定している場所でvagrant環境を起動（最初は5分とか10分とか、時間がかかるかも）

vagrant up

途中でmacのログインユーザーのパスワードを聞かれるので入力

コマンドの実行が終わったらブラウザで http://wordpress.local/ を開くとWordPressのページが開きます！

http://wordpress.local/wp-admin/ でログインできます！ （ユーザー、パスワードはsite.ymlにWordPress User部分に記載されているものです）

WordPressの開発

Bitbucketでwordpressフォルダ内にgitリポジトリを置いて作業します。

SourceTreeを使う前提です。

すでに構築された環境をクローンする前提です。

最初の環境を作る人

SourceTreeでリポジトリを作成（リモートにも作成する）

wp-contentフォルダ以下のみ共有するように.gitignoreを記述

SourceTreeでコミットする内容を確認後コミット＆プッシュ

BitbucketのリポジトリのURLを共有

環境を提供される人

SourceTreeだとフォルダの中が空でないとリポジトリが作れないので、Finderなどでwordpressフォルダ内にあるファイルをいったんどこかにまるっと退避

共有されたBitbucketのリポジトリのURLを開く

開いたページで[↓](矢印の下にお盆みたいなマーク)と表示されているクローン用のボタンをクリックしてSourceTreeでクローン （もしくはその隣のテキストボックスのテキストをコピーしてSourceTreeでクローン）

wordpressフォルダにWordPressのファイルが落ちてくる

退避したファイルのうち、「wp-contentフォルダ以外」をwordpressフォルダに戻す

確認のためvagrantのサイトを開いてプラグインが追加されているか確認

ひとまずこれで準備完了。

作業をやめるとき

vagrantの環境を起動したままだとメモリを使い続けるのでこまめに停止するのがよいそうです。

vagrant global-status

いろんなフォルダに散らばっているvagrantの状況を確認できる。 どのフォルダにいても実行可能。

vagrant halt (ID)

OSシャットダウン。vagrantによるメモリの消費がなくなる。 すぐに利用しないvagrantは該当するフォルダにcdで移動 vagrant halt するか vagrant global-statusで表示されるIDを使って vagrant halt (ID) で停止する 後者はどのフォルダにいても実行可能。 途中でmacのログインユーザーのパスワードを聞かれるので入力する

vagrant destroy (ID)

OSシャットダウン＆リソースの削除。環境は残りますが中身は何も作業していない状態になる IDについてはvagrant haltと同じ。

再度作業を始めるとき

vagrant up (ID)

です。

ここから先は森は試せてないですが、VCCWのハイライトの1つ、wordmoveなのでちゃんと使えるようになっておきたいところです。

wordmoveを使ってリモートのソースを取得＆リモートに作業反映

前準備

pwdでvccwフォルダにいることを確認

vi Movefile

localはローカル環境とstagingはリモート環境

stagingにリモート環境の設定を入力

sshもしくはftpのコメントをはずして設定を入力

リモート環境からソースを取得

pwdでvccwにいることを確認

vagrant sshで仮想環境に入る

cd vagrant

wordmove pull --all サーバから全部持ってくる

リモート環境に作業反映

pwdでvccwにいることを確認

vagrant sshで仮想環境に入る

cd vagrant

wordmove push --all する

（対比して参考までに）wordmoveを使わないでリモート環境をvagrantに作る場合

リモート環境

ログインして[ツール]-[エクスポート]をクリック、ボタン「エクスポートファイルをダウンロード」をクリック

Advanced Custom Fieldを入れている場合は[カスタムフィールド]-[Export]をクリック、Field Groupsのグループをすべて選択してボタン「Export XML」をクリック

wp-contentのpluginsフォルダ、themesフォルダをダウンロード

vagrant環境

wp-contentフォルダ配下にダウンロードしたpluginsフォルダ、themesフォルダを入れる

[ツール]-[インポート]でAdvanced Custom FieldのXMLファイルがある場合はインポート

[ツール]-[インポート]でインポート

[brdr-mmrndm]

VCCWでWordPressの本番環境とローカル環境を同じにする

最近Vagrant（かたくなに「ヴァグラント」と呼びたい）が流行っていて、ローカルでの開発が面倒なWordPressでもオシャレに開発が可能。

VCCW - A WordPress development environment.

VCCWというVagrantの設定ファイルみたいなやつを使えば、簡単に本番環境とローカル開発を同じにできるので色々と捗る。

Vagrantる

まずはVagrantる準備。

VCCWをgit clone

GitHubからVCCWをgit cloneする。

$ git clone https://github.com/miya0001/vccw.git

Vagrantfileを編集

Vagrantfile、要はVirtualBoxなどにインストールした仮想マシンの初期設定ファイル。こいつに設定を書いておけば、どんだけ仮想マシンをグチャグチャに弄ってもvagrant destroy→vagrant upで元通り。また、他の人と同じ環境を使い回したいような場合でも、Vagrantfile（と付随するsite-cookbooksなど）だけ共有しておけば、何GBもあるような仮想マシンのBoxファイルを共有する必要はないのだ。最高！

VCCWのサイトの「Custom Variables」というセクションで各オプションが解説されているので、参考にしていい感じの設定にする。

vagrant up

vagrant upで仮想マシンの新規作成&起動。2回目以降は新規作成はせずに起動。

vagrant provision

仮想マシン立ち上げ後に設定とか変えたくなってVagrantfileを編集した場合、設定反映のためにプロビジョニングっていうのをする必要がある。

$ vagrant provision

ガーーっとコマンドが走るので、待つ。終わったらプロビジョニング完了。

ローカル環境と本番環境を合わせる

さて、Vagrantれたので、本番環境のデータをローカル環境に移してきて、ローカルで開発できるようにする。 WordPressのサイトを他の場所で再現するのに必要なデータといえば、

テーマファイル

プラグインファイル

メディアファイル（画像とか）

データベース

くらい。 今回はオシャレにいく感じにしたいので、Wordmove、もしくはWordmove + WP-CLIを使ってデータをローカルに落としてみる。

welaika/wordmove

Command line interface for WordPress | WP-CLI

VCCWはWordmoveもWP-CLIも最初からインストールされていて、VCCWさえ入れればすぐに使えるようになっている。最高！

仮想マシンにsshログイン

仮想マシンにsshでログインする。

$ vagrant ssh

Wordmoveでサイトのデータ落とす

Wordmoveを使ってデータをダウンロード。もちろんアップロードもできますが、今回はダウンロードです

WordMoveを使ってVagrant内のWordPressと本番環境を同期する！ | Firegoby

Movefileの設定などはこの記事見れば分かる。

ディレクトリ移動

Movefileのあるディレクトリに移動しないとWordmoveは使えない。今はsshログイン中なのだけど、VCCWでは共有フォルダが設定してあって、ゲストOS上からホストOSにあるプロジェクトのルートが見れる。

$ cd /vagrant

lsコマンドなどを使うと、Movefileがあるのが分かる。

pullる

$ wordmove pull --all

全部のデータがダウンロードされる。データベースもダウンロードされるし、本番とローカルのURLの違いなどもいい感じに直してくれる。

$ wordmove pull --themes $ wordmove pull --plugins $ wordmove pull --uploads $ wordmove pull --db

などとすると、個別にダウンロードすることも可能。ちなみにアップロードはpullをpushにすれば良い。

Wordmoveでデータベースがpullできない場合はWP-CLI使う

Wordmove、SSHかFTPでデータをアップロード/ダウンロードできるんだけど、僕の場合データベースだけ上手くいかないことがあった。本番サーバのSSHの設定とか、データベースが大きすぎてタイムアウトしちゃうとか。 そういう場合は、データベースだけ手動でダウンロードしてきて、WP-CLIを使ってローカル環境にインポート→URLの置換を行えばいい。

データベース落としてくる

phpMyAdminとかmySQLとかでデータベース落としてくる。hoge.sqlみたいなファイル。 ダウンロードする場所は、仮想マシンからファイルにアクセスできないと駄目なので、プロジェクトのルート以下のどこかに置く。

ディレクトリ移動

※SSHログイン中です

$ cd /var/www/wordpress

WP-CLIはWordPressをインストールしたディレクトリでしか動かないので、ディレクトリを移動。

データベースインポート

$ wp db import /path/to/db/hoge.sql

こんな感じでコマンド打ってデータベースをインポート。データベースへのパスは仮想マシン上でのパスなので注意。

データベースの文字列を置換

データベースのインポートは出来たけど、本番環境とローカル環境ではURLが違ったりするので上手くサイトが表示されないはず。WP-CLIのsearch-replaceというコマンドを使う。

$ wp search-replace 'http://example.com' 'http://example.local'

これで置換される。URLの末尾スラッシュは必要ない。 いきなり置換は怖い場合、--dry-runと付けておくとお試しができます

WP-CLI、他にも大変便利なコマンドが多数あるので、是非使うことをオススメします。

多分いちばんオシャレなのはWordmoveで華麗に環境同期だけど、僕のように上手く動かない人向けの話でした。

ちなみに僕がデータベースをpullできなかったのは、サーバのSSHでchrootを設定してたからっぽい。chrootを無効にしたらちゃんとpullできたんだけど、セキュリティ上怖い感じだったので、結局chroot再設定した。僕にもっとサーバの知識があればchroot設定しててもpullできるはずなので、また時間があったら試したい。