【Q】 このサイトを作るうえで利用した技術やサービスなどをまとめてください。
-----
【A】 このサイトの技術構成について
基本的な仕組み このサイトは静的サイトジェネレーターのAstroを使って作られています。静的サイトジェネレーターというのは、あらかじめHTMLファイルを生成しておく仕組みのことです。WordPressのようにアクセスのたびにページを作るのではなく、最初から完成したページを用意しておくので、表示が非常に高速になります。
記事はMarkdownという形式で書いています。Markdownは、シンプルな記号を使って文章を装飾できる記法です。たとえば#で見出しを作ったり、![]()で画像を入れたりできます。HTMLを直接書くより簡単で、でも必要十分な表現ができるのが特徴です。
デザインと表示 フォントにはBIZ UDGothicを採用しています。これはGoogleフォントで提供されている、モリサワ社のユニバーサルデザインフォントです。等幅フォントなので、すべての文字が同じ幅で表示され、少し機械的で独特な雰囲気を作り出しています。
スタイルは純粋なCSSで書いています。SassやTailwindのようなツールは使わず、素のCSSだけで必要な表現を実現しています。色は無彩色のみで、背景が#F3F3F3、文字が#3A3A3Aという薄いグレーの組み合わせです。
ページ遷移にはView Transitions APIを使用しています。これはAstroが標準でサポートしている機能で、ページを切り替える際の白い画面をなくし、瞬間的に次のページを表示できるようにしています。
画像の配信 画像の最適化にはCloudinaryを利用しています。記事に4000ピクセルの大きな写真を載せる際、そのまま表示すると重くなってしまいます。そこで、Cloudinaryというサービスを経由することで、自動的に適切なサイズに縮小して配信しています。記事を書く時は普通に画像を置くだけで、裏側で自動的に最適化される仕組みになっています。
ホスティングとドメイン サイトのホスティングにはVercelを使っています。GitHubにコードをアップロードすると、Vercelが自動的にサイトをビルドして公開してくれます。更新も、GitHubにプッシュするだけで自動的に反映されるので、とても便利です。
ドメイン（nanataro.cc）はPorkbunで取得しました。.ccはココス諸島のドメインですが、2000年代には個人サイトでよく使われていた拡張子です。DNSの設定をVercelに向けることで、独自ドメインでアクセスできるようにしています。
コードの管理にはGitHubを使っています。ただし、リポジトリは非公開（Private）に設定してあり、更新履歴やソースコードは外部から見えないようになっています。
開発環境 コードの編集にはCursorというエディタを使いました。これはVSCodeをベースにしたAI支援機能付きのエディタで、コードの提案や修正を手伝ってくれます。
ローカル環境での開発にはNode.jsが必要です。これはJavaScriptを実行するための環境で、Astroを動かすために使用しています。
まとめ このサイトは、現代の技術を使いながらも、2000年代の個人サイトのような素朴さを目指して作られています。必要最小限のツールだけを選び、過度な最適化や装飾は避けています。技術は手段であって目的ではない、という考えのもと、静かに言葉を置いておける場所として構築されています。