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
950
天下一 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.4k
この先生きのこるためのPostCSS実践入門
p1ch_jp
1
1.5k
エンジニアのためのデザインの話
p1ch_jp
0
930
Other Decks in Programming
See All in Programming
Range on Rails ―「多重範囲型」という新たな選択肢が、複雑ロジックを劇的にシンプルにしたワケ
rizap_tech
0
6.7k
Pull-Requestの内容を1クリックで動作確認可能にするワークフロー
natmark
2
520
Software Architecture
hschwentner
6
2.3k
はじめてのDSPy - 言語モデルを『プロンプト』ではなく『プログラミング』するための仕組み
masahiro_nishimi
2
550
Cursorハンズオン実践!
eltociear
2
1.1k
CSC509 Lecture 03
javiergs
PRO
0
340
PHPに関数型の魂を宿す〜PHP 8.5 で実現する堅牢なコードとは〜 #phpcon_hiroshima / phpcon-hiroshima-2025
shogogg
1
240
非同期jobをtransaction内で 呼ぶなよ!絶対に呼ぶなよ!
alstrocrack
0
970
『毎日の移動』を支えるGoバックエンド内製開発
yutautsugi
2
250
AI Agent 時代的開發者生存指南
eddie
3
1.7k
そのpreloadは必要?見過ごされたpreloadが技術的負債として爆発した日
mugitti9
2
3.4k
3年ぶりにコードを書いた元CTOが Claude Codeと30分でMVPを作った話
maikokojima
0
500
Featured
See All Featured
The Illustrated Children's Guide to Kubernetes
chrisshort
49
51k
A designer walks into a library…
pauljervisheath
209
24k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
The Invisible Side of Design
smashingmag
302
51k
How GitHub (no longer) Works
holman
315
140k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
132
19k
BBQ
matthewcrist
89
9.8k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.6k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
34
2.3k
The Power of CSS Pseudo Elements
geoffreycrofte
79
6k
Practical Orchestrator
shlominoach
190
11k
Music & Morning Musume
bryan
46
6.8k
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ಓձ͍ͬͯͩ͘͞
ऴΘΓ