Web技術 座学ノート

どんなWebページも、煎じ詰めればこの3つの材料でできています。役割がきれいに分かれています。

HTMLだけでもページは成立します（味気ない文書）。そこにCSSで世界観を着せ、必要な所だけJavaScriptで動かす。順番もこの通り──骨組みが先、化粧が後、仕掛けは最小限。

Webサイトには2方式あります。この違いが、あなたの事業の「ランニング≒ドメイン代だけ」を生んでいます。

あなたのサイトは全部静的。だから世界中に配っても費用がほぼ増えず、表示が速く、放っておいても壊れにくい。これは「地方の事業者を保守ごと預かる」事業で致命的に重要です。動的（WordPress等）を受けると、保守が地獄化する——という判断は、この章の理屈そのものです。

Astro（アストロ）は調理場です。正式には「静的サイトジェネレータ」＝材料から完成HTMLを前もって焼き上げる道具。ポイントは2つ。

① 部品化（コンポーネント）

ナビ・フッター・見出しなどを「部品」として1回作り、全ページで使い回す。ナビを直したいとき、部品を1つ直せば全ページに反映される。

② 必要な所しか動かさない（軽い）

Astroは基本、余計なJavaScriptを客に送りません。だから速い。動きが要る所だけ足す思想で、第1章の「仕掛けは最小限」と一致します。

microCMS（マイクロシーエムエス・日本製）は日替わりメニューの黒板。京佑さんがブラウザの管理画面から、コードを触らずに中身（News・記事）を書き換えられる場所です。

「ヘッドレスCMS」と呼ばれます。ヘッド＝見た目を持たず、中身（データ）だけを渡す係。見た目はAstroが担当。この分業で「文章を直すだけなのにデザインを壊す」事故が起きません。

2つは別物です。Git＝履歴を取る仕組み、GitHub＝そのデータをネット上に置く保管庫。

履歴が残るので、「昨日の状態に戻す」が一瞬。前回ブラムリィCafeの大胆版を「ひどい」と即やめて元に戻せたのは、この仕組みのおかげです。

Cloudflare（クラウドフレア）は、完成したサイトを世界中に配信する場所＝店舗です。あなたのサイトはここに置かれ、URLで誰でも見られます。

強みは2つ。速い（世界各地のサーバーから一番近い所が配信）と、静的なら基本無料。だから「ランニング≒ドメイン代だけ」が実現しています。

ここが全章の合流点。バラバラの部品が「ボタンを押すと自動で公開される」一本の管につながっています。あなたが日々使うのはこの動線です。

ルート①：デザイン・構造を直すとき（Claudeに頼む）

ルート②：中身を直すとき（京佑さん一人で完結）

ドメイン＝サイトの覚えやすい住所の名前（browna-entertainment.com）。DNS＝その名前を実際のサーバーの場所に変換する「電話帳」です。

人は名前で覚え、機械は番地（サーバーの場所）で動く。DNSがその通訳をして、入力した名前から正しい店舗へ案内します。あなたはCloudflareで住所も電話帳もまとめて管理する方針なので、窓口が1つで済みます。

ターミナル（CLI＝コマンドで操作する画面）は、ボタンの代わりに命令を文字で打つ作業台です。プロが速く正確に作業するための入口で、難しさより「慣れ」の問題。

あなたが実際に関わる命令はごくわずか。ほとんどはClaudeが代わりに打ちます。意味だけ知っておけば十分です。