Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
一か月半かけて、TypeScript本を写経した話
Search
ツノ
November 15, 2022
Programming
870
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
一か月半かけて、TypeScript本を写経した話
ツノ
November 15, 2022
More Decks by ツノ
See All by ツノ
エンジニア達の_完全に理解した_-コードでの契約ってなんだ_.pdf
2nofa11
1
200
Vite完全に理解した その1
2nofa11
2
310
年末年始に「chibivue」で Vueヂカラをつけた
2nofa11
0
290
「世界一流のエンジニアの思考法」 を完全に理解した
2nofa11
1
330
書籍「プログラマー脳」を完全に理解した
2nofa11
0
89
VuexからPinia移行に向けて
2nofa11
0
460
VueTestUtilbrのキホンの『キ』
2nofa11
0
180
Other Decks in Programming
See All in Programming
全PRの83%がAIレビューだけでマージできるようになった開発組織はその後どうなったか
athug
0
200
Laravel Boostに学ぶ、AIにPHPを書かせる技術 〜OSSの実装から蒸留するエージェント制御の王道〜
kentaroutakeda
3
500
ITヒヤリハットを整理してみた ~ライフサイクルと原因から考える再発防止策~
koukimiura
1
110
「正の参照」と 「負の導出」で組む ハーネスエンジニアリング
cottpan
1
150
作るコストが小さくなった時代 幸せに働くために改めて考えたいこと 〜エンジニアとして価値を出し続けるために注視している二分野〜
yuppeeng
0
120
ソフトウェア設計に溶けるインフラ ― AWS CDK のインフラ認識論
konokenj
2
600
AIキャラアプリkaiwaの低遅延音声通話基盤をどう作ったか - AWS Gravitonで支える低遅延・低コストAI Agent基盤
mogamit
0
180
The Bowling Game- From Imperative to Functional Programming - Part 1
philipschwarz
PRO
0
340
Built Our Own Background Agent at LayerX #aidevex_findy
layerx
PRO
5
2.4k
Terraform標準の組織で AWS CDKをどう使うか
mu7889yoon
1
320
ビデオ通話が繋がる0.2秒で何が起きているのか
supurazako
2
150
これからAgentCoreを触る方へトレンドはGatewayです
har1101
6
500
Featured
See All Featured
Paper Plane (Part 1)
katiecoart
PRO
1
9.7k
B2B Lead Gen: Tactics, Traps & Triumph
marketingsoph
0
180
The Mindset for Success: Future Career Progression
greggifford
PRO
0
430
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
3.9k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
23k
Imperfection Machines: The Place of Print at Facebook
scottboms
270
14k
Evolving SEO for Evolving Search Engines
ryanjones
0
240
So, you think you're a good person
axbom
PRO
2
2.1k
The Cult of Friendly URLs
andyhume
79
7k
Designing for Performance
lara
611
70k
Building Adaptive Systems
keathley
44
3.1k
Google's AI Overviews - The New Search
badams
0
1.1k
Transcript
一か月半かけて、 TS 本を写経した話 ツノ:@2nofa11
質問 どうやって開発言語の習得していますか?
「技術書」の読書術では プログラミング学習は以下の 3 つを意識する あくまで「手段」、「目的」を持つ 複数言語を習得する 動くものを作り、自分の手で確かめる
やったこと TypeScript を習得することを目的 「プロを目指す人のための TypeScript 入門」
具体的な写経内容 1. GitHub 上に Repository を作る 2. 書いてあるコードを黙々と写経&コミット コミットメッセージ:p•• 気になったとことをメモ
3. 書いたコードで気になったところは、 console.log で途中結果を出す
ルール 毎日 1 コミット以上 どんなに自明な内容でコーディングする
写経達成! 成果 ① 内容 ① 成果 ② 内容 ② 期間
9/28 ~ コミット 245 コミット ページ数 375 ページ ステップ数 1994 行 今年のコミット履歴
学んだこと例1-1 JavaScript の知識を学習(復習)することができた 分割代入(パターン = 式) ⇒ 実装できるレベルまで理解することができた const {
foo, bar } = obj; // objのプロパティを変数に const { num, obj: { bar }, } = obj; // objのプロパティがネストしていても分割代入可能 const arr = [1, 2, 3]; const { first, second, third } = arr; // 配列を変数に
学んだこと例1-2 非同期処理 ⇒Promise 文がスラスラ読めるようになった (前までは Promise チェーンへの理解が浅かった) const p =
readFile("foo.txt", "utf-8") .then(() => sleepReject(1000)) .then( (result) => { console.log("OK"); }, (error) => { console.log("E",error); );
学んだこと例2 TypeScript が「型安全である」ということが腑に落ちた! 写経前 文字列型や数値型があるから、JavaScript より安全...? 写経後 型レベルの算術やリテラル型&タプル型を駆使すると、 大規模開発でもコードの揺れがなくなる! TypeScript
の解像度を上げることができた
学んだこと例3-1 TypeScript の便利な機能を学ぶことができた 関数型の部分型関係 ⇒ 型安全かつ、自由度の高い設計が可能になる type HasNameAndAge = {
name: string; age: number; }; // S type HasName = { name: string; }; // T const fromAge = (): HasNameAndAge => ({ name: "John", age }); // 戻り値:S const f: () => HasName = fromAge; //SはTの部分型のため、戻り値TをSとみなせる
学んだこと例3-2 ジェネリクスと型引数 ⇒ 汎用性の高い関数が作成可能になる const generics = () => {
function repeat<T>(element: T, length: number): T[] { const result: T[] = []; for (let i = 0; i < length; i++) { result.push(element); } return result; } console.log(repeat<string>("a", 5)); // 文字列型でも使用可能 console.log(repeat<number>(0, 5)); // 数値型でも使用可能 };
課題 本の写経だけでは、100%理解はできない 現場のリアルなコードとは違う
学習方法自体の振り返り 登山のような達成感がある 正直、効率は悪い (自明でもコーディングする) でも、新たな発見があったりする (!!式 の仕組み等) 1 行 1
行の意味を理解して書いたのに、 忘れている部分も多数出てきている
EOL