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
390
「Pythonの環境構築について」と記事作成で意識したこと
forcia_dev_pr
1
130
Neovim で VS Code みたいにコーディングする
forcia_dev_pr
1
140
なぜ・どうやって・何を書く? 〜技術記事を書く習慣の作り方〜
forcia_dev_pr
1
150
第8回ゆるふわオンサイト 解説スライド
forcia_dev_pr
0
91
第7回ゆるふわオンサイト解説
forcia_dev_pr
0
230
第6回ゆるふわオンサイト解説
forcia_dev_pr
0
230
よくわかるFORCIAのエンジニア旅行SaaSプロダクト開発編
forcia_dev_pr
0
750
Featured
See All Featured
Designing for Performance
lara
610
69k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
RailsConf 2023
tenderlove
30
1.1k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
970
Testing 201, or: Great Expectations
jmmastey
43
7.6k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
32
2.4k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
20
1.3k
The Cost Of JavaScript in 2023
addyosmani
51
8.5k
Rebuilding a faster, lazier Slack
samanthasiow
83
9.1k
Gamification - CAS2011
davidbonilla
81
5.4k
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