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 Bootcamp
Search
Recruit Technologies
June 02, 2017
Technology
9
42k
JavaScript Bootcamp
2017年4~5月開催「ブートキャンプ特別講座」の資料になります。
Recruit Technologies
June 02, 2017
Tweet
Share
More Decks by Recruit Technologies
See All by Recruit Technologies
障害はチャンスだ! 障害を前向きに捉える
rtechkouhou
1
700
Flutter移行の苦労と、乗り越えた先に得られたもの
rtechkouhou
3
12k
ここ数年間のタウンワークiOSアプリのエンジニアのチャレンジ
rtechkouhou
1
1.5k
大規模環境をAWS Transit Gatewayで設計/移行する前に考える3つのポイントと移行への挑戦
rtechkouhou
1
1.9k
【61期 新人BootCamp】TOC入門
rtechkouhou
3
42k
【RTC新人研修 】 TPS
rtechkouhou
1
41k
Android Boot Camp 2020
rtechkouhou
0
41k
HTML/CSS
rtechkouhou
10
51k
TypeScript Bootcamp 2020
rtechkouhou
9
46k
Other Decks in Technology
See All in Technology
TypeScript 上達の道
ysknsid25
23
5.1k
増え続ける脆弱性に立ち向かう: 事前対策と優先度づけによる 持続可能な脆弱性管理 / Confronting the Rise of Vulnerabilities: Sustainable Management Through Proactive Measures and Prioritization
nttcom
1
230
マルチモーダル基盤モデルに基づく動画と音の解析技術
lycorptech_jp
PRO
3
360
Power Automate のパフォーマンス改善レシピ / Power Automate Performance Improvement Recipes
karamem0
0
280
「育てる」サーバーレス 〜チーム開発研修で学んだ、小さく始めて大きく拡張するAWS設計〜
yu_kod
1
230
バクラクによるコーポレート業務の自動運転 #BetAIDay
layerx
PRO
1
390
「手を動かした者だけが世界を変える」ソフトウェア開発だけではない開発者人生
onishi
15
8k
【CEDEC2025】大規模言語モデルを活用したゲーム内会話パートのスクリプト作成支援への取り組み
cygames
PRO
1
570
AI コードレビューが面倒すぎるのでテスト駆動開発で解決しようとして読んだら、根本的に俺の勘違いだった
mutsumix
0
130
帳票構造化タスクにおけるLLMファインチューニングの性能評価
yosukeyoshida
1
210
AI エンジニアの立場からみた、AI コーディング時代の開発の品質向上の取り組みと妄想
soh9834
8
630
AI時代の知識創造 ─GeminiとSECIモデルで読み解く “暗黙知”と創造の境界線
nyagasan
0
180
Featured
See All Featured
Designing Experiences People Love
moore
142
24k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
7
770
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
Docker and Python
trallard
45
3.5k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Mobile First: as difficult as doing things right
swwweet
223
9.8k
Code Review Best Practice
trishagee
69
19k
Done Done
chrislema
185
16k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
29
9.6k
Raft: Consensus for Rubyists
vanstee
140
7k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
Transcript
JavaScript Bootcamp 2017, 11th April @ Recruit Technologies
JavaScript Bootcamp • ࠓͰ JavaScript Λ͍͢ • JavaScript ΛΔ •
JavaScript ͰΫϥΠΞϯτΛ࡞Δ • JavaScript ͰαʔόΛ࡞Δ
ͷલʹ • ϦΫϧʔτςΫϊϩδʔζͷ "ϑϩϯτΤϯυΤϯ δχΞ" ͷఆٛͯ͘ਂ͍ • HTML/CSS/JSΛۦͯ͠ΫϥΠΞϯτΛ࡞Δ *͚ͩ Ͱͳ͍*
• ωοτϫʔΫͷࣝαʔόͷجૅࣝ༗͢Δ্ ʹͦΕΒΛ౿·͑ͯαΠτશମͷϢʔβϏϦςΟɾ ύϑΥʔϚϯεΛ্͛Δਓ
ϦΫϧʔτςΫϊϩδʔζͷ ϑϩϯτΤϯυΤϯδχΞ
None
None
ࠓճͷBootcampͰ
͜ͷ͋ͨΓΛڭ͑·͢ɻ
͜ͷ͋ͨΓগ͠ڭ͑·͢ɻ
JavaScriptΛΔ
JavaScriptΛΔ • JavaScript ΛͱΓ͋͑ͣͬͯΈΔ • JavaScript ʹ৮ΕΔ • JavaScript ࠓੲޠ
JavaScriptΛͱΓ͋͑ͣͬͯ ΈΔɻ // ͜͜Ͱ Node.js ͕ೖͬͯΔਓ terminal Λىಈͯ͠ԼهͷίϚϯυΛ࣮ߦ͍ͯͩ͘͠͞ɻ $ node
-v v7.8.0 REPLΛىಈ͠·͠ΐ͏ $ node > // ͜͜Ͱ͏ JavaScript ͕ಈ͖·͢ɺ৭ʑͬͯΈ·͠ΐ͏ɻ > 1 + 1; 2 > var test = "abc"; test > function test() { ... var num = 2; ... return num; ... } undefined > test(); 2
JavaScriptΛͱΓ͋͑ͣͬͯ ΈΔɻ • ࣮ࡍʹHelloWorldΞϓϦΛ࡞ͬͯΈ·͠ΐ ͏ɻҎԼͷϑΝΠϧΛ࡞ͯ͠ɺ helloworld.jsͱ͍͏໊લΛ͚͍ͭͯͩ͘͞ɻ console.log('Hello World'); $ node
helloworld.js Hello World
JavaScriptΛͱΓ͋͑ͣͬͯ ΈΔɻ • ͏গ͠ڽͬͨ͜ͱΛͯ͠Έ·͠ΐ͏ // ϑΝΠϧͷதͰɺ࣍ͷྻΛද͢ɺม pets Λఆٛ͠·͠ΐ͏ɻ const pets
= ['cat', 'dog', 'rat']; // forϧʔϓΛ࡞ͬͯɺྻͷ֤จࣈྻ͕ෳܗʹͳΔΑ͏ʹมߋ͠·͢ɻ // forϧʔϓͷத࣍ͷΑ͏ʹͳΔͰ͠ΐ͏... pets[i] = pets[i] + 's'; forϧʔϓ͕ऴΘͬͨΒɺ console.log() Λͬͯྻ pets Λλʔϛφϧʹදࣔ͠·͠ΐ͏ɻ
JavaScriptΛͱΓ͋͑ͣͬͯ ΈΔɻ • ͔͜͜ΒԋशͰ͢ɻ $ npm install @recruit-tech/javascripting -g $
javascripting ͜ΕΛ࣮ߦ͠·͠ΐ͏ɻ ࣮ߦ͕ऴΘͬͨΒຊޠઃఆʹ্ͨ͠Ͱ্͔Βղ͍ͯΈ·͠ΐ͏ɺͳ͓ Introduction ͱ for ϧʔϓʹ͍ͭͯطʹ্ͷͰͬͯ·͢ͷͰɺҎԼͷΛͱ͖·͠ΐ͏ɻ # ਖ਼نදݱΛ͑ɺϧʔΫ # Arrays more # fizzbuzz 1࣌ؒҐͰʂʂʂ
͍͍ͩͨղ͚ͨΒ࣍ͷߨٛʹ ҠΓ·͢ɻ
JavaScript ࠓੲޠ • JavaScript ʮੈքͰ࠷ޡղ͞Ε͍ͯΔݴ ޠͰ͋Δʯͱ͞Ε͖ͯͨաڈ͕͋Γ·͢ɻ • ʮJavaScript ᠘ʯͱ͔Ͱݕࡧ͢Δͱͨ͘͞Μ ώοτ͢Δͱࢥ͍·͢ɻ
• JavaScriptͲͷΑ͏ʹͯ͠Ͱ͖ͨͷ͔ɺ· ͨͲ͏ਐԽ͍ͯ͠Δͷ͔Λղઆ͠·͢ɻ
ΩοΫΦϑʹߦ͔ΕΔํΩο ΫΦϑʹߦ͖͍ͬͯͯͩ͘͞ɻ
JavaScript ࠓੲޠ • Before JS: 1990 ɺ World Wide Web
Λݩ ʹ্࢙ͨ͠ॳͷϒϥβ͕Ͱ͖Δ Tim Berners Lee શͯͷGod Father ͪͳΈʹ͜ͷલ νϡʔϦϯάΛड
JavaScript ࠓੲޠ • Before JS: 1993 ถࠃཱεʔύίϯϐϡʔλ ݚڀॴʢ௨শNCSAʣ͔ΒMosaicϒϥβ͕ ग़Δ ը૾ͱςΩετ͕Ұॹʹ
ग़Δͱ͍͏ըظతͳ ϒϥβ
JavaScript ࠓੲޠ • Before JS: 1994 Netscape 1.0 released ॳMozillaͱ͍͏ίʔυ
ωʔϜɺʮNetscape ͱॻ͍ ͯMozillaͱಡΉʯͱݴΘ Εͯͨɻ
JavaScript ࠓੲޠ • ͬͱϒϥβʹಈ͖Λʂʂ ݺΜͩʁʁ
JavaScript ࠓੲޠ • ͬͱϒϥβʹಈ͖Λʂʂ ݺΜͩʁʁ ݺΜͰͳ͍ʂʂʂ
JavaScript ࠓੲޠ • ͬͺΓεΫϦϓτݴޠͩΑͶʔʂ
JavaScript ࠓੲޠ • ୭͔ʔ୭͔ࢯʔʔʂʂʂʂϒϥβʹεΫϦ ϓτݴޠΛ࡞Γ͍ͨ୭͔ʔʔʔʂʂʂʂʂ ݺΜͩʁʁ
JavaScript ࠓੲޠ • 1995: Netscape 2.0 ʹ Script ݴޠϕʔεࡌͤ ΔతͰ։ൃ։࢝
SchemeϕʔεͰ͍͍ͷʁ ͍ɺɺɺ͏গ͠JavaͬΆ͘ɺObject ࢦͬΆ͘པΉ
JavaScript ࠓੲޠ • ৽εΫϦϓτݴޠ Scheme ͱ Self (Smalltalk༝དྷͷݴޠ)ΛࠞͥͯJavaͷॻ͖ຯ Λਅࣅͨͷ ໊લԿʹ͠Α͏ɻɻɻ
JavaScript ࠓੲޠ • ৽εΫϦϓτݴޠ Scheme ͱ Self (Smalltalk༝དྷͷݴޠ)ΛࠞͥͯJavaͷॻ͖ຯ Λਅࣅͨͷ ໊લԿʹ͠Α͏ɻɻɻ
JavaScript ࠓੲޠ • ৽εΫϦϓτݴޠ Scheme ͱ Self (Smalltalk༝དྷͷݴޠ)ΛࠞͥͯJavaͷॻ͖ຯ Λਅࣅͨͷ Java͔ΒདྷͯΔ͠ɺ
Mocha ʹ͠Α͏ɻ
JavaScript ࠓੲޠ • Mocha => LiveScript ɺެࣜͳ໊લͬ͜ ͪʹܾఆʂʂʂ ͏ͪΐͬͱScriptݴޠͬΆ͍ํ͕ྑ͍ ͔ɻ
JavaScript ࠓੲޠ • 1995 9݄: Netscape Navigator 2.0 beta ϦϦ
ʔε LiveScriptϦϦʔεͨͧ͠ʔʂʂʂʂ
JavaScript ࠓੲޠ • 1995 12݄: Netscape Navigator 2.0 beta 3
Ϧ Ϧʔε LiveScript JavaScript ʹվ໊͠·͢ʢओʹϚʔέ ςΟϯάతͰɺJavaͷ໊ར༻ʣ
JavaScript ࠓੲޠ • 1995 12݄: Netscape Navigator 2.0 beta 3
Ϧ Ϧʔε ͪͳΈʹಉ࣌ظʹ ServerSide JavaScript ॳϦϦʔ ε Netscape Enterprise Server ੈքॳͷServer SideͰಈ͘JavaScript
JavaScript ࠓੲޠ • 1996: Netscape Navigator 2.0 ϦϦʔε!!! ϦϦʔεͨͧ͠ʂʂʂʂʂ
ޙ
JavaScript ࠓੲޠ • 1996: Netscape Navigator 2.01 ϦϦʔε!!! ϦϦʔεͨͧ͠ʂʂʂʂʂ ͰJavaScript
σϑΥϧτͰແޮ
JavaScript ࠓੲޠ • 1996: Netscape Navigator 2.01 ϦϦʔε!!! ϦϦʔεͨͧ͠ʂʂʂʂʂ ͰJavaScript
σϑΥϧτͰແޮ JavaScript͕ϒϥβͰಈ͔ͤΔ͜ͱʹ
Ұํͦͷࠒ
JavaScript ࠓੲޠ • 1995: Microsoft ͕ Internet Explorer 1.0 ߏ
ங Netscapeܸͩʂʂʂʂʂ
JavaScript ࠓੲޠ • 1995: IE 3.0 Ͱ JScript Λ࣮ Scriptݴޠͬͪ͜࡞ͬͨͧʔ
ୈҰ࣍ϒϥβઓ૪
JavaScript ࠓੲޠ • Netscape vs IE vs
IEଆɿJScript࡞ͬͨͥɺ͜Ε ͔ΒNetscape͓͔͚ͬΔͥ ώϟοϋʔ
Netscapeଆɿ ͍ɺJavaScript͕ಠࣗߏ จͩΒ͚ʹͳΔ
MSͷͰӴઓΛషΔ Netscape
ඪ४Խ W3C Ͱͳ͘ɺ Ϥʔϩού ͷ ECMA ஂମͰنఆ
͔ͯ͘͠ 1997 ECMAScript version 1 ੜ
1998 ECMAScript version 2 جຊతʹͪΐͬͱͨ͠fix
1999/12 ECMAScript v3: ਖ਼نදݱɺจࣈྻؔɺ try- catchߏจɺࣈϑΥʔϚο τ etc
ES v4 2000͔Βࡦఆ
JavaScript ࠓੲޠ vs ํશ͘·ͱ·Βͣɾɾɾɾ
ES v4 2000͔Βࡦఆ => ࢮ
ES v5 => ES3 ͔Βͷ࠷খݶ ηοτͰ࠶ߏ
2009: ES v5 => ES3 ͔Βͷ࠷খݶ ηοτͰ࠶ߏ JSON, strict mode,
getter/ setter,
ES v6 (ίʔυωʔϜ harmony)
JavaScript ࠓੲޠ ΈΜͳͰௐΛऔΓ·͠ΐ͏ͱ͍͏ҙຯͰharmony
2015: ECMAScript 6 ൃץ
2015: ECMAScript 6 ൃץ ΫϥεɺϞδϡʔϧɺΠςϨʔλɺ for/ofϧʔϓɺPythonελΠϧͷδΣ ωϨʔλɺΞϩʔؔɺ2ਐ͓Αͼ 8ਐͷϦςϥϧɺMapɺSetɺ WeekMapɺWeekSetɺϓϩΩγɺς ϯϓϨʔτจࣈྻɺletɺconstɺܕ
͖ྻɺσϑΥϧτҾɺSymbolɺ PromiseɺׂೖɺՄมҾ
ΊͪΌଟ͍
ࠓޙؒͰversionΛ্͛ͯ ͘ɺࠓES2017
ಘΒΕΔࣄɿ harmonyΛେʹ͠·͠ΐ͏
͜ͷߨٛͰͬͨ͜ͱ
✔
ͦΖͦΖΩοΫΦϑऴΘͬ ͨࠒͩ͠ɺ࣍ߦ͖·͠ΐ͏
JavaScriptͰΫϥΠΞϯτΛ ࡞Δ
✔
͜Ε͔ΒTODOཧπʔϧͷ WebΫϥΠΞϯτΛHTML/ CSS/JSͰ࡞ͬͯΒ͍·͢ɻ
࠷ऴܗଶ https://todo-manager- server.now.sh
JavaScript ͰΫϥΠΞϯτΛ࡞ Δ • Todoͷ֎؍Λ࡞Δ(HTML/CSS) • Todoʹಈ͖Λ༩͑Δ(JavaScript/DOM) • ΫϥΠΞϯτͷςετΛॻ͘
·ͣڥߏங
ڥߏங $ git clone https://github.com/recruit- tech/todo-manager.git $ cd todo-manager $
npm install $ npm start
HTML/CSS
HTML • ͱΓ͋͑ͣ TODOཧ༻ͷHTMLΛ࡞ͬͯΈ ·͠ΐ͏ɻ $ cd public $ vim
index.html
ͷߏஙͨ͠HTML <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Todo Manager</title> </head>
<body> <form method="POST" action="/todos"> <input type="text" > <input type="submit" > </form> <div> <ul> <li><input type="checkbox">test</li> <li><input type="checkbox">test</li> <li><input type="checkbox">test</li> <li><input type="checkbox">test</li> </ul> </div> </body> </html>
CSS • TODOཧ༻ͷCSSΛ࡞ͬͯΈ·͠ΐ͏ɻ • ࠷ॳʹϒϥβͰσϑΥϧτͰద༻͞ΕͯΔ cssΛ֎ͨ͢Ίͷreset.cssΛॻ͖·͢ɻ • ࣍ʹtodo.cssΛॻ͖·͢ɻ $ vim
public/css/reset.css $ vim public/css/todo.css
ͷߏஙͨ͠CSS $ git checkout css $ cat public/css/todo.css ֬ೝ͚ͨ͠Ε https://todo-manager-miiijpronq.now.sh
deployͷͨΊʹ $ npm run deploy ͰσϓϩΠͰ͖·͢ɻ ͠ϔϏʔʹ͍͍ͨ߹ $ npm install
now -g ͓ͬͯͬͯ͘ͱศརͰ͢ɻ
ΈΜͳ࡞্ͬͯ͛ͯΈ·͠ΐ ͏ɻ Ͱ͖ͨΒ npm run deploy Ͱ deployͰ͖·͢ɻ
͍Α͍Αຊ
JavaScript ͰΫϥΠΞϯτΛ ࡞Δɻ
JavaScriptͰΫϥΠΞϯτΛ࡞ Δɻ • Ұ୴ਖ਼ղݟͣʹɻී௨ʹ࡞ͬͯΈ·͠ΐ͏ • ͱ͍ͬͯํ͋ͬͨํ͕ྑ͍ͱࢥ͏ͷ Ͱํ͚ͩͰɻ • view ͱ
controller ͱ logic ͚·͠ΐ͏ɻ $ git checkout javascript // ਖ਼ղ
JavaScriptͰΫϥΠΞϯτΛ࡞ Δɻ • HTML͔ΒDOMΛͬͯlogicΛݺͼग़͢Λ ਖ਼֬ʹControllerͱݴͬͨΓ͢Δɻ • HTMLΛߏங͢ΔॴViewͱݺͿ͜ͱ͕ଟ ͍ɻ • Logic७ਮʹॲཧΛද͢ɺݟͨҎ֎ͷ෦
JavaScriptͰΫϥΠΞϯτΛ࡞ Δɻ • ཁݟͨʹؔ͢Δ෦ͱݟͨҎ֎ͷ෦ ʹ͖ͪΜͱ͚Δ͜ͱ͕ॏཁ • MVCͩͷMVVMͩͷFluxͩͷݴ͏ͷͦͷޙ • ԿͰ͜ΕΛ͚Δͷ͕ॏཁͳͷ͔ޙͰड़ Δ
ͱΓ͋͑ͣͬͯΈΑ͏ɻ
ΫϥΠΞϯτΛॻ͘ # public/js ҎԼʹԼهͷεΫϦϓτΛ࡞Δ controller.js - HTML͔ΒmodelͱviewΛܨ͙ͷ view.js - දࣔΛ࡞Δͷ
model.js - fetchͯ͠Λऔಘ͢Δͷ main.js - ΦϒδΣΫτཧɺىͱ࣮ͯ͠ߦ͞ΕΔͷ ίʔυΛͪΒݟ͠ͳ͕ΒҰॹʹॻ͍͍ͯ͜͏ɻ
https://todo-manager- mqcdoklvtw.now.sh
TestΛॻ͘
TestΛॻ͘ • ͖ͬ͞ݟͨͱݟͨҎ֎ͷ෦ʹ͚Ζͱ ݴͬͨͷςετͷͨΊ • ݟͨͷ෦ςετ͠ʹ͍͘ʢ͞Βʹසൟ ʹมߋ͕͋Δʣ • ݟͨͷςετϖΠ͠ͳ͍ࣄ͕ଟ͍ͷͰɺ ݟͨҎ֎Λςετ͢Δ
TestΛॻ͘ • ݟͨҎ֎ɺͭ·Γ model ͷςετͰ͖ Δɻ • ςετ͠ʹ͍͘ίʔυΛॻ͔ͳ͍Α͏ʹ͢Δɻ $ git
checkout test // ਖ਼ղ
TestΛॻ͘ • test Λॻ͘ʹͦͷ··ͰμϝͳͷͰAPI constantsͷ͕ࠩ͠ସ͑ΒΕΔΑ͏ʹ͢Δඞ ཁ͕͋Δɻ • ͜ΕΛ Test Double
ͱ͍͏ // globalͷͰࠩ͠ସ͑ΒΕΔΑ͏ʹ͓ͯ͘͠ɻ const TODO_URL = global.TODO_URL || '/todos'; const fetch = global.fetch;
ͱΓ͋͑ͣͬͯΈΑ͏ɻ
TestΛॻ͘ # test ϥϯφʔΛೖΕΔ $ npm install eater --save-dev #
mock ͷ fetch ΛೖΕΔ $ npm install node-fetch --save-dev # package.json ͷ scripts.test ͷͱ͜ΖΛҎԼͷΑ͏ʹ͢Δ ``` "test": "eater", ``` # test/client/todo.model.js Λॻ͍ͯதΛॻ͘
TestΛॻ͘ # test/client/todo.model.js Λॻ͍ͯதΛॻ͘ const assert = require('assert'); const test
= require('eater/runner').test; const agreedServer = require('agreed-server'); const fetch = require('node-fetch'); test('check todo instance', () => { global.todo = {}; require('../../public/js/model'); assert(global.todo.model) }); # npm test $ npm test
͜ͷߨٛͰͬͨ͜ͱ
✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔
✔
Կ͔࡞Δͷ͕Ұ൪ʹཱͭ
JavaScriptͰαʔόΛ࡞Δ
✔ Γ2ͭɺͪΌͬͪΌͱΓ·͠ΐ͏ɻ
TodoͰ࡞ͬͨMockͷαʔό Λຊʹม͑Δ
JavaScriptͰαʔόΛ࡞Δ • express ΛΠϯετʔϧͯ͠αʔόΛ࡞ͬͯ ΈΔ • npm install express —save
• express ͰstaticαʔόΛ࡞Δ • express ͰϦΫΤετΛॲཧ͢Δ
expressͱʁ • Web Application Framework ͷҰͭ • ॳظͷNode.jsͰҰੈΛ෩ᴆͨ͠ • ࠓͰ͔ͳΓݱͰΘΕͯΔ
expressͱʁ • جຊతʹϧʔλͷػೳͱmiddlewareͷػೳ • ࣮ϧʔλͷػೳmiddlewareͷػೳͷҰ෦ • పఈͨ͠middlewareϞσϧͱ͍͔ͭ͘ͷEasy ͳ͕ؔΈ߹Θͬͨ͞ͷ
JavaScriptͰαʔόΛ࡞Δ $ npm install express --save $ vim app.js ```
'use strict'; const express = require('express'); const app = express(); const PORT = process.env.PORT || 3000; app.use(express.static('./public/')); app.listen(PORT, () => { console.log(`Listening in ${PORT}`); }); ``` $ node app.js
JavaScriptͰαʔόΛ࡞Δ # APIͷΛฦ͢ $ npm install body-parser --save ``` 'use
strict'; const express = require('express'); const bodyParser = require('body-parser'); const todoRouter = require('./server/todo-router'); const app = express(); const PORT = process.env.PORT || 3000; app.use(bodyParser.json()); app.use(express.static('./public/')); app.use('/todos', todoRouter); app.listen(PORT, () => { console.log(`Listening in ${PORT}`); }); ```
࠷ऴܗଶ https://todo-manager- server.now.sh
͜ͷߨٛͰͬͨ͜ͱ
✔ ✔ ✔
૯ׅ
✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔
✔ ✔ ✔
͔ͳΓଟ͘ͷͱࠓҰͰ ॲཧ͖͠Εͳ͍͕ೖͬͨ ͣɻ
͜ͷࢿྉΈΜͳʹΔͷͱɺ githubͰ͍ͭͰݟΕΔΑ͏ ʹ͓ͯ͘͠ͷͰ֬ೝͯͩ͘͠ ͍͞ɻ
1 ໌ git ճͰ͢ɻ