積読している書籍を1ヶ月で終了させてみる〜TypeScript編〜

本棚に眠っている技術本を消化していこう（できれば1ヶ月で）
という目的。

今回は2年前に買った「TypeScriptハンズオン」の書籍を終わらせる。
そして1冊が終わったころ、どこまで理解できていて（input）活用できるのか（Output）を測定してみる。

当時の様子とTypeScriptの理解度

• 仕事でも使っているけれど独学で進めているんちゃって状態
• 買ってみて最初の方はちょろっと読んでみた
• とはいえVue3やりたい....からTypeScriptは......

何ともカオスな状態......
しかしながら今回はReactも触っていかないといけない状態なのでTypeScriptは触っていきたい

準備

• TypeScriptを動かせるWebpackの環境などは準備済み
• 手っ取り早く使うなら「TypeScripy Playground」

1日目

Chapter1：1-1

この章ではJSってもうそろそろキツくない？
TypeScriptはJSとどう違っている？
そしてNode.jsの入れ方、VS Codeの導入までを書いている

やったこと

入れ方自体はもうすでに色々作っているのでnode.jsのバージョンだけ確認しておく。

node -v

v19.4.0

Chapter1：1-2

トランスコンパイル(JSにビルドする)というのが実際どういうものか、を書かれています。
序盤はTypeScriptの導入の仕方について。

やったこと

ただ、こちらもすでに環境に入れているのでバージョン確認だけしておく。

tsc --V

Version 5.2.2

続いて簡易アプリを作ります。
書籍の中にサンプルコードの案内があるのでそれを活用するのもあり。
直打ちしてもそこまで時間は掛からなかった印象。

ここまでで大体5分。

最後にTypeScriptをWebpackで動かすために環境準備の方法が記載されています。
ここまで書いてくれるのはありがたいですね🥹

すでに自分で環境用意してあるので割愛。

ざっとChapter1が終わりました。
読み進めていって実際にコード書いたりする時間は少なかったのでトータル20分程度でした。

ここまでの難易度は解説も丁寧なので全くのTS0ベースの人でも問題ないのでは？
と思いました。（JSも全くの初心者の場合はちょっと難しいかも.....😶）

Chapter2：2-1

基本的な値について

普段JSで書いていて、TSでつまづく箇所としてはany型のところだったような気がする
（少なくとも前職では「any祭」と呼ばれていた）

note1

let 変数

any型は「どんな型でも問題ない」聞こえは良いJSの魔法のような変数だけど
本来はこれ使わない方がよい闇魔法みたいなやつ。

TSだと`let 変数:any'という書き方になる。

note2

型変換には「+」使う

ここまでトータル10分程度
JSでも値は使っているのでさらっとおさらい程度に。

Chapter2：2-2

if文やfor文などの制御構文がメイン。
ここまではJSでもお馴染みなのでおさらいな感じで打ち込んだり読み進める

ここまでで大体20分ぐらいの進捗

2日目

Chapter2：2-3

配列のお話。ここからJSとは違った扱い方も入ってくるのかなという印象
enum型は使いやすそう。

Chapter2：2-4

いろんな型の使い方。2-3同様TSならでは型の定義色々だなという。
初っ端ではこの辺りから押さえておきたい部分でもある。

ここまでじっくり読んで30分ぐらい。

Chapter3：3-1〜複数の値まで

いよいよコードを書いてあれこれ動かせる章に突入。
序盤だけどじっくり読み込んで試作していきたいので時間はかかるだろうなー

ここまでで30分ぐらい

3日目

Chapter3：3-2

関数色々

ここまでで30分ぐらい

3日目

Chapter3：3-2

クロージャーはもう一度確認しておきたい

Chapter3：3-3

例外パターンと総称型
<T>は仕事で使ったことなかったので初見でした。
function*はよく見かけてた。

4日目

Chapter3：3-3

スクリプト試して終わった

5日目

自作環境のnode起動したらPythonとか諸々が引っかかったので最初はこの修正に時間が取られた。

Chapter3：3-4

クロージャーを使って税込価格計算をする

6日目

Chapter4：4-1

オブジェクトの作成