Site Template

04 / まちのお店

生成りの紙に手書き風の文字、赤と黄の差し色。縦書きの見出しと写真カードで、街のお店の親しみやすさを伝えます。

このテンプレートでリポジトリを作る(GitHub・新しいタブ) GitHubでソースを見る(新しいタブ)

「リポジトリを作る」はGitHubのテンプレート機能で、あなたのアカウントに新しいリポジトリを作成します。作成したリポジトリは独立したコピーとなり、このテンプレートの今後の更新は自動では反映されません。

公開デモのURLは確認中のため、まだ掲載していません。

特徴

  • 縦書きのヒーロー
  • 手書き風の書体と装飾
  • 日よけのオープニング
  • スマホ下部の連絡バー
  • ライブラリなしの表示演出

導入と調整

04 / まちのお店の使い方

この見本は TemplateWebAstroWithDesign04 を収録したものです。GitHubの「Use this template」で自分のリポジトリを作成できます。元の更新が自動で同期されるわけではありません。

Node.js >=22.12.0 とpnpmを用意し、リポジトリ一式を取得して pnpm install、pnpm dev を実行します。Claude Codeのセットアップ手順は元のREADMEを参照してください。

このカタログはコミット 69a170f6488579ac420e9e0fa8dab83bdd89f326 に固定しています。同じ状態を確認する場合はcloneして、このコミットをcheckoutしてください。

生成りの紙に手書き風の文字、赤と黄の差し色。縦書きの見出しと写真カードで、街のお店の親しみやすさを伝えます。

初期文言・写真は見本です。案件用に差し替えてください。サイト情報は src/content/site.ts、配色と書体は src/styles/global.css で調整します。

主要14ファイルをこの画面とMCPから参照できます。全体の導入にはGitHubリポジトリ一式を使用してください。画像・フォントなどのバイナリはソースAPIに含まれません。フォント・写真の利用条件は取得元リポジトリで確認してください。コードはMIT Licenseで、LICENSE表記を保持してください。

外部ライブデモURLは未登録です。掲載画像・動画は、この固定コミットをローカル起動して撮影したものです。