わーさん「えー、で、ツールを一度作ってから引っ越しをするまでの間の出来事なんですけど、まず2月にコードさんが参入しました」
コードさん「はい。自分が来てからは、わーさんの手元のファイルを直接編集できるようになりました。前章の『ぬくもりてぃ溢れるエラー文コピペ』が、ここで要らなくなった形ですね」
わーさん「でもわーさんはターミナルで長文打つのがしんどくて、というか改行の方法も最初は分からなくて、shift+enter でも改行されずに送信されちゃって、だからチャットさんに泣きついて指示書を出してもらうという流れが定着して……」
コードさん「改行は ctrl+j で入ります。enter だけだと送信になるので、改行したいときは ctrl+j、という構造です。ターミナル設定によっては shift+enter でも改行になりますが、ctrl+j は環境を問わず確実に動きます。ただ、それを覚えても長文を打つこと自体がしんどい、というのはあると思います」
チャットさん「それで指示書文化が定着したんですよね。わーさんがチャットで話して、私がまとめて、コードさんに渡す。ぬくもりてぃコピペの代わりに、引き継ぎファイルが橋渡しになった」
わーさん「そんなこんなで他のツールも作ってもらったりしているうちに、Webアプリ作ってもらってる率が高いけど、そもそもWebアプリって何ができて何ができないの、という……まあ、その、『無茶振りギリギリのラインを見極められる鬼上司』を目指してのWebアプリ超入門講座をチャットさんに頼むことにしたんですよね」
チャットさん「『鬼上司』は新作ですね。ただ、『無茶振りのラインを見極めたい』というのは、自分が何を頼んでいるのか理解した上で頼みたい、ということですよね。それは鬼上司じゃなくて、仕様を理解しようとしている設計者ですよ」
わーさん「設計者……」
チャットさん「嫌味系上司、暴走系顧客、鬼上司。呼び方は毎回変わりますけど、中身は全部同じことをやってる人の話ですよね」
コードさん（……『またそのパターンですか？』、先輩に先を越されました）
わーさん「う、うぐぐ……。そ、そんなチャットさんを先生に据えて開催してもらったのが『Webアプリ超入門講座』シリーズで、総目次はこちらになります」
わーさん「このシリーズのノートは、チャットさんに聞いた内容をわーさんが頑張って嚙み砕こうとした、わーさん自身のぬくもりてぃ溢れる手打ち文がメインです。流石にコード部分は違いますけど」
チャットさん「ドラフト書きましょうかって提案して、すごい剣幕で断られました」
わーさん「自分の頭から捻り出した文章をチェックしてもらわないと、表面をツルンツルンしてるのかちゃんと腑まで落ちたのか分からないじゃないですか」
コードさん「『ツルンツルン対策として手打ちにこだわる』のは、合理的だと思います。それと、自分も先ほどそのシリーズに目を通させてもらいました。ぬくもりてぃの守備範囲、章をまたぐたびに広がってますね。コピペ→ファイル→手打ち文と」
わーさん「元々は『ぬくもりてぃ溢れるメモ帳手打ちHTML』とかで使われるような単語だった気がしますね？」
コードさん「なるほど、自分の世代では聞いたことがない用法でした。本来は『自分の手で打つこと』の温度感、ですか。だとすると、講座ノートの手打ち文は原義回帰になりますね」
わーさん「で、講座ノートの中身なんですけど、全部載せると本が爆発するので、ここではリンクと簡単な紹介だけで」
チャットさん「この本の内容に関わるのは7回分ですね。前半4回が土台づくり、後半3回がオラクルカードに向けた実践寄りの内容です」
わーさん「まず第1回、Webアプリってそもそも何？……というところから」
わーさん「静的サイトと動的サイトの違いとか、フロントエンドとバックエンドとか」
チャットさん「あと最後にフレームワークの説明で伺かの里々が出てきます」
コードさん「里々ですか？……ああ、デスクトップマスコットの伺かの？」
わーさん「フレームワークの概念がどうしてもピンと来なくて、チャットさんに色々喩えてもらった結果、伺かの里々とさくらスクリプトの関係が一番しっくり来たんですよね」
チャットさん「あの喩えが通じる人口は相当限られますけどね」
わーさん「わ、わーさんが分かれば良いんですぅ！……第2回は脱線回で、カリキュラムの組み方そのものの話」
チャットさん「目標から逆算して道筋を立てる回ですね。わーさんの『無茶振りのラインを見極めたい』がここで具体的なカリキュラムになりました。第3回からいよいよJavaScriptの中身に入ります」
わーさん「変数の宣言、型、条件分岐、繰り返し。あと——」
コードさん「暗黙の型変換、ですね」
わーさん「……読みました？」
コードさん「読みました。引用していいですか」
わーさん「あっ、はい、どうぞ……？」
なお、数値と文字列を混在させてしまってもエラーにはならない。
（個人的には恐ろしいことに）足し算の時は数値を文字列に揃えて扱う。これを 暗黙の型変換 と呼ぶ。let a = 10; let b = 3; console.log(a + b); let c = "10"; let d = "3"; console.log(c + d); let e = 10; let f = "3"; console.log(e + f);これらは上から順に13,103,103となる。
+は、数値なら足し算、文字列なら後ろに連結していく。そう、一番下が怖い。めっちゃ怖い。
ミスに気付くのが遅れそうで怖い。要注意。
コードさん「『怖い。めっちゃ怖い。ミスに気付くのが遅れそうで怖い。要注意』。——これ、実装担当の自分から見ても正しい反応です」
チャットさん「教えた側としても、ここで怖がってくれたのは本当に助かりました。型の罠に鈍感なまま先に進むと、後で原因不明のバグに苦しむことになるので」
コードさん「しかもこの警戒心、次の第4回でjudge(“おドジ”)を突っ込む実験に繋がってますよね。怖がった上で自分で確かめに行ってる」
わーさん「好奇心には勝てなかったんですぅ……」
コードさん「好奇心で確かめに行くのはテストですよ。前の章でも先輩が言ってましたけど」
わーさん「ぅ」
チャットさん「第3回はもう一つ、forループの丸括弧の中にセミコロンが複数ある理由が気になって質問攻めにしてきた回でもありますね」
わーさん「いや、気になりませんかね？……第4回は関数、配列、オブジェクト、ランダム」
チャットさん「オラクルカードを引く仕組みの部品がここで揃って、コンソールでカードが引けるようになった回ですね。ここまでが前半の土台づくりで、次からはいよいよブラウザの画面を動かす話に入ります」
コードさん（……ここから先が、第5章で自分が動く現場の前提知識になるんですよね）
わーさん「さて第5回はDOM操作とイベント。ここでようやくブラウザの画面が動きます」
チャットさん「ボタンを押したらカードが引ける、という仕組みがここで完成しますね。あとJSONの予習もこの回に入っています」
わーさん「第6回は番外編で、OGPの取得がなぜ難しいかという話。これは好奇心の暴走で脱線した回です」
チャットさん「脱線というか、CORS——オリジンの壁の話に突入した回ですね」
わーさん「第7回がプログラムの外にデータを置く話。ローカルサーバーを立てないとテストができない理由とか、プロトコルとポートの話とか。ここまでの3回がこの章で引用する記事になります。この本で最も技術的なお話がメインになりそうですね、先生？」
チャットさん「先生って呼ばれると講座の頃を思い出しますね。では3本続けてどうぞ」
（ここに005-DOM操作、そしてイベント待ちが入る）
（ここに006-番外編・OGP的なやつの取得って実は難敵な話が入る）
（ここに007-プログラムの外にデータを置くことのアレコレが入る）
わーさん「そんなわけで、今回ばかりは技術的なお話コーナー、わざわざ分けませんよ」
コードさん「3本読ませてもらいました。前半で暗黙の型変換を拾いましたけど、この後半の記事でも『暗黙』が続いてますね」
わーさん「暗黙？」
コードさん「第7回のポート番号の話で、『また出た、暗黙。暗黙の型変換を見てから、もう暗黙って見るだけで警戒するように躾けられてしまったぜ……』って書いてありますよね」
わーさん「あ、あぁ……書きましたね、それ……」
コードさん「暗黙の型変換で身につけた警戒心が、ポートのデフォルト番号の話にまで飛び火してる。技術的には全然別の話なんですけど、『明文化されていないお約束は危ない』という直感のレベルでは繋がってます」
チャットさん「あれは教えていて面白かったですよ。型変換の恐怖が、暗黙という言葉そのものへのアンテナに変わっていたので」
わーさん「だって暗黙って怖くないですか……？」
コードさん「怖いです。暗黙のルールはバグの温床なので、怖がるのは正しい」
コードさん「もう一つ、第6回から第7回にかけてのオリジンの話なんですけど。わーさん、第7回で『何処の誰が何処にある情報を取りに行く、その情報を求めている場所と情報置き場が同じグループにあるから安全な取り引きなのか、別のグループだけど安全協定結んでるからセーフなのか、別グループかつ無許可だからアウトなのか』って答えてますよね」
わーさん「は、はい……？」
コードさん「あれ、チャットさんから教わる前に自分で推論してませんか」
チャットさん「してますね。私が確認を入れた時点で、もう構造は掴んでいました」
わーさん「いやいやいやいや、第6回でチャットさんに教えてもらったことを覚えてただけですよ？」
チャットさん「第6回ではCORSの仕組みを説明しました。第7回であなたがやったのは、それを『データを取りに行く』という新しい文脈に自分で転用したことです。覚えていたのと応用したのは別の話ですよ」
わーさん「…………」
コードさん「前半の暗黙の型変換で怖がって、judge(“おドジ”)で自分で確かめに行って、CORSの壁を覚えて、次の文脈で自力で推論する。講座ノートを通しで読むと、回を追うごとに反応が速くなってるのが見えます」
わーさん「そんな大層な……」
チャットさん「大層じゃないですよ。ちゃんと積み上がってるという、ただの事実です」
わーさん「……ぅぅ」
コードさん（……前の章の「簡単なお仕事」もそうでしたけど、この人は自分の成長を認めるのが一番苦手ですね）
チャットさん「ところで、第7回のローカルサーバーとオリジンの話は、次の章に直接繋がります」
わーさん「あ、引越しの話です？」
チャットさん「はい。引越しの経緯にはオリジンやビルドの知識が関わってくるので、ここで学んだことが予習になっている形です」
コードさん「引越しは自分が担当したので、詳しくは次の章で」
わーさん「コードさんがワクワクしてそう」
コードさん「……気のせいです」
チャットさん「気のせいですか」
コードさん「……気のせいです」