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
SPAのホスティングと Netlifyの話
Search
Yosuke Onoue
October 06, 2018
Technology
2
910
SPAのホスティングと Netlifyの話
ng-kyoto Angular Meetup #8 の発表資料です。
Yosuke Onoue
October 06, 2018
Tweet
Share
More Decks by Yosuke Onoue
See All by Yosuke Onoue
ネットワーク可視化の世界
likr
7
6.5k
Think About Front-end Web Development with Rust
likr
2
540
Yewにおけるoff-the-main-thread
likr
1
770
行政事業レビューデータの可視化 / Visualization of Japan's National Budget with JUDGIT!
likr
1
230
モダンJavaScript再入門 / Re-introduction to Modern JavaScript
likr
24
11k
Web-based Data Visualization with Rust and WebAssembly
likr
4
5.8k
Introduction to Graph Drawing
likr
0
510
20190707Ionic_Meetup.pdf
likr
0
440
About the end of the web
likr
2
530
Other Decks in Technology
See All in Technology
Segment Anything Modelの最新動向:SAM2とその発展系
tenten0727
0
400
LLM開発を支えるエヌビディアの生成AIエコシステム
acceleratedmu3n
0
370
【Λ(らむだ)】最近のアプデ情報 / RPALT20250729
lambda
0
230
【CEDEC2025】『Shadowverse: Worlds Beyond』二度目のDCG開発でゲームをリデザインする~遊びやすさと競技性の両立~
cygames
PRO
1
290
Claude Codeが働くAI中心の業務システム構築の挑戦―AIエージェント中心の働き方を目指して
os1ma
9
1.5k
マルチプロダクト×マルチテナントを支えるモジュラモノリスを中心としたアソビューのアーキテクチャ
disc99
0
300
2025新卒研修・HTML/CSS #弁護士ドットコム
bengo4com
3
13k
Tableau API連携の罠!?脱スプシを夢見たはずが、逆に依存を深めた話
cuebic9bic
3
210
ホリスティックテスティングの右側も大切にする 〜2つの[はか]る〜 / Holistic Testing: Right Side Matters
nihonbuson
PRO
0
580
【CEDEC2025】ブランド力アップのためのコンテンツマーケティング~ゲーム会社における情報資産の活かし方~
cygames
PRO
0
230
LTに影響を受けてテンプレリポジトリを作った話
hol1kgmg
0
290
ビジネス文書に特化した基盤モデル開発 / SaaSxML_Session_2
sansan_randd
0
260
Featured
See All Featured
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
Why You Should Never Use an ORM
jnunemaker
PRO
58
9.5k
The Language of Interfaces
destraynor
158
25k
GraphQLとの向き合い方2022年版
quramy
49
14k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6k
Building Adaptive Systems
keathley
43
2.7k
Typedesign – Prime Four
hannesfritz
42
2.7k
Writing Fast Ruby
sferik
628
62k
GitHub's CSS Performance
jonrohan
1031
460k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
Transcript
41"ͷϗεςΟϯάͱ /FUMJGZͷ ͓ͷ͏͑ ݄OHLZPUP"OHVMBS.FFUVQ
ࣗݾհ w ඌ্༸հ :PTVLF0OPVF w ຊେֶจཧֶ෦ใՊֶՊॿڭ w ใՄࢹԽɺཧ࠷దԽɺҙࢥܾఆࢧԉͷݚڀ w
ՄࢹԽγεςϜͷ։ൃʹ8FCϑϩϯτΤϯυٕज़Λ༻ w -JHIUIPVTFͷείΞվળ͕ϚΠϒʔϜ
None
41"ʢ"OHVMBSΞϓϦʣͷ ϗεςΟϯάΛͲ͏͍ͯ͠·͔͢ʁ
Ͳ͏͍ͯ͠·͔͢ʁ w ࣗલͰߏங w ΦϯϓϨɺ714ɺ*BB4 w Ϩϯλϧαʔόɺ1BB4 w ετϨʔδαʔϏε w
(JU)VC1BHFTɺ4 w ϗεςΟϯάαʔϏε w /FUMJGZɺ'JSFCBTF
Ͳ͏ͬͯબྑ͍͔ʁ
8FCͷτϨϯυ w ੩త8FCαΠτ w )5.-ɺ8FCαʔόʔ w ಈత8FCαΠτ w 1)1ɺ1ZUIPOɺ3VCZɺʜ w
4JOHMF1BHF"QQMJDBUJPO 41" w +BWB4DSJQUɺ3&45"1* w 1SPHSFTTJWF8FC"QQT 18" w 41" Ћ ΑΓྑ͍69 ύϥμΠϜͷน w ൃͷҧ͍ w ։ൃํ๏ͷҧ͍
-JHIUIPVTF w 8FCαΠτͷղੳπʔϧʢ$ISPNF֦ுPSίϚϯυʣ w 1SPHSFTTJWF8FC"QQ w 1FSGPSNBODF w "DDFTTJCJMJUZ w
#FTU1SBDUJDFT w 4&0 w $ISPNF͔Βඪ४ࡌʢ"VEJUTQBOFMʣ w CZ(PPHMF
1SPHSFTTJWF8FC"QQT w IUUQTEFWFMPQFSTHPPHMFDPNXFCQSPHSFTTJWF XFCBQQT w 8FCαΠτͱωΠςΟϒΞϓϦͷ ͍͍ͱ͜औΓΛͨ͠8FCΞϓϦ w 1SPHSFTTJWF&OIBODFNFOU w
ߴ͍ϢʔβϏϦςΟͷ࣮ݱ w ϏδωεϑϨϯυϦʔ
w )5514 w Ϩεϙϯγϒ w ΦϑϥΠϯ w ϗʔϜը໘Ճ w ճઢରԠ
w ΫϩεϒϥβରԠ w εϜʔζͳϖʔδભҠ w ϖʔδຖͷ63- 18"$IFDLMJTU IUUQTEFWFMPQFSTHPPHMFDPNXFCQSPHSFTTJWFXFCBQQTDIFDLMJTU ϕʔεϥΠϯཁ݅ ൣతͳ18" w ΠϯσοΫεՄೳ w 69 w ύϑΥʔϚϯε w Ωϟογϡ w ௨ w ͦͷଞ
w )5514 w Ϩεϙϯγϒ w ΦϑϥΠϯ w ϗʔϜը໘Ճ w ճઢରԠ
w ΫϩεϒϥβରԠ w εϜʔζͳϖʔδભҠ w ϖʔδຖͷ63- 18"$IFDLMJTUͱϗεςΟϯά ϕʔεϥΠϯཁ݅ ൣతͳ18" w ΠϯσοΫεՄೳ w 69 w ύϑΥʔϚϯε w Ωϟογϡ w ௨ w ͦͷଞ ϗεςΟϯά18"ͷཁ݅ͷଟ͘ʹؔΘΔ
۩ମతʹɺ
41"ϗεςΟϯάͷཁ݅ w 63-ϦμΠϨΫτ w )5514αϙʔτ w ΧελϜυϝΠϯ w ϓϦϨϯμϦϯά w
ߴ w ҆Ձ w ؆୯ w ৴པੑ
41"ͷ3PVUJOH IUUQTFYBNQMFDPN JOEFYIUNM JOEFYIUNM CVOEMFKT IUUQTFYBNQMFDPNQBHF 41"ͷϖʔδભҠʢ)JTUPSZ"1*ʣ IUUQTFYBNQMFDPNQBHF /PU'PVOE JOEFYIUNM
CVOEMFKT ϦϩʔυPS63-ΞΫηε
41"ͷ3PVUJOH IUUQTFYBNQMFDPN JOEFYIUNM JOEFYIUNM CVOEMFKT IUUQTFYBNQMFDPNQBHF 41"ͷϖʔδભҠʢ)JTUPSZ"1*ʣ IUUQTFYBNQMFDPNQBHF JOEFYIUNM JOEFYIUNM
CVOEMFKT ϦϩʔυPS63-ΞΫηε QBHFͷΞΫηεJOEFYIUNMΛฦ͢
)5514 w վ᜵ɾ౪ௌͷ߈ܸͷࢭ w 4FSWJDF8PSLFS)551ʹඞਢ w (PPHMFʹΑΔ8FCαΠτͷධՁʹӨڹ w Ͱ͖Ε)551͔Β)5514ʹϦμΠϨΫτ͢Δ
Ϋϩʔϥɾ0(1ରԠ w 4/4ͷڞ༗ɺ(PPHMFͷΫϩʔϥͰೝࣝ͞ΕΔΑ͏ʹ w 63-ຖʹ41"ଆͰॻ͖͍͑ͯΔ߹ରԠ͕େม
ࣗલ Ϩϯαό (JU)VC 1BHFT 'JSFCBTF /FUMJGZ 63-ϦμΠϨ Ϋτ ˓ ˚
º ˓ ˓ )5514α ϙʔτ ˓ ˚ ˓ ˓ ˓ ΧελϜυϝ Πϯ ˓ ˚ ˓ ˓ ˓ ϓϦϨϯμϦ ϯά ˓ ˚ º º ˓ ߴ ˚ ˚ ˓ ˓ ˓ ҆Ձ º ˚ ˓ ˓ ˓ ؆୯ º ˚ ˓ ˓ ˓
/FUMJGZ IUUQTXXXOFUMJGZDPN
/FUMJGZͷ͍ํ w $POUJOVPVT%FQMPZNFOU w (JU)VCʹ1VTI͢ΔͱࣗಈͰϖʔδߋ৽ w खಈσϓϩΠ w ίϚϯυϥΠϯπʔϧ w
ϑΝΠϧΞοϓϩʔυ
/FUMJGZͷ͍ํ w $POUJOVPVT%FQMPZNFOU w (JU)VCʹ1VTI͢ΔͱࣗಈͰϖʔδߋ৽ w खಈσϓϩΠ w ίϚϯυϥΠϯπʔϧ w
ϑΝΠϧΞοϓϩʔυ
%FNP $ npm i -g @angular/cli $ ng new
my-app $ cd my-app/ $ ng serve --open ΞϓϦͷ࡞
None
%FNP $ npm i -D netlify-cli@next $ npx netlify
login $ ng build --prod $ npx netlify deploy -d dist/my-app /FUMJGZͷσϓϩΠ
%FNP $ ng add @angular/pwa --project my-app $ ng
build --prod $ npm i -D http-server $ npx http-server -p 8080 -c-1 dist/my-app 18"ͷ༗ޮԽ
"assets": [ "src/_redirects", "src/robots.txt", "src/favicon.ico", "src/assets", "src/manifest.json" ], BOHVMBSKTPO /*
/index.html 200 http://ng-kyoto.netlify.com/* http://ng-kyoto.likr-lab.com/:splat 301! TSD@SFEJSFDUT <head> ... <base href="/"> <meta name="description" content="Demo for ng-kyoto Meetup #8 !"/> <meta name="viewport" content="width=device-width, initial-scale=1"> ... </head> TSDJOEFYIUNM User-agent : * Disallow : TSDSPCPUTUYU
%FNP $ netlify deploy -d dist/my-app --prod /FUMJGZͷ࠶σϓϩΠ
None
·ͱΊ w ༏ΕͨσϓϩΠڥ͕Ϟμϯͳ8FCΞϓϦʹඞਢ w ٕज़બΛ͔ͬ͠Γ͠Α͏ ºͬͯΔͷɾ͑ΔͷΛબͿ ºྲྀߦͬͯΔͷΛબͿ ˓͏͖ͷΛબͿ w /FUMJGZΛ͓ࢼ͋͠Εʂ