みやらしのサイト
ひとりごと

みやらしのサイト、つくりました。

公開

みなさん。個人サイト、持ってますか？ 今の時代記事を書くにもリンク集を作るにもいろいろな手段があると思います。 なぜこの令和の時代に私は個人サイトを作成したのかという話をしていこうと思います。

なぜ個人サイトなのか

一言で言うと情報を一元管理したいというところが大きいです。 このサイトを作る前には様々な情報が散乱していました。以下はその一例です。

Misskeyだけで活動いている分には、Misskey Pagesという簡易的に記事を書く機能があります(詳細はこちら（外部のサイト）)し、SNSなどのリンクも複数貼れますので困ることはありません。 しかし、ここ最近（2025年秋以降）VRChatからの交流が増えてきたこと、それに伴いXのアカウントを再開設するなどMisskey(Fediverse)の文化圏だけで交流が完結しないことがかなり増えてきました。 結果としてリンクが貼れないXのために情報を一元管理する必要性に迫られてしまったのです。

正直これだけではlitrinkなどリンクを集約しているところからnoteなどブログに飛ばすやり方など個人サイトを作成するなどやりようによってはどうにでもなりますし、動機が弱いようにも見えます。 ただ、デザインの一貫性や自由度~~、あとは単純な逆張り精神~~から個人サイトを作成するに至りました。

技術選定

サイトの構成図 基本的には自宅のサーバ内にWebサーバ用のLXCとCMSとして使っているDirectus用のVMを立てています。GitHubへのPushか記事の作成（か予約投稿が走ったタイミング）でActionsがビルドとデプロイをしてくれる感じです。CI/CDってやつ。すごいねこの仕組み考えた人って調べながら感心してました。 お行儀が悪いでおなじみTailscaleを用いてデータの授受を実施、外部公開はMAP-Eでポート開放に制約があるのでCloudflare Tunnelを使っています。ありきたりな構成ではありますね。

使ったもの 理由
Astro SSGやってみたい！とチュートリアルと簡単なページを作って感動したため、あとMarkdownで記事がかけるの便利
Tailwind CSS 同上
Directus ClaudeくんがCMS入れるならおすすめ！って言ってきたので
Cloudflare ポート開放が😭

ここまで単純な構成であれば自宅サーバである必要もないのですが、リソースが余っていたので・・・

Design

正直私はデザインセンスがありません。そのため、欲しい要素をClaude Designをしばいて計算資源を無駄にしました。 初版のデザイン

自分のアイコンに近い配色に使用したロゴで使われている系統のワンポイントが入ってて、すごく気に入っています。頼まずともいい感じにダークモードまで作ってくれて・・・すごいね君は。 ちなみに、ロゴについてはぽっぽさん(Misskey.io)（外部のサイト）に以前作っていただいたものを採用。 この場を借りて感謝します。

PC版ロゴ（外部のサイト） スマホ版ロゴ（外部のサイト）
初めてioでは埋め込みができないことを知った回

サイトの作りとして、重要度をリンク集→ひとりごと→MiyaraKeyについてとしています。なのでトップページにリンク集を載せてそこからプロフィールに移動できるようにしています。 情報の一元管理という点ではかなり満足できる構成になったな・・・と思っています。

つくりかた

上で述べたとおり、DesignはClaudeをしばいて作りました。 実装についてもしばいてやってもらっているのですが、最後は自分の目で確かめることを意識しました。とはいえAIに使われている感はどうしても否めず・・・ここは自身の技術力を高める必要があり課題ですね。使いこなせている人はすごい。

将来構想・改善点

とりあえず形にはなった自サイト、でもやることは残っているな・・・と感じています。

ですがゆるくまったりやってこうと思います。 ひとりごとも気が向いたときに書くくらいの意識でやりますので、どうぞ今後ともよしなにお願いします。

みやらし

ひとりごとの一覧へ