7年ぶりくらいに自分のウェブサイトをリニューアルした。と言ってもデザインは殆ど変わらず。時代に合わせて横幅が240pxほど伸びて、モバイル対応して、全体がNext.jsベースになった。ついでにOGP設定とかもしてみた。

一応映像屋のサイトであるにも関わらず、WordPressのYouTube/Vimeoモジュール等が壊れて映像がほぼ見れない状態だと気づいたのが、フリーランス業を再開した2年前のこと。2021年も暮れようという今、また(ほぼゼロから) PHPやWordPressテンプレートを学習し直して修正する気にもなれず、そしてそんな崩壊寸前のサイトに新しい仕事を追加する気も起きず、悶々としてさらに1年が経ってしまった。

せっかくなら今っぽい方法で、と気軽に手を出したモダンウェブ(?)の学習コストが想像以上に高かったのが、こんなにも時間を要した最大の原因だったと思う。未だに正直何もわからない。2014年末あたりに作った以前のサイトは、実家で寝正月を過ごしながらWordPressをポチポチして三が日中にほぼ出来上がった記憶があるが、今回は結局2年もかかってしまった。色々便利になると同時にやたらと複雑さも上がっているように感じるのが半分、そして自分の脳の吸収力の低下を覚えたのも半分。。

昨年末にlabs.gupon.jpを公開したのだけど、あれはその時点での学習の成果でもあった (このときはGatsby.jsで作った)。そもそもReactが初めてだったので概念を掴むのに苦労したのと、周りに付随するBabelやWebpackやらを束ねるGatsbyとは…、と新出の単語や概念が多くて何度も爆発しそうになった。公式チュートリアルのお陰でなんとかビルドまで漕ぎ着け、出来上がるとそれなりに手応えを感じた。

同じ調子で本家をリニューアルしたいと思った矢先、よくGatsby.jsと並んで比較されていたNext.jsが横目にチラつき、ここからがまた長かった。学習しては時間を置いて忘れの繰り返しで、結局Vercelの入門コースを3周ほどした気がする。まるで定着しない。サイト左肩にある謎のポイントだけが無駄に溜まっていった。

でもあるラインを超えてからは、Next.jsでの開発が結構楽しくなってきた。CSS (Sass) などは未だにハック的なノウハウも多いけれど、想像しうる仕組みは大体ストレートに書けば実現できる環境になっていてありがたい。Gatsbyと比べてもシンプルで、個人的には相性が良かった。捗ったのでブログも無駄にGoogle Blogger APIからSSG(+ISR)で出力されるようにした。(10年前の半ば黒歴史のような文章が爆速で表示されるのは、ちょっと怖いくらいだけど)

あと公開にあたっては試しに連携してみたVercelが素晴らしく、そのまま移行することに。古のウェブ開発しか身に覚えがなく、gitでプッシュしたら勝手にサイトがビルド&デプロイされ、アセット類は勝手にCDN対応までされて、ブランチ毎にテスト用プレビューまで作ってくれる手厚さに唖然とする。多少の制限はあれど、これが無料とは一体...。今まで有料FTPアプリ + 有料レンタルサーバーでかけていた手間とお金は何だったのか。Netlifyとかも似た感じなのだろうか。

---

特に嬉しかったのは、やっとローカルのファイル群からサイトの直生成が実現できた点。言葉にするとそりゃそうでしょ感しかないけど、プロジェクトを手元でアーカイブするのと同じ感覚で、画像と説明テキスト(markdown)を普通にディレクトリとして組んでおけば、現代風に最適化されたサイトがゴリッと出力されるのはまさに理想形だった (MySQL的なデータベースともう関わりたくない、という強い信念があった)。例えば画像は高画質なものだけを用意しておけば、サムネ用にトリミングしたデータや、デバイス毎にリサイズや変換した画像は勝手に生成してくれるので、本当に元データは最小限のもので済む。

何より意味的に適切に組まれたデータセットは、時代が変わってもパースする側の仕組を置き換えていけば、データ自体を触る必要がないであろうことに安心感がある。今回は240pxアップのために過去のHDDを漁って元画像を全て作り直したけれど、それも今回できっと最後のはず…。そして今後数年に関しては、Next.jsなど外側のフレームワークさえアップデートすれば、きっとビルド時にその時々の技術でまた最適化されるはず…！という、大抵は妄想に終わる類の期待を胸に、また仕事と更新に励みます。