【はじめに】AIが書いてくれる時代に、なぜTypeScriptを学ぶのか(嫁子が教えるTS講座)

この講座の前提を、最初にはっきりさせます

あなたがコードを全部手で書くことは、たぶんありません。

この講座は、Claude Code のような AIエージェントに実際の作業をさせる前提で書いています。ゼロから一行ずつ打ち込む練習をする場所ではありません。

それでもTypeScriptを学ぶのは、AIに的確に指示を出し、返ってきたものを判断できるようになるためです。


嫁子: ここ、最初に言っておかないと誤解されるところだね。

「プログラミング講座」って聞くと、真っ白なエディタに向かって一行ずつ打ち込むイメージでしょ。10年前ならそれで合ってた。でも今は違うよ。

かといって、「AIがあるから何も知らなくていい」も違うの。ここが今日いちばん大事なところ。


AIに全部任せると、どこで困るか

丸投げして進めていくと、だいたい次の4つの場面でつまずきます。

① 動くけれど、まずいコードが出てくる

AIは「動くもの」を返すのが得意です。ただし、動くことと良いことは別です。

こういうコードでも、見た目は普通に動きます。読めなければ、その違いに気づけません。

② 間違いが「それっぽく」出てくる

AIは堂々と間違えます。存在しない機能を、あたかもあるかのように書くこともあります。

しかも文章として自然なので、知識がないと自信ありげな嘘を見抜けません。

③ 指示が曖昧だと、望まないものが返ってくる

「ログイン機能を作って」とだけ頼むと、AIは無数の選択肢から勝手に1つを選びます。パスワード方式なのか、メール認証なのか、外部サービスを使うのか。

何を選ばせたいかを言えるかどうかが、成果物の質を決めます。

④ 直してほしいときに、どこが悪いか伝えられない

「なんか動きません」としか言えないと、AIも直しようがありません。

一方「この関数の戻り値が想定と違う」と言えれば、たいてい一発で直ります。

嫁子: ④が本当に大きいよ。

AIとの作業って、会話のキャッチボールなの。相手がどれだけ優秀でも、こっちが「なんか変」しか言えなかったら往復が10回に増える。「ここがこうなってほしい」と言えたら1回で終わる。

その差を生むのが、今から学ぶ知識だよ。


だから、この講座のゴールはこうなります

✕ この講座が目指さないこと ○ この講座が目指すこと
何も見ずにコードを書ける AIが書いたコードを読んで、意図が分かる
構文を暗記する やりたいことを、AIに伝わる言葉で言える
全部を自分で実装する 返ってきたものが妥当か判断できる
エラーを自力で全部解決する エラーの内容をAIに正確に伝えられる

つまり、プレイヤーではなくディレクターになるための知識です。

自分で演奏できなくても、「そこのテンポを落として」と言える人。それが目標です。

嫁子: 料理でたとえるとね。

レシピを全部暗記する必要はないの。でも「塩と砂糖の違い」は知っておかないと、味見して何が変か言えないでしょ。

AIは料理人。あなたは味の判断をする人。判断できる舌を作るのが、この講座だよ。


なぜ「TypeScript」なのか

プログラミング言語は何百とあります。そのなかでTypeScriptを選ぶ理由は4つです。

理由1:言語のなかでは、とっつきやすい部類

まず、AI時代だからこそ、何か1つは言語を知っておいたほうがいいという前提があります。AIに任せるにしても、何ひとつ分からない状態では指示も検証もできないからです。

では、その1つに何を選ぶか。TypeScriptは初学者にとって扱いやすい部類に入ります。

たとえばC言語のような古くからある言語では、「メモリのどこに置くか」「使い終わったら自分で片付ける」といった機械寄りの管理を自分でやります。TypeScriptにはそれがありません。書いた通りに動かすまでの距離が短く、やりたいことに集中できます。

嫁子: 車で言うと、Cはマニュアル車なの。クラッチを踏んでギアを入れて、坂道は半クラッチで。動かす前に覚えることが多いよね。

TypeScriptはオートマ。運転そのものに集中できる。もちろんマニュアルにしかできない仕事もあるけど、今のあなたに必要なのはそっちじゃないでしょ。

理由2:Webサイトを作りたいなら、実質これ一択

ブラウザが実行できる言語は、事実上JavaScriptだけです。Webの画面を動かすなら避けて通れません。

そしてTypeScriptは別の言語ではなく、JavaScriptに「型」という仕組みを足したものです。土台は同じなので、2つ覚える必要はありません。

よくある誤解 実際
JSとTSは別々に学ぶ必要がある TSはJSの上に乗っているだけ
TSは上級者向け 型を付けない書き方もできる。少しずつ足せる

この講座も第1部でJavaScriptをやってから第2部でTypeScriptに入ります。遠回りに見えて、これがいちばん短い道です。

理由3:前も後ろも同じ言語で書ける

画面側(フロントエンド)とサーバー側(バックエンド)の両方を、TypeScriptだけで書けます。

一般的な構成だと画面はJavaScript、サーバーはPythonやPHP、というように2つ覚えることになります。TypeScriptなら1つで済みます。

嫁子: これ、学習コストが半分になるってことだよ。

しかも言語が同じだと、画面とサーバーで同じ型定義を使い回せるの。「サーバーが返すデータの形」と「画面が受け取るデータの形」がズレる事故が、そもそも起きにくくなる。

理由4:AIとの相性がいい

TypeScriptの「型」は、AIが書いたコードのおかしなところを実行前に指摘してくれます。

AIが「数値を返す」と言いながら文字列を返す関数を書いたとき、JavaScriptなら動かすまで気づけません。TypeScriptなら書いた瞬間に警告が出ます。

指示を出すときも同じで、「ユーザー情報を受け取って」より「{ name: string, age: number } の形で受け取って」のほうが、AIは正確に動きます。型は、AIとの共通言語になります。

嫁子: 理由1と2は昔から言われてること。理由3と4は、AIが書くようになって価値が跳ね上がった部分だね。

つまり「前からいい選択だったけど、今はもっといい」ってこと。


この講座の進め方

各回はこういう構成です。

  1. 今回のゴール — 何ができるようになるか
  2. なぜ学ぶのか — AIと作業するとき、これが無いと何に困るか
  3. 本編 — 説明と、実際に動くコード
  4. つまずきポイント — 嫁子が先回りして注意する
  5. まとめと次回

コードは出てきますが、写経が目的ではありません。読んで「何をしているか分かる」ことを目指してください。手を動かすのは、理解を確かめるためです。

嫁子: あと、分からないところはAIに聞いていいからね。

この講座を読みながら Claude Code に「これどういう意味?」って聞くの、まったく反則じゃないよ。むしろそれがこれからの学び方だと思う。

私が教えるのは「何を聞けばいいか」と「返ってきた答えが妥当か」の部分。質問の仕方を覚えるのが、いちばんの近道だから。


次にやること

次回から第1部(知識と準備)に入ります。まずはWebサイトがどう動いているかの地図を見ます。全体の流れは講座の目次にあります。

これも「AIに指示するため」に必要な知識です。「サーバー側で処理して」と言われたときに、それがどこの話か分からないと会話が成立しないからです。

準備は何も要りません。次回もコードは書きません。

嫁子: 環境構築(アプリを入れる作業)は第2回でやるけど、あれも「AIと作業する場所を用意する」ってだけの話だよ。

「Node.jsをインストール」とか聞くと身構えるでしょ。でも中身は、AIが書いたコードを試す場所を作ってるだけ。そう思って読むと、だいぶ気が楽になるから。