udus.dev を作りました
HonoXCloudflare
目次
個人サイト「udus.dev」を作りました。この記事ではサイトを作った経緯と、どんなサイトなのかを紹介します。
#なぜ自作したのか
理由はシンプルで、既存のサービスでは実現できなかったからです。
やりたかったことは3つ。
- ポートフォリオとして実績やスキルを見せたい
- ブログとして技術記事や考えを発信したい
- SNSのプロフィールに貼るリンク集（linktr.ee のようなもの）が欲しい
これらを1つのサイトにまとめたかったのと、デザインも自分で納得のいくものにしたかった。無料で使える既存サービスではなかなか難しかったので、結局自分で作ることにしました。
#サイトの特徴
#技術スタック
せっかく自作するなら新しい技術を試したいということで、以下の構成にしました。
- HonoX: 軽量で高速な Web フレームワーク
- Cloudflare Workers: エッジで動く serverless 環境
- SSG: 静的サイト生成で高速表示
Cloudflare の無料枠で運用できるので、ランニングコストはドメイン代のみです。
#主要機能
- Works: これまでの実績をまとめたポートフォリオ
- Blog: 技術記事やその他の発信
- Contact: お問い合わせフォーム
トップページにはプロフィールと各 SNS へのリンクを配置しているので、リンク集としても使えます。
#内部記事と外部記事の統合
ブログページでは、このサイトで書いた記事だけでなく、Zenn などの外部プラットフォームで書いた記事も一緒に表示しています。あちこちに散らばった記事を一覧できるので便利です。
#ダークモード対応
ダークモードにも対応しています。右上のトグルで切り替えられます。
#今後の発信内容
このブログでは、こんな内容を発信していく予定です。
- 技術記事: データ基盤やクラウドの技術 Tips
- プロジェクト事例: 実際の構築事例や学び
- キャリア・働き方: エンジニアとしての考え方
- ツール・プロダクト: 使っているツールの紹介
#おわりに
気が向いたときに更新していきます。よかったら覗いていってください。
#参考
このサイトを作成する際、主に以下のサイトを参考にさせていただきました。
ありがとうございます。
HonoXのSSGで個人ブログを構築しました - mooriii's blog
個人ブログを開設する機運が高まっていたのでHonoXのSSGで個人ブログを構築しました。
HonoXでsatoriを使ってOGイメージもSSGする
HonoXで最近実装しなおしたこのサイトにOGイメージが出せるようにしました。画像をSSGするまでにいろいろ試行錯誤があったので記録します。
Hono v4 で Markdown を SSG する | SIWL.dev
話題の Web フレームワーク Hono の、v4 へのメジャーバージョンアップで追加された機能である SSG を試してみました。
