Markdown からページを生成し、React や Vue のコンポーネントを必要な箇所だけ「アイランド」として配置します。初期ロードが軽くブログ・LP に向きます。
技術用語
300
Astro
アストロ
体験区分：少しだけ触った
推奨読者レベル：Level 3-4
何をしてくれるか
どこで出会うか
AI に「静的サイトを作って」と頼むと候補に上がります。動的アプリ向けの Next.js に対し、Astro はコンテンツ配信を優先したい場面で名前が出ます。
比較図
2026.04·ready
「ブログとドキュメントは Astro、ダッシュボードは Next.js と棲み分けて使っています。」
Astroの見方
301
この用語の見どころ
1
役割
静的出力を基本に、UI フレームワークを混在させる Web フレームワークです。
2
うれしさ
初期ロードが軽く、Markdown をそのままページにできます。
3
注意点
動的機能が多いアプリより、コンテンツ配信に向いています。
4
どこで役立つか
ブログ・ドキュメント・LP など更新頻度の高いコンテンツサイトに向いています。
5
はじめに
「SSG＋アイランドアーキテクチャ」の 2 点を押さえると理解が進みます。
6
深掘り先
SSG（F-162）、React、Tailwind CSS（F-16）
非エンジニアのつまずき
- HTML の次に勧められましたが、AI に全部任せないとうまく動かず苦労しました。
私のコメント
- 第一印象:バニラ HTML から一歩進める選択肢として AI に勧められました。
- 良い点:メジャーなフレームワークですが、正直まだよく把握できていません。
- ダメな点:非エンジニアが触るにはハードルが高く、かなり苦労しました。
- 誰向けか:コンテンツを継続管理したい人向けですが、私はまだ掴みきれていません。
開発フローでの位置
要件確認
初期化
執筆
拡張
配信
関連用語
F-17·term_tool
バイブコーディング図鑑