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のアップデートをしていて、 ng update を打つ機会が多かったのです、が……。

今回は ng update で地道にコミットを積んでくかんじではなく、 最新Angularで作った新しいプロジェクトに、既存のロジックを移し替えるような形で更新しました。

昔はCircleCIからFirebase HostingとFunctionsをまとめてデプロイしていたのですが、、、なんでだったんだろう。
歴史的経緯、忘れてしまった。

依存外したかったので、Web本体はGitHubへのpushからApp Hostingが勝手にデプロイするようにして、
Functionsは必要なときだけ手動でデプロイする形にしています 🛠️

ブログもSSRで本文が出るように戻しました。 JavaScriptを切ってアクセスしても Now Loading... のままではなく、記事本文が読める。
OGPも記事ごとに出る。 これだけのことなのですが、ここに戻すまでが結構長かったですね…… 🫠

見た目まわりでは、朱猪の挙動や初回表示のイントロ演出も調整しました。 SSRとの兼ね合いが難しかったんですよね、ここ。

直後の画面とブラウザ側のアニメーションをどう繋ぐかはかなり悩みました 🐗

当サイト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氏もコミットを続けているようなので、近日にはなんとかなるでしょうか……。

こんにちは！

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

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

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

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

---

4年かかった甲斐があり（？）本サイトのリニューアルにあたって、 昔は実現できなかった以下のようなナウい技術や要素を盛り込むことができました！

• Angular
• Firebase
• SVGによるアニメーション
• モバイルデバイスのUX

これらの技術がどのように本サイトで利用されているのかは、 こちらのブログの技術カテゴリーに書き連ねていく予定です！

興味のある方はぜひ今後ともご覧いただければ幸いです！！