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
kouki.miura
October 27, 2024
Programming
0
99
TypeScriptがなぜ必要だったか
TypeScriptを使用する理由についてまとめました。
kouki.miura
October 27, 2024
Tweet
Share
More Decks by kouki.miura
See All by kouki.miura
ゲームとかの最初に使い方を教えてくれるアレ
koukimiura
0
24
Claude Codeでゲーム開発デビュー
koukimiura
0
61
Vite+TypeScript+Vue.jsではじめるフロントエンドプロジェクト
koukimiura
1
49
リソース制限環境下でのローカルLLM構築術
koukimiura
0
97
フロントエンドのパフォーマンスチューニング
koukimiura
7
2.5k
医療系ソフトウェアのAI駆動開発
koukimiura
1
230
レポートから見る生成AIを活用したシステム開発.
koukimiura
0
160
AWSサービスの整理と使いたい機能の概要
koukimiura
1
89
生成AIによる PHP = Node.js 変換の検証
koukimiura
0
160
Other Decks in Programming
See All in Programming
ライブ配信サービスの インフラのジレンマ -マルチクラウドに至ったワケ-
mirrativ
2
270
TanStack DB ~状態管理の新しい考え方~
bmthd
2
350
Google I/O recap web編 大分Web祭り2025
kponda
0
2.9k
Scale out your Claude Code ~自社専用Agentで10xする開発プロセス~
yukukotani
9
2.7k
Nuances on Kubernetes - RubyConf Taiwan 2025
envek
0
200
Jakarta EE Core Profile and Helidon - Speed, Simplicity, and AI Integration
ivargrimstad
0
230
DockerからECSへ 〜 AWSの海に出る前に知っておきたいこと 〜
ota1022
5
1.8k
AI時代のドメイン駆動設計-DDD実践におけるAI活用のあり方 / ddd-in-ai-era
minodriven
23
9.1k
Updates on MLS on Ruby (and maybe more)
sylph01
1
130
サイトを作ったらNFCタグキーホルダーを爆速で作れ!
yuukis
0
670
開発チーム・開発組織の設計改善スキルの向上
masuda220
PRO
16
9k
STUNMESH-go: Wireguard NAT穿隧工具的源起與介紹
tjjh89017
0
390
Featured
See All Featured
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.6k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.6k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
1.1k
Docker and Python
trallard
45
3.5k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
283
13k
Building Applications with DynamoDB
mza
96
6.6k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
33
2.4k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Gamification - CAS2011
davidbonilla
81
5.4k
Writing Fast Ruby
sferik
628
62k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
36
2.5k
Transcript
TypeScriptがなぜ必要だったか 三浦 恒樹 (MIURA KOUKI) 診療情報管理士 上級医療情報技師 医用画像情報専門技師 ドゥウェル株式会社 2024.10.27
えびてく #4
長男が飼っている ハリネズミがアイコン INTRODUCE ・ドゥウェル株式会社 (医療系IT開発・導入会社)に所属 ・マネージャー(プレイング・マネージャー) ・仕事では Java,C#,Node.js / JavaScript,TypeScript
・趣味では PHP,Node.js / JavaScript ・3児の父 ・札幌PHP勉強会、JBUG札幌、JavaDO、ゆるWeb勉強会 等に参加
INDEX ・TypeScriptとは ・TypeScript年表 ・ソフトウェア業界の動向 ・JavaScriptで困ること ・開発コストシミュレーション ・SUMMARY
TypeScriptとは ・JavaScriptのスーパーセット JavaScript TypeScript 型注釈・型推論等
TypeScript年表 ・JavaScript/TypeScript
TypeScript年表 JavaScript(ECMAScript) TypeScript 1997/06 初版 1999/12 正規表現、try/catch例外処理、厳格なエラー処理 2009/12 strictモード、getter/setter、JSONライブラリ 2012/10
TypeScript0.8公開(型注釈、型推論、クラス等) 2013 TypeScript0.9 総称型のサポートを追加 2014 TypeScript1.0 新しいTypeScriptコンパイラ 2015/06 クラス、モジュール、イテレータ、for/ofループ 2016/06 べき乗演算子、Array.prototype.includes 2016/09 TypeScript2.0 null非許容型への対応 2017/06 async/await、SharedArrayBuffer、 Atomics 2017/02 TypeScript2.2 2018/06 オブジェクトに対するスプレッド構文、非同期イテ レーション、Promise.prototype.finaly 2018/07 TypeScript3.0 残りのパラメータと展開式のタ プル、タプル型を持つ残りのパラメータ 2019/06 Array.prototype.flat、 Array.prototype.flatMap 2020/06 オプショナルチェイニング演算子?.、Null合体演算 子?? 2020/08 TypeScript4.0 カスタムJSXファクトリ、 Variadic Tuple型 2022/11 TypeScript4.9 satisfies演算子 2023/06 配列操作メソッドの追加、#!(シバン) 2023/03 TypeScript5.0 decorators https://ja.wikipedia.org/wiki/ECMAScript https://ja.wikipedia.org/wiki/TypeScript
ソフトウェア業界の動向 ・事例 ・GitHubソースコード量
ソフトウェア業界の動向 ・事例 - LINE株式会社 120億PVの巨大サービス「LINE NEWS」を TypeScript化した話 https://logmi.jp/tech/articles/322702 ・arrayがわたるべきところでstringを渡していたバグを出してしまったので ・変数のデータ構造が分からない
・機能改修が安全に行えているのか自信がない ・他の言語機能で慣れ親しんできた言語機能がJavaScriptにない
ソフトウェア業界の動向 ・事例 - 株式会社サイバーエージェント 100万行の大規模なJavaScript製システムを TypeScriptに移行するためにやったこと https://developers.cyberagent.co.jp/blog/archives/34364/ ・オブジェクトを扱う時はその生成過程の調査から始まるだけではなく ・誤ったプロパティへのアクセスや代入 ・nullやundefinedチェックの不足
・数値を入れるはずの変数に文字列やオブジェクトが入っている → 型がわからないことに起因するバグの調査や修正が必要でした
ソフトウェア業界の動向 ・事例 - Sansan株式会社 TypeScript を導入して 1 年が経って感じた良 かったこと・困ったこと https://buildersbox.corp-sansan.com/entry/2021/06/24/110000
・実行する前にコードのエラーチェックができる(テストに近い役割) ・既存のコードのドキュメント代わりになり、読解を助ける ・より賢いコード補完が得られる
ソフトウェア業界の動向 ・事例 - 株式会社サイバーエージェント 8年運用したJavaScriptでの開発を段階的に TypeScript移行していくためにやっていること https://developers.cyberagent.co.jp/blog/archives/33492/ ・型がないためtypoによる不具合が少なからずあること ・インターフェイスが定義できないため共通で利用する部品の使い方の誤りによる不具合が少 なからずあること
・JavaScriptでの開発ではJSdocの@typedef, @param, @returnsを記載し、コメン トでインターフェイスを補足して運用していましたが、メンテナンスコストが高いため更新漏れ が発生していました ・開発メンバーが増えて開発が活発になるにつれ、上記のようなオーバーヘッドは増える一方 なので排除したい ・リファクタ時の心理的な負担を減らしたい
ソフトウェア業界の動向 https://innovationgraph.github.com/global-metrics/programming-languages
ソフトウェア業界の動向 https://github.blog/news-insights/research/the-state-of-open-source-and-ai/#the-most-popular-programming-languages
JavaScriptで困ること ・型エラー発見の遅れ
JavaScriptで困ること ・型エラー発見の遅れ プログラミング 単体テスト 結合テスト システムテスト 運用 型エラー混入 型エラー顕在化 ・エラーの検出が遅くなるほど、修正コストは増大する
→単体テストで「型エラー」を検出するためのテストを行うか... →プログラミング中に検出できる「仕組み」を利用した方が良い...Linter,Compiler
開発コストシミュレーション ・null参照 10億ドルの間違い ・undefined障害対応コスト
開発コストシミュレーション ・null参照 10億ドルの間違い https://ja.wikipedia.org/wiki/アントニー・ホーア
開発コストシミュレーション ・undefined障害対応コスト ・入院担当者(医師・看護師)の氏名に”undefined”と表示される → 修正コスト: 750,000円 ・条件更新ボタンで”undefined”を含むエラーメッセージが表示される → 修正コスト: 500,000円 ・マスタ未登録のエラータイトルに”undefined”が表示される → 修正コスト: 500,000円 調査 修正
テスト リリース ×20 調査 修正 テスト リリース ×10 調査 修正 テスト リリース ×10
SUMMARY ・TypeScriptはJavaScriptのスーパーセット ・TypeScriptはES2015(ES6)より2年以上先行してクラス機能等を実装 ・大規模案件を中心にJavaScriptからTypeScriptへの移行が進む ・GitHubソースコード量の伸び率からも、近年の人気の高さが伺える ・型エラーをプログラミング中に検出できるため、 手戻りコスト削減やプログラマーの心理的安全性に効果が高い ・10億ドルは2024.10.27時点で、1,522.8億円 ご清聴ありがとうございました。