記事一覧
CSSをそのまま書くのがつらくなったら（Sass）
ピュアなCSSは規模が増えるとつらくなります。変数・ネスト・@mixin・ファイル分割で解決するSassと、「書いたものを変換してから配る」という考え方。
実際にデプロイしてみる
デプロイとは、作ったものをサーバーに置いて公開すること。静的ホスティングで自分のページを世界に公開する一歩と、反映されないときのキャッシュの話。
エンジニアのわけのわからない横文字集
「パスを通す」「デプロイする」「リポジトリをクローンして」。エンジニアが使うIT用語を解説します。
フロントエンドとバックエンドは何が違うのか
違いは「プログラムが動く場所」だけ。ブラウザー側とサーバー側という地図を1枚持っておくと、この先の話が全部その上に置けるようになります。
CSSの書き方
白黒のHTMLに見た目を与えるCSSの基本。セレクタとプロパティの書き方、ボックスモデル、FlexboxとGridによるレイアウトを整理します。
HTMLの書き方
タグで文書の「意味」を宣言するHTMLの基本。最小のページ構成から、入れ子の木構造（DOM）、セマンティックな領域分けまでを順に見ていきます。
JavaScriptの書き方
静止画だったページに動きを与えるJavaScript。DOMの書き換え、イベント処理、非同期通信（fetch）という3つの柱を押さえます。
作ったページが相手に届くまで
URLを入れてから画面が出るまでの一本道を、ドメイン・DNS・サーバー・HTML・ブラウザーの順に追いかけます。ローカルのファイルとの違いも整理します。
ブラウザの中で何が起きているか
パース → DOM構築 → レンダリング → JS実行。ブラウザーの中の4ステップが分かると、「表示が崩れる」「JSが動かない」がどの段階の問題か指させるようになります。
コンピュータと話す
コンピュータは日本語も英語も分かりません。0と1しか分からない相手にどうやって命令を伝えているのか。プログラミング言語という通訳と、どの言語にも共通する命令の部品を見ていきます。
JavaScriptに型をつける（TypeScript）
「実行するまで間違いに気づけない」を解決するTypeScript。型注釈・型推論・インターフェースと、Sassとまったく同じ「変換してから配る」形について。
Webページはメモ帳で作れる
Webページの正体は、ただのテキストです。メモ帳だけでページが作れる理由と、ブラウザーがHTMLファイルを受け取って表示するまでの流れを、実際のソースを見ながら確認します。
サーバってなにをしている人か
サーバは「頼まれたものを返してくれる人」。ただのパソコンとの違い、そのまま返す静的サーバーとその場で作って返す動的サーバーの違いを押さえます。