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
天下一 Dev Server 武道会 / World Dev Server Tournament
Search
Pちゃん
November 22, 2018
Programming
2
790
天下一 Dev Server 武道会 / World Dev Server Tournament
Pちゃん
November 22, 2018
Tweet
Share
More Decks by Pちゃん
See All by Pちゃん
API になろう / Let's become an API
p1ch_jp
0
3.1k
この先生きのこるためのPostCSS実践入門
p1ch_jp
1
1.4k
エンジニアのためのデザインの話
p1ch_jp
0
900
Other Decks in Programming
See All in Programming
Polarsの成長: v0.14からv1.0までの変遷と今後の展望
zerebom
1
350
3 Effective Rules for Success with Signals in Angular
manfredsteyer
PRO
0
120
Harnessing Large Language Models for Training-free Video Anomaly Detection
tereka114
1
1.3k
開発部に不満を持っていたCSがエンジニアにジョブチェンしてわかった「勝手に諦めない」ことの大切さ
sakuraikotone
28
16k
Prompt FlowによるLLMアプリケーション開発
yuto2000
1
1k
小さな開発会社を作った理由
polidog
0
1.9k
유연한 Composable 설계
l2hyunwoo
0
380
【Go言語】golangci-lintの使い方
tomo1227
0
280
ドメイン駆動設計の実践
masuda220
PRO
19
5.2k
Folding Cheat Sheet #7
philipschwarz
PRO
0
150
生成AIをkintoneに連携してみた
hideg
0
230
APIのない大学ログインWebサービスをWKWebViewとJavaScriptでアプリ化した話
akidon0000
1
330
Featured
See All Featured
Rebuilding a faster, lazier Slack
samanthasiow
78
8.5k
Java REST API Framework Comparison - PWX 2021
mraible
PRO
20
7.2k
4 Signs Your Business is Dying
shpigford
178
21k
How To Stay Up To Date on Web Technology
chriscoyier
784
250k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
248
20k
Side Projects
sachag
451
42k
Build The Right Thing And Hit Your Dates
maggiecrowley
28
2.2k
We Have a Design System, Now What?
morganepeng
46
7k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
189
16k
Designing Experiences People Love
moore
136
23k
Designing for humans not robots
tammielis
247
25k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
23
1.9k
Transcript
גࣜձࣾσΟʔɾΤψɾΤʔ ౻ݪ৻ଠBLB1$IBO ఱԼҰdev serverಓձ Frontend de KANPAI! #5
͜Μʹͪ
PͪΌΜͰ͢ @p1ch_jp
ීஈɺ6*σβΠφʔΛ͍ͬͯ·͢ɻ MyAnimeListͱ͔ɺϋοΧυʔϧͱ͔
ࣗݾհ·͍͍͋
ࠓ͓ੈʹͳͬͨͷͰ͢Ͷʂ
ࠓͱ͘ʹ͓ੈʹͳͬͨͷ w 4LFUDI w 6*ͭ͘ΔͷίϨ͕ϝΠϯ w "CTUSBDU w ͏ʮ࠷৽൛DPQZ@OFXʯΈ͍ͨͳ࣌ऴΘΓ w
/PXTI w ແྉͰ্ཱ͕ͪͬͯɺ84௨Δͷوॏͩ w /VYUKT w ࣗ੩తαΠτΛHFOFSBUFίϚϯυͰͭ͘ΔΈ͍ͨ ͳ༻ํ๏͕ଟ͔ͬͨ
͜ͷதͰϑϩΧϯͰ ΕΔͱͨ͠ΒNuxt͔ͳ( ˘ω˘)
ͱࢥͬͨͷͰ͕͢
Nuxt͕ศརͳ͜ͱͱ͔ Έͳ͞Μඦঝͩͱࢥ͏͠
5ؒͷLTͰઆ໌ͨ͠ͱ͜ΖͰ ʮͦΕͦ͏ʯͱͳͬͯ͠·͍ͦ͏ͳͷͰ
ࠓճ
OVYUHFOFSBUFͨ͋͠ͱʹग़ͯ͘Δ EJTUΛԿ͔͠ΒͷϩʔΧϧαʔόʔͰ ֬ೝ͢Δͱࢥ͏ͷͰ͕͢
ͦΕΛԿͰ֬ೝ͢Δͷ͕ྑ͍ͷ͔ͱ͍͏ χονͳΛ͍ͨ͠ͱࢥ͍·͢ɻ
ͱ͍͏Θ͚ͰվΊ·ͯ͠
ఱԼҰDev Serverಓձ
ࢀՃࢿ֨ w ϩʔΧϧͰΣϒαʔόʔ͕ͨͭ͜ͱ w Command Line InterfaceΛ͍ͬͯΔ͜ͱ
બखೖ
No1. python -m SimpleHTTPServer ϫϯϥΠφʔαʔόʔքͷॏ
No2. light-server (from npm)
No3. budo (from npm)
No4. serve (from npm)
ධՁํ๏ w ֮͑͢͞ w ୯७ʹίϚϯυΛԿจࣈͰݺΔ͔ w ৮Γ͢͞ w Γ͍ͨ͜ͱΛαοͱͰ͖Δ͔ w
ͦͷଞ w ػೳཏੑ࣮ͳͲ ࠓճҎԼͷ࣠ͰධՁ͍ͨ͠ͱࢥ͍·͢ɻ ֤Ͱɺ߹ܭຬͰ͢ɻ
1ճઓ֮͑͢͞
1ճઓ୯७ʹͦͷίϚϯυΛ ԿจࣈͰݺͼग़ͤΔ͔Ͱ͢
5จࣈҎԼͳΒ3 15จࣈҎԼͳΒ2 20จࣈҎԼͳΒ1 ͦΕҎ্ͳΒ0
1ճઓ֮͑͢͞ w QZUIPON4JNQMF)5514FSWFS w 26จࣈ1 w MJHIUTFSWFS w 11จࣈ2 w
CVEP w 4จࣈ3 w TFSWF w 5จࣈ3
2ճઓ৮Γ͢͞
2ճઓ৮Γ͢͞Ͱɺ Γ͍ͨ͜ͱΛαοͱͰ͖Δ͔Ͱ͢
ࠓճ
./distΛlocalhost:3000Ͱ ϗεςΟϯά͢Δͱ͍͏
͋Γ͕ͪͳγνϡΤʔγϣϯͰ ࢼͯ͠Έ͍ͨͱࢥ͍·͢
No1.python -m SimpleHTTPServer w 42จࣈ͔͔Δ w ͦͦEJTUΛϕʔεʹϗεςΟϯάΈ͍ͨͳ͜ͱ͕Ͱ͖ ͳ͍ͷͰDE͢Δඞཁ͕͋Δ w ͔ͳΓ࣮༻తͰͳ͍ͷͰ0
$ cd dist && python -m SimpleHTTPServer 3000
No2.light-server w 28จࣈͰ࣮ߦͰ͖Δ w ΦϓγϣϯײతͰΘ͔Γ͍͢ w 3 $ light-server -s
dist -p 3000
No3.budo w 20จࣈͰ࣮ߦͰ͖Δ w ΦϓγϣϯײతͰΘ͔Γ͍͢ ຊਓʹ༏͍͠ w 3 $
budo -d dist -p 3000
No4.Terve w 60จࣈͰ࣮ߦͰ͖Δ w EJTUΛϕʔεʹϗεςΟϯάΈ͍ͨͳ͜ͱ͕ઃఆϑΝΠϧܦ ༝Ͱ͔͠σΩͳ͍ w 2ճ͔Βserve -l 3000ͷ13จࣈͰ࣮ߦͰ͖Δ
w ͷͰ1͋͛ͪΌ͏ $ echo {\ public\ : \ dist\ } >> serve.json && serve -l 3000
3ճઓͦͷଞ
ͦͷଞͰΞϐʔϧͰ͖Δ͜ͱΛ όγόγ্͛ͯಠஅͱภݟͰՃ͍͖ͯ͠·͢ɻ
No1.python -m SimpleHTTPServer w ੈͷதͰҰ൪ΘΕ͍ͯΔϩʔΧϧαʔόʔͰ͢ʂʂ w ͦ͏ͩͶ w 1Ճ
No2.light-server w http2ʹରԠͰ͖Δ͜ͱΛചΓʹ͍ͯ͠Δʢ͍͢͝Ͷʣ w ػೳཏੑͳ͔ͳ͔͍͢͝ w IUUQTHJUIVCDPNUYDIFOMJHIUTFSWFS w 2Ճ
No3.budo w GitHub Star 1400͑Ͱ͢ʂʂʢͦ͏ͩͶʣ w ػೳཏੑ͕͍͢͝Ͱ͢ʂʂʢ͔ͨ͠ʹ͍͢͝ʣ w IUUQTHJUIVCDPNNBUUEFTMCVEP w
2Ճ
No4.Terve w GitHub Star 3400͑Ͱ͢ʂʂʢ͍͢͝Ͷʣ w 1Ճ
݁Ռൃද
ճઓ ճઓ ճઓ ߹ܭ QZUIPO MJHIUTFSWFS
CVEP TFSWF
ͱ͍͏Θ͚Ͱ
dev server
budo
·ͱΊ w ࠓճͷ༏উɺ৮Γ͢͞ɾػೳཏੑͷ໘͔Βbudoʹ ܾఆ w http2Λ༻͍ͨ͠ͱ͖light-serverΛ͏ͱྑͦ͞͏ w ͬͱଞʹྑͦ͞͏ͳͷ͋ΔͰʂΈ͍ͨͳͷ͋Ε࣍ճҎ߱ ͷϑϩΧϯͰୈೋճdev serverಓձ͍ͬͯͩ͘͞
ऴΘΓ