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
そのJavascript、全部TypeScriptにしちゃえ
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Taro Matsuzawa aka. btm
October 23, 2021
Technology
260
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
そのJavascript、全部TypeScriptにしちゃえ
Open Source Conference 2021 Online/Fall LT
Taro Matsuzawa aka. btm
October 23, 2021
More Decks by Taro Matsuzawa aka. btm
See All by Taro Matsuzawa aka. btm
OpenLayers ext TypeScript declarationの開発
smellman
0
650
平成生まれのためのUNIX&IT歴 史講座 ~番外編~
smellman
2
580
掛川城の点群データをiTownsで表示しよう
smellman
0
360
大容量SSDとOpenStreetMap
smellman
0
180
MapLibreとtile.openstretmap.jpで始めるベクトル地図プログラミング
smellman
1
670
国内向けタイルサーバの構築と運用について
smellman
0
1.8k
Python/Javascriptで読む点群
smellman
1
5.4k
日本のCommunity向け タイルサーバの現状
smellman
0
2.7k
Pythonで点群を読んでみよう
smellman
1
2.9k
Other Decks in Technology
See All in Technology
DatabricksにおけるMCPソリューション
taka_aki
1
240
AI時代の開発生産性は、個人技からチーム設計へ
moongift
PRO
2
200
Foxgloveについて 実際にExtensionを開発して公開するまでの話 / About Foxglove: The Story of Developing and Releasing an Extension
ry0_ka
0
210
DMM.com 購入改善推進チーム におけるCodeRabbitを用いた レビューフロー改善の一例
ysknsid25
2
620
シンガポールで登壇してきます
yama3133
0
110
穢れた技術選定について
watany
4
370
地域 SRE コミュニティ最前線 / SRE NEXT 2026 Discussion Night Track C
muziyoshiz
0
210
個人開発で育てる「大規模設計の苗床」 - AI時代の1人開発から始める業務への知識接続 / The Seedbed for Large-Scale Design - From AI-Era Solo Projects to Professional Knowledge
bitkey
PRO
0
160
「ちゃんとやっている」は独りよがりだった ― 不安に寄り添うインシデント対応へ / Towards incident response that addresses anxieties
chmikata
1
5.1k
AICoEでAIネイティブ組織への進化
yukiogawa
0
160
型は壁、Rustでもバグを直すな、表現できなくせよ
nwiizo
13
2k
ゼロをイチにする仕事が終わったあと
smasato
0
340
Featured
See All Featured
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Redefining SEO in the New Era of Traffic Generation
szymonslowik
1
360
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
2k
Thoughts on Productivity
jonyablonski
76
5.2k
How to Think Like a Performance Engineer
csswizardry
28
2.7k
The untapped power of vector embeddings
frankvandijk
2
1.8k
RailsConf 2023
tenderlove
30
1.5k
The World Runs on Bad Software
bkeepers
PRO
72
12k
Practical Orchestrator
shlominoach
191
11k
How to build an LLM SEO readiness audit: a practical framework
nmsamuel
1
800
Ten Tips & Tricks for a 🌱 transition
stuffmc
0
150
Conquering PDFs: document understanding beyond plain text
inesmontani
PRO
4
2.9k
Transcript
ͦͷJavascriptɺ શ෦TypeScriptʹͪ͠Ό͑ Taro Matsuzawa(@smellman)
ࣗݾհ ཧۭؒܥΤϯδχΞ ຊUNIXϢʔβձձ/Ұൠࣾஂ๏ਓOSGeoຊࢧ෦ཧࣄ/Ұൠࣾஂ๏ਓΦʔ ϓϯετϦʔτϚοϓϑΝϯσʔγϣϯδϟύϯϝϯόʔ ౦ژిػେֶOB/౦ژిػେֶCySecݱੜ breakcoreΫϥελ ͱݺΕͯ·͢
ʢୀࡁΈʣ
OSSͷ׆ಈ React NativeܥϥΠϒϥϦͷվम react-native-static-server (iOSରԠ), redux-persist (ϥΠϒϥϦΛ·Δ͝ͱ TypeScriptʹॻ͖͑Δ) ͳͲ OpenMapTilesϓϩδΣΫτͷߩݙɺཧؔ։ൃ༁
ckanext-spatial (Python3ରԠ) ͳͲ ͦͷଞɺؾ͕͘··ίʔυυΩϡϝϯτΛॻ͍ͯ·͢
redux-persist ReactͰΑ͘ΘΕΔঢ়ଶͷอ࣋Λ͢Δreduxʹؔ͢ΔϥΠϒϥϦ redux-persistΛ͏ͱঢ়ଶΛLocalStorage(Web)/AsyncStorage(React Native)ͳͲʹอ࣋ͯ͘͠ΕΔ εϚϗΞϓϦͰঢ়ଶΛอଘ͢ΔͷʹศརͳϥΠϒϥϦ
ಋೖΛݕ౼ͨ݁͠Ռ ϝϯςφϯε͕2͙Β͍์ஔ ϝϯςφʔ͕ډͳ͍ͱ͍͏issue͕์ஔ͞Ε͍ͯΔ Pull RequestԿ͔์ஔ ͳΜͱ͔͍ͨ͠
ιʔείʔυΛಡΜͰΈΔ οɺFlowͬͯΔ…
Flow FLOW IS A STATIC TYPE CHECKER FOR JAVASCRIPT Facebook͕࡞ͬͨJavascriptͷ੩తܕνΣοΧʔ
Javascriptʹແཧཧܕͷ֓೦ΛೖΕΔ ΊͬͪΌಡΈͮΒ͍ʼʻ
ܕೖΕΔͳΒ ͏TypeScriptͰ͍͍͡ΌΜʂ
͍͍͡ΌΜ Flow͕·͡ϝϯςφϯεͷํ͕Θ͔ΒΜ VSCode͕Flowͷόʔδϣϯ͕ҧ͏ͱΤϥʔΛు͖·͘Δ ͦ͜·ͰͪΌΜͱܕ͚͕͞Ε͍ͯΔΘ͚Ͱͳ͍ ໌ࣔతʹanyͬͯॻ͖͍ͨ͡ΌΜ͔͢
ͱ͍͏Θ͚Ͱ
ͬͨ͜ͱ શ෦TypeScriptԽɺFlowΛ໓ Travis CI͔ΒGithub Actions Eslint, rollup, ͦͷଞΖΖશ෦ॻ͖͠
ͱ͍͑ Ϛʔδ͞ΕΔ·Ͱϲ݄͔͔ͬͨ ཧ༝؆୯ɺϝϯςφʔ͕ั·Βͳ͔ͬͨ ઌɺϝϯςφʔͱίϯλΫτΛऔͬͯมΘΓͷϝϯςφʔ͕ग़ ݱͯͬ͠ͱίϝϯτ
ײँ
–ckalika “͜Μʹͪɺ͋ͳͨͷϓϧϦΫΤετʹΛ௨͢ͷʹ͕͔͔࣌ؒͬͯ͠·͍ɺਃ͠༁͋Γ·ͤΜͰͨ͠ɻࠓɺ ѱҙͷ͋Δͷҙຯͷͳ͍ͷؚ͕·Ε͍ͯͳ͍͔֬ೝͨ͠ͱ͜ΖͰ͕͢ɺ͜Ε...ɻຊʹײಈ͠·͠ ͨɻcreateAsyncLocalStorage()ʹkeysྻΛՃͯ͠Ұ؏ੑΛ࣋ͨͤΔͳͲɺࡉ෦ʹ·ͰؾΛͬͨ ྗʹײँ͠·͢ɻ ࠓͷͱ͜Ζςετ͋·Γ͍ͯ͠ͳ͍ͷͰɺ༧֎ͷ݁ՌʹͳΔՄೳੑ͋Γ·͢ɻͦ͠͏ͳͬͨΒɺέʔ εόΠέʔεͰରॲ͠·͕͢ɺࢲؒҧ͍ͳ͋͘ͳͨͷมߋηοτΛਐΊΔ͖ͩͱࢥ͍·͢ɻࡉ͔͍मਖ਼ ʢύοέʔδͷόʔδϣϯɺREADME.mdͷߋ৽ͳͲʣΛՃ͍͑ͨͱࢥ͍·͕͢ɺͦΕΒ͕Ͱ͖ͨΒɺتΜ ͰϚʔδ͠·͢ɻ TypeScriptͷҠߦͱΠϯϑϥͷۙԽɺඇৗʹॏཁͰҙٛਂ͍ࣄۀͰ͢ɻ͜ΕʹΑΓɺΑΓҰ؏ੑͷ͋
ΔɺΑΓଟ͘ͷςετΛߦ͏͜ͱ͕Ͱ͖ΔΑ͏ʹͳΓ·͢ͷͰɺվΊͯײँ͍ͨ͠·͢ɻ”
ۤ࿑ใΘΕΔ TypeScriptԽʹΑͬͯΑΓςετ͘͢͠ͳͬͨ શମతͳݟ௨͠ fl owͰத్ʹܕΛ͚ͭΔΑΓΘ͔Γ͘͢ ͳͬͨ(ओ؍ ͜ΕͰͬͱଞͷਓϝϯςφϯεʹՃΘΕΔΑ͏ʹͳͬͨ ͜͜ॏཁͰ͢Αʂ
·ͱΊ JavascriptͰॻ͔Ε͍ͯΔͷTypeScriptԽͨ͠ํ͕ྑ͍ྫ͋Δ ༐ؾΛͩͯ͠Pull RequestΛग़͢ͷ͕ॏཁ
͝੩ௌ͋͟·Δਫ࢈