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+Expressでサーバーサイド開発やってみた / typescri...
Search
Takahiro Tsuchiya
April 03, 2019
Programming
5
3.5k
TypeScript+Expressでサーバーサイド開発やってみた / typescript_express_debugging
TypeScript + Expressでサーバーサイド開発やってみた。主にツールやデバッグ周りの話をしました。ぜんぜんわからない、おれはふんいきでデバッグしている。
Takahiro Tsuchiya
April 03, 2019
Tweet
Share
More Decks by Takahiro Tsuchiya
See All by Takahiro Tsuchiya
Kaigi on Rails 2024 - Rails APIモードのためのシンプルで効果的なCSRF対策 / kaigionrails-2024-csrf
corocn
10
6.1k
現場のエンジニアから見た採用担当との協働
corocn
7
3k
シリーズAをリファラル採用中心に走り抜ける / leaner-referral-engineer-2024
corocn
3
2.1k
捨てて加速するプロダクト開発 / sutete-speedup-product-development
corocn
3
690
リファラル採用にフルベットしてみた
corocn
3
3.8k
エンジニアとプロダクトマネージャーを兼任した1年間を振り返る / pdm-furikaeri
corocn
17
8k
育休のすゝめ #devsumi 2023
corocn
3
4.9k
GCPでRubyを動かしている話 / ruby on gcp
corocn
0
940
フルリモートワーカーのデスク選定 / how-to-select-remote-work-desk
corocn
1
630
Other Decks in Programming
See All in Programming
チームのテスト力を総合的に鍛えて品質、スピード、レジリエンスを共立させる/Testing approach that improves quality, speed, and resilience
goyoki
5
920
PicoRuby on Rails
makicamel
2
130
AI コーディングエージェントの時代へ:JetBrains が描く開発の未来
masaruhr
1
180
Team operations that are not burdened by SRE
kazatohiei
1
310
RailsGirls IZUMO スポンサーLT
16bitidol
0
190
AIと”コードの評価関数”を共有する / Share the "code evaluation function" with AI
euglena1215
1
170
Webの外へ飛び出せ NativePHPが切り拓くPHPの未来
takuyakatsusa
2
560
Discover Metal 4
rei315
2
140
なぜ「共通化」を考え、失敗を繰り返すのか
rinchoku
1
650
XP, Testing and ninja testing
m_seki
3
250
おやつのお供はお決まりですか?@WWDC25 Recap -Japan-\(region).swift
shingangan
0
140
Google Agent Development Kit でLINE Botを作ってみた
ymd65536
2
250
Featured
See All Featured
The Language of Interfaces
destraynor
158
25k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
YesSQL, Process and Tooling at Scale
rocio
173
14k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
820
KATA
mclloyd
30
14k
Unsuck your backbone
ammeep
671
58k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
181
54k
The Pragmatic Product Professional
lauravandoore
35
6.7k
Producing Creativity
orderedlist
PRO
346
40k
Reflections from 52 weeks, 52 projects
jeffersonlam
351
20k
Statistics for Hackers
jakevdp
799
220k
Transcript
5ZQF4DSJQU &YQSFTTͰ αʔόʔαΠυ։ൃͬͯΈͨ TypeScriptษڧձ 2019/04/03ʢਫʣ Takahiro Tsuchiya / @corocn
@corocn ͜ΖͪΌΜ
ࣗݾհ • ࣄ: Ruby on Rails / AWS, GCP /
Vue.js • ڵຯ: WebAuthn / ύεϫʔυϨεೝূ • ෭ۀ: TypeScript + AWS bosyu ٕज़ॻࣥච Ξϯόαμʔ׆ಈ ٕज़ॻయ6 ʢدߘʣ nfug amanogawa.rb اըத ΤϯδχΞ࠾༻
ࠓͷ • TypeScript + Express ΛֶͿ࣌ʹͬͨ͜ͱ • ओʹ։ൃ࣌ͷίϯύΠϧσόοάํ๏શવ Θ͔Βͳ͔ͬͨͷͰͦͷ •
খωλʢ࣌ؒ༨ͬͨΒʣ
αʔόʔαΠυTS ॻ͍ͯΔਓʁ
։ൃʹ͋ͨͬͯಡΜͩͷ • “TypeScript Deep Dive” ඞಡ • Express ެࣜϦϑΝϨϯε Ұ௨Γ
• Express γϯϓϧͰ͔Γ͍͢ • middlewareͷΈͱΤϥʔϋϯυϦϯά पΓΛࡶʹ࣮Ͱ͖ͨΒΦοέʔ • ܕγεςϜৄ͘͠ͳ͍ͷͰదٓௐͳ͕Β
͜ΕͰຊʹΓग़ͤΔʁ
σόοάํ๏ʹ͍ͭͯ ͓͑ͯ͘ͱྑͦ͞͏ͩͧʁ
Node.js
Node.jsͷσόοά • console.log ͰؤுΔ • node —inspect dist/index.js • debugger
͕ىಈ • IDEʢVSCode/IntelliJʣ͍ͭ͜ʹΞλονͯ͠σόοά • —debug-brk ΦϓγϣϯΛ͚Δͱ1ߦͰࢭ·ͬͯ͘Ε Δ •
Node.jsͷσόοά (2) • debugger ͕ىಈ͍ͯ͠Δঢ়ଶͰ chrome://inspect ʹΞΫηε͢Δͱɺ Chromeͷ։ൃऀπʔϧͰσόοάͰ͖Δ •
Express
Expressͷσόοάʢϩάʣ • ڥม DEBUG Λࢦఆ͢Δ • DEBUG=* node —inspect dist/index.js
• DEBUG=express:router ͷΑ͏ʹߜΓࠐΊΔ • middlewareͷಡΈࠐΈॱ֬ೝͰ͖Δ • github.com/visionmedia/debug • const logger = require(‘debug’)(‘hoge’) • logger(‘hello world’) • DEBUG=hoge
None
։ൃπʔϧ
։ൃπʔϧ • Visual Studio Code Λਪ͢Δਓଟ • Rails։ൃʹRubyMineΛ͍ͬͯΔͷͰ TS IntelliJͰॻ͘͜ͱʹͨ͠
• ΩʔόΠϯυ͕֮͑ΒΕͳ͍͆ • εΠονϯάίετߴ͍ • σόοΨඇৗʹߴੑೳͳͷͰυγυγ͏͖
VSCode • launch.json Ͱઃఆ͢Εಈ͘ʢଟʣ • ՃೖΕΔΜͳ͠
IntelliJ • Edit Configurations ͔Β npm run ίϚϯυ ܦ༝Ͱىಈ •
ͪ͜ΒউखʹΞλονͯ͘͠ΕΔ
Α͏͘TypeScriptͷ
։ൃํ๏2छྨʁ • tsc ͰίϯύΠϧͯ͠ .js Λ࣮ߦ • ts-nodeͰ .ts Λ࣮ߦ
• ͔݁Βݴ͏ͱޙऀͷ͕ྑ͔ͬͨ
tsc ͷ߹ • tsc or tsc —watchʢincrementalʣ • src/**/*.ts =>
dist/**/*.js ͱม͢Δ • scripts: { dev: node —inspect dist/index.js, watch: tsc-watch —onSuccess ‘npm run dev’ } • tsc-watch ͰมߋݕˠίϯύΠϧˠ࠶ىಈ • IntelliJͩͱ1ճมߋݕͯ͠࠶ىಈ͢ΔͱϒϨʔΫϙΠϯ τ͕ޮ͔ͳ͘ͳΔͷͰͭΒ͍ɾɾɾʢόάʁʣ
ts-node ͷ߹ • ͦͦts-nodeͬͯͳΜͧ • TypeScript execution and REPL for
node.js • REPL: Read-Eval-Print Loop / ରܕධՁڥ • .ts ϑΝΠϧΛ࣮ߦͰ͖Δศར • scripts: { dev: node --require ts-node/register src/index.ts, watch: "nodemon --watch 'src/**/*.ts' --exec ‘ts-node’ src/index.ts” } • —exec ‘npm run dev’ ͬͯॻ͍ͨΒ͏·͘ಈ͔ͳ͔ͬͨ
ts-node ͷ߹ ʢଓ͖ʣ • IntelliJͷσόοΨͱͷ૬ੑͳ͍ • ϒϨʔΫϙΠϯτఀࢭதʹϑΝΠϧ࿔ΔͱόάΔ • js ʹมͯ͠ಈ͔͖ͩ͢ͱࢥ͍͕ͬͯͨɾɾɾ
• ຊ൪ ts-node Ͱӡ༻ͯ͠Δࣄྫ͋ΔΒ͍͠ • Φʔόʔϔουؾʹ͠ͳ͚Εͳ͠ʁ
ts-node ਪ TypeScript Deep Dive ͦ͏ݴ͍ͬͯΔ
͕࣌ؒ͋Ε༨ஊ
ϛυϧΣΞબఆ • ϩΪϯά: morgan • CORS: cors • ೝূ: passport
• ORM: ࣍ͷϖʔδͰ͢ • ඞཁͳͷἧ͍ͬͯΔ͕ࡉ͔͍ϥΠϒϥϦ͕ଟͯ͘ೖΕΔ ͷ໘ɻ • Express͡Όͳͯͬ͘ͱް͍ϑϨʔϜϫʔΫͷ΄͏͕͍ ͍͔ɻLoopbackͱ͔ʁ
Which ORM is best for Node.js? • Sequelieze.js • ฮ
• TypeORM • Ψνόά౿ΜͰ٧Ήɻߋ৽සΊ͔ • Objection.js + Knex.js • Ұ൪͔Γ͔ͬͨ͢
TypeSyncศར • ར༻ՄೳͳܕఆٛϑΝΠϧΛґଘʹಥͬࠐΜ Ͱ͘ΕΔ • github.com/jeffijoe/typesync • ϥΠϒϥϦΛೖΕΔ࣌ʹຖճ npm install
@types/hoge ͢Δͷ໘
·ͱΊ
ޮతʹ։ൃ͢ΔͨΊʹ σόοάํ๏͓͑ͯ͜͏