WordPressが嫌でNuxt.js+Contentfulでブログを作ったけどHugoに移行した話-前編
こんにちは!今日は先日書いたブログをNuxt.jsとContentfulベースから Hugoベースに移行した理由について書きます。
まずはWordpressじゃ駄目だった理由
ブログと始めるにあたってまず思いついたのがwordpressです。 シェアも多分WPが圧倒的です。...が、WP使う気はなかったです。 個人的な理由は...↓
DB周り詳しくない
WPはMySQL使います。といってもそんな難しくないんだけど、 SQLとかRDBMSにそこまで詳しくない人が触ってるとなんかのエラーが起きたときに対応できない気がするんだよなー
遅そう(MPA)
MPAだとやっぱ再描画とかに時間かかりそう(多分) WPは特にDBを基に動的にレンダリングしてるし、速度に関して未知数な部分というか不安?がありました。
PHPあんまり...
PHPが嫌だ!!!!! これもDBと同様で、なんか問題起きたら対応できん。プラグインの相性とか...
なんかブラックボックスっぽい
内部的な仕組みとか分かってないとやっぱ小回り効かなさそう。 ただこれは非エンジニアにとっては長所だし、WPの最大の魅力でもあるね!
技術的にイケてない
前時代の遺産感すごい。フロントエンドエンジニアとして、ブログをWP使ってるってのはちょっとだけ嫌だ! JSerなのにMPAなのが嫌だ!まあこれは自分の気持ちの問題ですねーー
高そう
PHP動くサーバーは無料ってわけにはいかんのよ。
で結局サーバーの知識もちょっと必要になるじゃん?フロントエンドエンジニアには手に負えない勉強しろ
人と同じのイヤ:(
これも自分の問題じゃん Think different, Appleの哲学ですね。
セキュリティ不安...
ログインされたら全消しされるーー ちなみにWP使ってないこのブログですら、wp-adminにめっちゃアクセスくる。怖い!
記事をGitで管理できない
同じく全消しの恐怖。
自分しか書かない
引き継ぎとか複数人更新のブログにはWP最適やな。まあ使用人口多いしな。でも私はぼっち
などの理由があったから。なんか理由ざっくりすぎない?
Nuxt+Contentfulで良かったところ
もともとJSerということもあり、Nuxtでフロントエンド、ContentfulでAPI(記事)の構成にすごく憑かれました。
最新技術てんこ盛り
SPA、SSR、JAM Stack、ヘッドレスCMS、デカップルドアーキテクチャ...たまらねえぜ。
速そう(SPA)
SPAだしな。あとJAM Stackの真の力を見てみたかった。
JS好き
基がJSなんで大抵の部分が分かる。これはもう、すごく有り難いし小回りが利く。 もうちょいこうしたい、みたいなのがかなり柔軟にできる。ページもデザインもいじり放題。
セキュリティ安心
wp-adminなんてないんだわ。ソースはGitにあるんだわ。
Alt言語全般使える
Pugもstylusも3秒でできる。 嘘。でも3分でできる。これはもうNuxtさまさま。Prettierとかもいけるで。
安い
firebaseにしろNetlifyにしろ基本無料なのよ。ちなみにリニューアル後もNetlify使ってます。
挙げるときりないけど主要なのはこんなもん。
Nuxt+Contentfulで悪かったところ
こっちが本題? Nuxt+Contentful構成はすっごい囃されてますのであえて悪いところ書きます。
技術がブログに向いてない
これ。NuxtはWebアプリ向け。Webサイトに適しているかと言われると...って感じ。 ブログは未だにMPA当たり前。例えばGoogle AdsenseとかそもそもSPA対応ほぼしてないです。 Adsense関連の本もMPA前提の知識が殆ど。まあしゃーない
あとはブログのテンプレート?的なのがないのが辛かったです。JS得意だからほぼ1から作れたけど、 WPで作ってたらこの時間に記事更新しまくれたような気がするのは内緒だよ。
ブログとしての小回りが利かない
Adsendseもだけど、アクセスランキングとかコメント欄とか作れない。 コメント欄はDisqusあればいけるけど、結局その辺のやってみた系の資料がない。 twitterやFBとの連携もてんやわんや。ページネーションとかも大変。できなくはない。
OGP弱い
OGPは知識ある人がしっかり作ればいいかもしれんけど、結局TwitterやFBでシェア時に画像出るやつは断念。 この辺りはSPAの宿命かも...Googleは大丈夫だった。さすが!
そこまで早くない
いやめっちゃ早いんだけど、AMPの1/100くらいを想定してたからちょっとつらみ。 でもここに関しては高速化意識すればもっと早くなりそう!
SSRすると結局有料
最初Netlify使ってたけどSSRした方が良いんじゃない?となってGCPに移行。 そして有料化(GCPは最初の1年は無料だよ!)有料となるとこの構成に拘る理由が一つ減ります。 GCPとかAWSに強い人ならいいかもだけど。NetlifyのPrerenderingとかも試してみましたが効果は実感できず...
Contentfulスマホで使いにくっ!
スマホからブログ書きたかった...でもContentfulはそれを許してくれない。ゴリゴリのPC用UI。 貼り付けすらできないのがしんどみ。あと知らん間にかばんの中でバックスペース押しっぱで全消ししてもうた。それはお前のせい。
Contentfulめっちゃ落ちる
PCとスマホから同時ログインとかすると落ちる。特にFirefoxが相性悪いのか落ちまくり。
<b>(強調)が使えない
**これな。**なぜか使えなかった。これは設定次第でどうにかなった気がする。
AMP使えない
AMPにできるプラグインもあるんだけど、JS書くのほぼ禁止のAMPとJSが全てを支配するモダンフロントエンドの相性の悪さたるや。
こうしてHugoに移行したというわけじゃ
以上のつらみを抱えていたおいらに救いの手を差し伸べてくれたのがHugoだったってわけだ。
Hugoのつよみとつらみについてはまた後日書きます。以上!
後編書きました
LINK
TAGS
LATESTS
POPULAR
- CSS2021/04/29【CSS】右寄せの方法は結局flexが一番良さそう
- React2020/07/13【JS】Reactのstyleの使い方、書き方いろいろ
- Payment2021/10/16GooglePayでVisaタッチを使う時に知っておきたい過酷な現実【追記あり】
- Others2021/07/11Slackに予約投稿機能ができて嬉しいけどそれでもまだ少し不満な理由【追記あり】
- CSS2020/04/30【CSS】tailwind.cssでよく使うデザインパターン
- CSS2019/03/30【CSS】100vhは「一画面」ではないという罠
- CSS2020/06/09【CSS】max-font-sizeやmin-font-sizeを使いたくなったら
- Vue2019/06/29【JS】Vueの:classの書き方3通り
- JavaScript2020/09/02【JS】yarnの長所とyarnからnpmに戻ってきた理由
- React2020/06/04【JS】ReactのclassNameの色々な書き方紹介