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
forcia_dev_pr
December 07, 2022
0
360
フォルシアのフレームワークとTypeScript
Shinjuku.ts#1 発表資料
forcia_dev_pr
December 07, 2022
Tweet
Share
More Decks by forcia_dev_pr
See All by forcia_dev_pr
"書く文化"を仕組みで育てる──フォルシアの技術ブログ継続戦略
forcia_dev_pr
1
140
新しいおもちゃを見つけたい私がやっている情報収集
forcia_dev_pr
2
380
「Pythonの環境構築について」と記事作成で意識したこと
forcia_dev_pr
1
120
Neovim で VS Code みたいにコーディングする
forcia_dev_pr
1
140
なぜ・どうやって・何を書く? 〜技術記事を書く習慣の作り方〜
forcia_dev_pr
1
150
第8回ゆるふわオンサイト 解説スライド
forcia_dev_pr
0
84
第7回ゆるふわオンサイト解説
forcia_dev_pr
0
230
第6回ゆるふわオンサイト解説
forcia_dev_pr
0
230
よくわかるFORCIAのエンジニア旅行SaaSプロダクト開発編
forcia_dev_pr
0
740
Featured
See All Featured
Designing Experiences People Love
moore
142
24k
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
Facilitating Awesome Meetings
lara
54
6.4k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
Fireside Chat
paigeccino
37
3.5k
Optimising Largest Contentful Paint
csswizardry
37
3.3k
Why You Should Never Use an ORM
jnunemaker
PRO
57
9.4k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Building a Modern Day E-commerce SEO Strategy
aleyda
42
7.3k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
331
22k
It's Worth the Effort
3n
185
28k
Transcript
フォルシアのフレームワークとTypescript 籏野 拓 2022.11.15 @Shinjuku.ts
Speaker • 籏野 拓 (Taku Hatano) • ソフトウェアエンジニア@フォルシア株式会社 ◦ webサイトの検索ページ(受注/SaaS)
◦ 社内のお役立ちツール開発など • 活動領域 2
フォルシアのWebフレームワーク変遷 aaaa 3 第一世代 第二世代 第三世代 - 世にWebフレームワークがない時代 ~CommonJSの時代 -
モジュールのrequireなどを自作 - 独自の仕組み/書き方が多い - 非同期の処理なんかも作られていてすごい 2018 2010年代初期 2000年代初期
フォルシアのWebフレームワーク変遷 aaaa 4 第一世代 第二世代 第三世代 - 世の中に便利なフレームワークがかなり広がった - webフレームワークを自作することに優位性はない
- Node.jsのモジュールを組み合わせて利用していく 2018 2010年代初期 2000年代初期
フォルシアのWebフレームワーク変遷 aaaa 5 第一世代 第二世代 第三世代 入社 への変遷で体験した「TSって素晴らしい!」を紹介 2018 2010年代初期
2000年代初期
当時は学習コストに対する懸念があった模様。。? →BUT. 学習コスト以上のメリットが間違いなくある! Typescript(Node.js)の選定理由 6 • 静的型付けが可能 • 利用者/ライブラリの多さ •
client/serverのコードを共有できることによる生産性
TSって素晴らしい!① 7 リクエストパラメータに(限らず)型を付けられる var params = request.params; // ...???? •
どんな値を持つのかわからない ◦ 初めてジョインするプロジェクトでは地獄。。。 • プログラムの途中で自由に書き換わる ◦ 気づいたら数値→文字列に変わっていることもよくある。。。
TSって素晴らしい!① 8 const params: APIParams = request.params; params. • 可読性がぐんと高くなる
◦ エディタの補完機能が強くなったり • 意図せぬ型を代入しようとすると怒ってくれる • OpenAPI定義と組み合わせて型やコードを自動生成すると さらに強固に型で守ることが可能 リクエストパラメータに(限らず)型を付けられる
TSって素晴らしい!② 9 インターフェースの概念が導入された interface InterfaceA { method1() : void; };
class ClassA implements InterfaceA { method1() : void{ console.log("ClassA - method1()"); } }; • インターフェースと実装を分離することができる。
TSって素晴らしい!② 10 アプリ開発者が意識せずとも、フレームワーク側で実装を切り替えられたり 実装1 C 実装3 C 実装2 C インターフェース
I 参考: TypeScript で学ぶインターフェース (抽象型) https://www.forcia.com/blog/001547.html
まとめ 11 一度型の恩恵を受けると、型のない生活には戻れません • 型は最低限のテストである • 型を利用することで実装を隠蔽できる
EOF