ブログをリニューアルしました

元々EC2+WordPressで作っていたものを、Notion+SvelteKit+Vercelでリニューアルしました。

運用費

リニューアル前はEC2で月3000円強かかっていましたが、NotionもVercelも無料プランで利用しているので完全無料になりました。 アクセスもそんなにないので無料プランの範囲で収まると見ています。

フレームワーク

仕事ではNext.jsを使うことが多く、違うフレームワークを試してみたいと思いStack Overflow Developer Survey 2023State of JavaScript 2022で評価の高かったSvelteKitを採用しました。

Reactと比べるとエコシステムの差はまだまだありますが、コード量が少なくて済むのでかなりスッキリ書ける印象です。

デプロイ先

当初Cloudflare Pagesにデプロイしようとしたのですが、無料プランだとWorker sizeの上限が1MBで、SSRの場合Worker sizeを1MB以内に抑えるのは不可能と判断してVercelに変更しました。

Vercelの無料プランは商用利用禁止なのですが、当ブログは元々広告も貼っていないので一旦無料プランで利用させていただこうと思います。

記事管理

元々メモとして使用していたことと、無料で利用できることからヘッドレスCMSは使わずNotionのデータベースで記事を管理しています。

Notionのエディタに関しては自分は使いやすくて助かっていますが、APIがカオスなので金輪際Notion APIは触りたくないなと思っています。

デザイン

Neumorphismは飽きたので廃止しGlassmorphismを取り入れ、前のブログよりシンプルな構成にしました。 デザインは仕事でもプライベートでも使用しているFigmaを使用しました。

シンタックスハイライト

Rehype Pretty CodeShikiを使用しています。ShikiはVSCodeのテーマファイルを利用できるので気に入っています。 私が使用しているテーマはLuvia Themeです。

CSS in JS

vanilla-extractを使用しています。TypeScriptで書けるので気に入っていますが、普段CSS Modulesを使用している身としては「これどうやって書くんだ?」みたいな場面がちょこちょこあり、慣れが必要かなと思いました。

フォント

Hachi Maru Pop - Google FontsLotionを使用しています。

その他

転職、引っ越し、リニューアル等で1年ほどブログを書けていませんでしたが、これからちょこちょこ更新していきたいと思います。