Phase 2 ベースラインで何ができるか

公開日: 2026-05-11

これは /lab/<product>/ 配下に置く商品 MVP ページの 書き味と組版を 1 件分通しで確認する ためのサンプル記事です。Phase 4 以降に追加する記事は、このページと同じ構造（page.mdx の metadata export + 本文 + 必要な React コンポーネント）で書きます。

できるようになったこと

• .mdx ファイル先頭の export const metadata で <title> と <meta description> が設定できる
• 本文中で Markdown 構文 と 任意の React コンポーネント を混在させられる
• output: "export" の静的ビルドで out/lab/sample/index.html まで吐かれる
• trailingSlash: true の効果で /lab/sample/ がそのまま 200 で返る

サンプル：複数の Callout

Callout コンポーネントは mdx-components.tsx でグローバル登録しているので、MDX 上部での import 無しで使えます。

次にやること

このページは 構造確認 のためのもので、内容そのものに価値はありません。Phase 4 に入ったら、ここの構造をベースに：

• 商品ごとの /lab/<product>/page.mdx
• 共通レイアウト（ヘッダー・パンくず・関連商品など）
• 集計用の slug / metadata 拾い上げ

を整備していきます。