明けまして、今年もみみです。さて本年もまた、今年初めて、を積み上げて参りましょう。いつからでも新しく。

という訳で、ブログ初めは年を越してしまった宿題のうちのひとつから。

そうです、ShifterにWordPressのお守りを任せておいて、gridsomeでオレ好みに高速変身させたのを打ち返してNetlifyにどーんが出来るようになったよ、というご報告です。出来るようになったのは Toro_Unit センセのお陰です有難う有難う。

年末年始のアルコール成分多めでテストしたので色々と余計な試行錯誤をしたのですが、基本的にはlulznekoセンセのShifter Webhooks と Gridsome で作る、最初のウェブサイト on Netlifyをナゾレばいけます。なので、私からは私みたいなうっかりさん向けに引っ掛かりポイントを書いておきますね。

tagを忘れないで

今の処、Shifter上に作成したWPで

• 最低1つ以上の投稿があること（タグ設定済みであること）
• 最低1つ以上の固定ページがあること

が必要条件なのですが、このタグ設定済みを読み落としていて、3回ぐらい同じエラー出しました、はい。久保田は普通に美味しかった。なんでも良いので適当にタグを設定してあげましょう。

エラーを読んだら何とかなる

しかし、まだエラーが出てしまったのでした。でもエラーというものは、焦らずにエラーをちゃんと読めば答えが書いてあるので其処を直せばよいのです。

私の場合はvue-server-renderer のバージョンが合ってないよって言われてたので、package-lock.json の該当箇所を修正したら直ったんですが多分、lulznekoセンセの書かれているように、vue自体のバージョンを上げたら大丈夫な気がします。あと、実家は黒ラベルしか無かったので来年はクラフトビールを発注しておこうと思います。

ローカル環境構築も一手間加えるだけ

ここまでくれば、あとはコンテンツを更新したらばShifterからwebhookを送れば1分弱でデプロイ完了！ハラショー！

そしてここからが本番。ローカルでゴリゴリ俺色に染めていくのですが、ローカル環境を立ち上げるのにgirdsome develop だけではエラーが出ます。Netlify上ではShifter上のWPのAPIを読みに行っているのですがローカルだとそのURLが分からない（都度変わる）ので、下記のように指定してあげる必要があります。

$ CONTAINER_URL="ココにShifterのWPのURL" npm run develop

でローカル環境もバッチリ。（ShifterのWPが立ち上がってないとつながらないよ）

process.env とちょっと仲良く

今回、URLを何処で捕まえてるのか全然分かって無くて、しばし右往左往したのですが、process.env がNode.jsの環境変数ていうのを知ってちょっと賢くなった気分。ええ、自慢じゃないですが私 Node.js 全然分かってません。

で、いちいちCLIでURL設定するの面倒くさいなと思って.envファイルを設定しかけたのですが、都度切り替わるShifterWPのURLって都度コピペするしかなさそう？ですよね？なので、断念しました。暫く↑矢印+Enterで開発していこうと思います。えらい人のTIPS待ってます。

参照: 環境変数とnpm scriptとかpackage.json周りの話

ゆずきち美味しいよ

というわけで今年は特に豪奢な感じのアルコールは無かったのですが、ゆずきち角ハイボールを作ったらえらく美味しかったので、ぜひともゆずきちを皆さんに啓蒙したいのだけれどろくな情報が出て無いのでブランディングをお手伝いしたい心地になりました。頑張れ長門ゆずきち。