サイト解説

どうしてもAstroとCloudflareが使いたかったので新しくサイトを開設。 せっかくなので自分が興味のあるコンテンツを全て詰め込む形を取ってみた。

topでは前に弄っていたシェーダーをcanvasに貼り付けている。 動く絵が一枚あるだけでなんか雰囲気が出るのでありがたい。 今は何もしていないけど外部の値を注入してノイズの動きとか変えられると面白いかもしれない。 canvasの横にはCloudflareにデプロイした時のコミットハッシュが表示されるようにしている。

const commitHash = process.env.CF_PAGES_COMMIT_SHA;
const shortHash = commitHash?.slice(0, 7);
const commitLabel = shortHash ? `commit ${shortHash}` : "local build";

アクセスする度に何か変化があった方が嬉しいだろうという考えです。 currentlyから始まるstatusも同様で、今従事していることとかを書いていきたい。

notesは名前の通り記事を置く場所。 articleだとメニュー名として長いのでnotesに決定。 カテゴリ単位での簡単なフィルタだけ実装してある状態。 記事数が増えたら個別に一覧ページを作らないといけないかもしれない。

labにはweb上で試せる色々を置く予定。 今回はシンプルなシンセサイザーをweb audio APIで実装。 controls欄に書いてある通りDAWの内蔵キーボードみたいな感じで演奏できるようになっています。 他にもインタラクティブな要素ありのものを思いつき次第載せていく予定です。

aboutは自分のプロフィールを置いています。 neofetchの表示が好きなのでそれを踏襲してterminalっぽく実装。 ただneofetchはもう使用できないらしいので代替になるfastfetchを実行した体で表記してあります。 セクション右が余ってしまっていたので部屋のテーブルをそのまま取った写真を載せました。 彩度を弄ったりしただけなのに何かそれらしく見えて助かった。