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
【爆速】2日で就職のためにJAMstackなハイパフォブログを作った話!!
Search
Shagamii
January 28, 2019
Programming
0
130
【爆速】2日で就職のためにJAMstackなハイパフォブログを作った話!!
Shagamii
January 28, 2019
Tweet
Share
More Decks by Shagamii
See All by Shagamii
開発から運用まで Muddy に向き合う ABEMA における LP CMS 開発 ~ Muddy Web #7
ryuichisakagmai
1
180
学生エンジニア、 ドキドキ初OSSコミットへの挑戦🎉
ryuichisakagmai
0
620
Other Decks in Programming
See All in Programming
APIのない大学ログインWebサービスをWKWebViewとJavaScriptでアプリ化した話
akidon0000
1
330
Polarsの成長: v0.14からv1.0までの変遷と今後の展望
zerebom
1
350
Composing an API the *right* way (Droidcon Berlin 2024)
zsmb
1
450
データカタログ運用物語 〜令和6年夏の理想と現実〜
kuro_kurorrr
0
110
Introduction of Happy Eyeballs Version 2 (RFC8305) to the Socket library
coe401_
1
220
入社1ヶ月でここまでやった!Findy Toolsインフラ支援の最適化
rvirus0817
6
1.4k
継続的な活動で築く地方エンジニアの道
myamashii
2
360
[After Kotlin Fest 2024 LT Night @ Sansan] もっともっとKotlinを好きになる!K2 Compiler Pluginで遊んでみよう!
kitakkun
2
260
AWSでゲームサーバーを運用! Amazon GameLiftのお話
iriikeita
0
200
How to use Macrobenchmark
veronikapj
0
160
Activities at Cairo Library
cairolibrary720
0
1.2k
最古の関数型言語「Lisp」ことはじめ / lisp_in_kamiyama
uhooi
1
190
Featured
See All Featured
Six Lessons from altMBA
skipperchong
24
3.2k
Principles of Awesome APIs and How to Build Them.
keavy
124
16k
Building Flexible Design Systems
yeseniaperezcruz
323
37k
The Straight Up "How To Draw Better" Workshop
denniskardys
229
130k
Gamification - CAS2011
davidbonilla
78
4.9k
Build The Right Thing And Hit Your Dates
maggiecrowley
28
2.2k
Design by the Numbers
sachag
277
18k
Fashionably flexible responsive web design (full day workshop)
malarkey
399
65k
Learning to Love Humans: Emotional Interface Design
aarron
269
39k
How to Ace a Technical Interview
jacobian
274
23k
Code Review Best Practice
trishagee
58
16k
Fantastic passwords and where to find them - at NoRuKo
philnash
42
2.7k
Transcript
ʲരʳ ̎Ͱब৬ͷͨΊʹ +".TUBDLͳϋΠύϑΥϒϩάΛ ࡞ͬͨʂʂ✌
ΞδΣϯμ ࣗݾհ ͜Μͳϒϩά ٕͬͨज़ελοΫʹ͍ͭͯ +".TUBDLͱͳΜͧ ೋؒͰ࡞Δͧʂ
ࣗݾհ
ࣗݾհ ࡔ্ྤҰ 5XJUUFS!3ZVJDIJ4BLBHBNJ ౦ژཧՊେֶֶ෦ใֶՊ̏ ݄ ࡀ ࡾॏग़ ϑϩϯτΤϯυେ͖ΤϯδχΞ
ࣗݾհ αΠόʔͷΠϯλʔϯͰͬͨ͜ͱ &OHJOFFS+PCʢ̍ϲ݄ͪΐ͍ʣ "CFNF57ϑϩϯτΤϯυνʔϜ ݹ͘ͳ͍ͬͯͨը໘ͷશ໘վम 3FBDUKT SYKT
͜Μͳϒϩά✍
͜Μͳϒϩά IUUQTTIBHBNJJUFDI
͜Μͳϒϩά ͳΜͰ࡞͔ͬͨʜ ब׆ʂ Կ͔ݟͤΕΔͷཉ͍͠ ٕज़తؔ৺ ύϑΥʔϚϯεͷؔ৺
͜Μͳϒϩά ٕͬͨज़ +".TUBDL HBUTCZ DPOUFOUGVM OFUMJGZ
+".TUBDLͱͳΜͧ
+".TUBDLͱͳΜͧ Modern web development architecture based on client-side JavaScript, reusable
APIs, and prebuilt Markup. IUUQTKBNTUBDLPSH
+".TUBDLͱͳΜͧ Ҿ༻ݩɿIUUQTKBNTUBDLPSH
+".TUBDLͱͳΜͧ Any dynamic programming during the request/response cycle is handled
by JavaScript, running entirely on the client. This could be any frontend framework, library, or even vanilla JavaScript. +BWB4DSJQU ಈతʹϦονͳಈ͖Λ͢ΔͨΊͷKBWBTDSJQU
+".TUBDLͱͳΜͧ All server-side processes or database actions are abstracted into
reusable APIs, accessed over HTTPS with JavaScript. These can be custom-built or leverage third-party services. "QJT αʔόʔαΠυ࠶ར༻Մೳͳ"1*ͷΈ
+".TUBDLͱͳΜͧ Templated markup should be prebuilt at deploy time, usually
using a site generator for content sites, or a build tool for web apps. .BSLVQ ੩తαΠτͳͲʹࣄલʹίϯςϯπϏϧυ
+".TUBDLͱͳΜͧ αʔόʔʹϦΫΤετΛඈͯ͠ɺIUNMΛੜ͢ΔΈ Ͱͳ͘ɺ ίϯςϯπɾݟͨࣄલʹϏϧυ͓͖ͯ͠ɺ αʔόʔαΠυඞཁͳใΛऔͬͯ͘Δ"QJ܈Λ༻ҙ͠ɺ ͦΕΒΛಈతʹಈ͔ͨ͢ΊʹKBWBTDSJQUΛ༻͍Δɻ ͭ·Δͱ͜Ζʜʢͷղऍʣ
+".TUBDLͱͳΜͧ Կ͕͍͍ͷ͔ Ϗϧυͨ͠ͷΛDEO্ʹIPTUJOH͓͚ͯ͠ΔͷͰ͍ ϦΫΤετΛड͚ΔͨͼʹαʔόʔαΠυͰෳࡶͳॲཧΛ͢Δ͜ͱ͕ ͳ͍ͨΊɺ҆ՁͰεέʔϥϒϧɻ جຊతʹɺαʔόʔαΠυΛҙࣝ͢Δඞཁ͕ͳ͍ͷͰɺϑϩϯτΤϯυ ͷ։ൃʹूதͰ͖Δ
ٕͬͨज़ελοΫʹ͍ͭͯ⚒
ٕͬͨज़ελοΫʹ͍ͭͯ HBUTCZKT 3FBDUͷ੩తαΠτδΣωϨʔλʔ $POUFOUGVMͳͲͷ$.4ͷ࿈ܞͳͲ༷ʑͳϓϥάΠϯ 18"ରԠ SFBDUIFMNFU 5ZQFTDSJQU (SBQIRMʹΑΔσʔλऔಘ ࣍ͷϖʔδͷσʔλΛ1SFGFUDI &UDʜ
ٕͬͨज़ελοΫʹ͍ͭͯ ੩తͳ3FBDUͬͯͳΜͶΜ Ϗϧυ࣌ ੩తͳIUNM ੩తͳKTPO FUDʜ ΞΫηε࣌ ࠷ॳ੩తͳIUNM ͦΕҎ߱KTPOΛGFUDI͢Δ41"
ٕͬͨज़ελοΫʹ͍ͭͯ 18" 1SPHSFTTJWF8FC"QQTͷུ (PPHMF͕ओʹࡦఆ͢ΔɺXFCϖʔδʹ͓͍ͯωΠςΟϒͷΑ͏ͳ69ମݧ Λ࣮ݱ͢Δٕज़ )PNFը໘ΞΠίϯͷՃ ΩϟογϡʹΑΔΦϑϥΠϯͰͷಈ࡞ 1VTI௨ ࠓճͳ͠ &UDʜ
IUUQTEFWFMPQFSTHPPHMFDPNXFCQSPHSFTTJWFXFC BQQTDIFDLMJTU
ٕͬͨज़ελοΫʹ͍ͭͯ 18"
ٕͬͨज़ελοΫʹ͍ͭͯ $POUFOUGVM )FBEMFTT$.4 ߘͷϞσϧΛఆٛ͢Δ͚ͩͰهࣄ͕ॻ͚Δ هࣄಉ࢜ͷ࿈ܞ༻ҙ HBUTCZʹDPOUFOUGVM͔ΒσʔλΛऔͬͯ͘ΔϓϥάΠϯ /FUMJGZͷฤू࣌ͷϑοΫ
ٕͬͨज़ελοΫʹ͍ͭͯ /FUMJGZ ੩తαΠτΛϗεςΟϯά ಠࣗυϝΠϯͷઃఆ HJUIVCͱ࿈ܞͯ͠Ϗϧυ IUUQରԠ &UDʜ
ٕͬͨज़ελοΫʹ͍ͭͯ ࠓճͷ߹ KBWBTDSJQU "QJT NBSLVQ 3FBDUKT (BUTCZ $POUFOUGVM /FUMJGZ $POUFOUGVM
/FUMJGZ (BUTCZ
ٕͬͨज़ελοΫʹ͍ͭͯ ύϑΥʔϚϯεܭଌʢ-JHIUIPVTFʣ (PPHMF͕ఏڙ͢ΔΣϒαΠτΛղੳͯ͠ɺ࣭ʹؔ͢Δ ࢦඪ্ͷͨΊͷରࡦΛࣔͯ͘͠ΕΔ044
ೋؒͰ࡞Δͧʂ
ೋؒͰ࡞Δͧʂ $POUFOUGVMͰ"1*Λ࡞Δʢʣ ΞΧϯτొʢ̑ʣ .PEFMΛ࡞Δʢʣ
ೋؒͰ࡞Δͧʂ (BUTCZͰ3FBDUΛΰϦΰϦॻ͘ʢ̍ʣ CPJMFSQMBUFΛੜʢ̑ʣ DPOUFOUGVMपΓͷϓϥάΠϯΛೖΕΔʢʣ σʔλशಘͷHSBQIRMΛॻ͘ʢʣ
ೋؒͰ࡞Δͧʂ هࣄϖʔδͳͲಈతʹੜ͍ͨ͠ϖʔδͷઃఆΛHBUTCZOPEFKT ʹॻ͘ʢʣ ͋ͱඞཁʹԠͯ͡ϓϥάΠϯΛೖΕͭͭɺ3FBDUΛΰϦΰϦॻ͘ɻ
ೋؒͰ࡞Δͧʂ /FUMJGZʹσϓϩΠ͢Δʢʣ ΞΧϯτొʢ̑ʣ Ϗϧυ͢ΔϨϙδτϦͷొɺڥมɺϏϧυίϚϯυͷઃఆʢʣ ΧελϜυϝΠϯͷઃఆʢʣ
·ͱΊ☀
·ͱΊ ΈΜͳ͓Ոؼͬͯ࡞ͬͯͶʂ ਫ༵ʹσϓϩΠྃͯ͠Δͣ
͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ ͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ