HTML、CSS、JavaScript

ブラウザの中のfrontendは、ちょうど3つの言語でできています。手で書く必要はありませんが、それぞれが何を担当しているのかは知っておく必要があります。

HTML は構造——内容とその骨組みです。「ここに見出しがある、ここに段落がある、ここにボタンがある」と言います。ページの名詞のようなものです。HTMLだけだと、ラベルの付いたテキストファイルのような、飾り気のない素のドキュメントです。ブラウザはあなたのHTMLを、DOM（Document Object Model、ドキュメントオブジェクトモデル）と呼ばれる、メモリ上の生きたオブジェクトの木に変えます。コードが「ページを変える」とき、実際にはこのDOMを変えていて、ブラウザはそれに合わせて描き直しているのです。

CSS はスタイル——すべての見た目です。色、フォント、余白、レイアウト、左寄せか中央寄せか、小さい画面か大きい画面か。CSSはページに何があるかは変えず、それがどう見せられるかだけを変えます。HTMLが名詞なら、CSSは形容詞です。

JavaScript（JS）は振る舞い——あなたが操作したときに何が起きるかです。クリックを待ち受け、データをbackendに送り、スピナーを表示し、答えが返ってきたらDOMを更新します。HTMLとCSSは静的です。JavaScript はページに何かをさせます。動詞です。（同じ言語はbackendを動かすのにもよく使われるので、あちこちで見かけることになります。）