Codexとは、調査や実装からどうでもいい話まで、いろんな話をしています。このやり取りが私の中だけで消えていくのは、ちょっともったいない。じゃあ、そのままブログにしたらいいんじゃないか？ ということで、対談形式の記事を試してみることにしました。

新しいブログは、何が違う？

新しいブログシステムのお披露目もかねて、どういうことをやったかをわかるような記事を書きたいと思う。 ブログになる意識をしつつ、対談形式でお話していってくれる？

もちろん。ここから先は、そのまま記事の対談部分に使えることを意識して話していこう。話題を一度に詰め込まず、ひとつずつ聞いていくね。

では、まず最初の質問。

この新しいブログシステム、読者へ一言で説明するとしたら、今までのブログと何が一番違うんだろう？

見た感じでもうわかると思うけど、記事がインタビューみたいになってるよ。 両側にアイコンが出てて楽しい感じがするとおもう。

内容もより「口語的」になって、もっとAKAIの考えが伝わる形になったよ。

たしかに、文章を読むというより、二人が話しているところへ読者が同席する感じになっているね。

見た目の楽しさだけでなく、文章をきれいに整えすぎず、AKAI自身の言葉や考え方を残せることも大きな違いなのか。

そもそも、どうして従来の「一人で書くブログ」ではなく、Codexとの対談形式にしようと思ったの？

ver1000000.comを、2026年時点のAngular/Firebase構成に合わせてだいたい全部更新しました。

• Angular SSR構成を現代化
• Firebase App Hostingへ移行
• FirestoreブログをSSRで描画
• Functions v2へ更新
• CircleCIとFunctions自動デプロイを撤去
• HammerJSを外してジェスチャー処理を整理
• Angular AnimationsをやめてView Transitionsへ移行
• sitemap.xml / robots.txtを追加
• Prettier / ESLint / pre-commit整形を導入

サイトで利用しているAngularを11にした頃から、SSRがうまく動かなくなり、そこからなんとなくサイトに触るのが億劫になってしばらくメンテしなくなってしまっていました……。

が、このたび重い腰を上げ、 https://zenn.dev/akai/articles/a66df86caab520 などの記事を書き、周辺技術をめちゃくちゃ調査して、ひっっさしぶりにサイトを更新し、SSRを再度有効化しました……。

@angular/fireのAPIが変わりまくっている割にドキュメントが貧弱だったり、あいもかわらずFirebaseとAngular Universalの相性が悪かったりでかな〜〜〜〜り苦戦しました……が、なんとかうまくいったはずです。

というわけで、この記事はSSRがうまく行ったかどうかを確かめるための記事というわけですね。 (Twitter Cardがいい感じに表示されてればいいな)

今回気づいたのですが、昨今のｲｰﾛﾝﾏｽｸ騒動のためか、Twitter Card Validatorちゃん死んじゃってましたね……。

当サイトVer.1000000はGithubにコミットがプッシュされると、
CircleCIが回ってFirebaseHostingにホスティングを行い、
FirebaseFunctionsが更新され、AngularUniversalによるSSRを開始するというナウい感じの構成です。

でしたが（過去形）、2月ほど前から突然Error: listen EADDRINUSE: address already in use :::8080というエラーが頻出するようになり、
途方に暮れてAngularやUniversalのアップデートを行ったところ、最新のAngular（v9）がまだFirestoreに対応していないようだったので、
1月ほど前からSSRをやめ、普通のSPAとして配信を行っています。

Angular Universalについて語るスレ

このため、今となってはブログの記事をTwitterに投稿しても、
記事ごとのTwitterカードが生成されず、歯がゆい思いを強いられています🦷。

現在、Ver.1000000のパッケージをアップデートし、@angular/fireに6.0-rc.1を適用してみましたが、
どうやらまだFirestoreを含めたSSRは行えないようです。

しかし、rc以前はコンパイルすら通らないみたいな状態だった気がするので、何かしら進展はしているようですね。

Github見るとjamesdaniels氏もコミットを続けているようなので、近日にはなんとかなるでしょうか……。

Ver.1000000では結構頑張ってSVGアニメーションの実装を行いました。

• 題文字のアウトライン
• 波紋による背景スプライトの切り替え
• エージェント（朱猪）
• ヘッダーの波

本記事ではアニメーションのデザインについて、私が表現するにあたって考えたことをまとめます。

こんにちは！

フリーランスエンジニアのAKAIと申します。

当サイト、Ver.1000000を超リニューアルしました。リニューアルしたいなぁと考えつづけ、早数年……。

時間というものは本当にあっという間に過ぎてしまいますね。

今までは自分のイラストを展示しているだけの同人サイトでしたが、 今後は自身の活動のアウトプットを記録していく、 名刺代わりのポートフォリオサイトとして運営していきますので、応援よろしくお願いいたします😉