Webで自動化って どういうこと? - 大まかに理解する 自動化の入り口の話
WebͰࣗಈԽͬͯͲ͏͍͏͜ͱ?2018/11/09@tacck⼤まかに理解する ⾃動化の⼊り⼝の話
View Slide
୭!UBDDL໊લࡶͳϑϧελοΫΤϯδχΞ͓ࣄεϓϨουɾΠʔάϧ͖ͳϑΟΪϡΞεέʔτͷٕ
ಥવͰ͕͢
Έͳ͞ΜָΛ͍ͨ͠Ͱ͔͢?
Έͳ͞ΜָΛ͍ͨ͠Ͱ͔͢?͍ͨ͠Ͱ͢ΑͶʂ
ָΛͯ͠ྑ͍ΜͰ͔͢?
ָΛͯ͠ྑ͍ΜͰ͔͢?ྑ͍ΜͰ͢!!
ָΛ͢ΔͨΊʹԿΛΔ͖͔?
ࠓ͓͢͠Δ͜ͱ• Web։ൃք۾Ͱฉ͘ʮࣗಈԽʯͱ?• ࣗಈԽ͢ΔͱԿ͕خ͍͠ͷ͔• ۩ମతͳ͓ɺଞͷํͷൃදʹظ!
ͦͦ“Webٕज़” #ͱ
Webٕज़ (͜ͷࢿྉͰͷఆٛ)ՃԠ༻WebαΠτWebΞϓϦ(WebγεςϜ)WebΞϓϦͷཁૉٕज़ͷൃలجຊ
• ੩తϖʔδදࣔ• ϒϥβͰදࣔޙʹ ϖʔδ༰(σʔλ)͕มԽ͠ͳ͍WebαΠτجຊ
• ಈతϖʔδදࣔ• ϒϥβͰදࣔޙʹ ϖʔδ༰(σʔλ)͕มԽ͢ΔՃ WebΞϓϦ(WebγεςϜ)
͍͍ͩͨ͜͏͍͏ύλʔϯ• ϑΝΠϧஔͷΈͷ੩తαΠτ• όοΫΤϯυͰϖʔδੜ͢Δ੩తαΠτ• όοΫΤϯυͰϖʔδੜ͢ΔಈతαΠτ• ϑϩϯτΤϯυʹΑΔಈతαΠτ
੩తαΠτ ಈతαΠτϑϩϯτΤϯυᶃϑΝΠϧஔͷΈᶆ9)3͏λΠϓόοΫΤϯυᶄݻఆͷϑΝΠϧੜᶅঢ়ଶʹԠͨ͡ ϑΝΠϧੜ
ొਓ• HTML/CSS• JavaScript• όοΫΤϯυ(ݴޠ/ϑϨʔϜϫʔΫ)• ϛυϧΣΞ(HTTPαʔό/DBαʔό)• Πϯϑϥ(Ϛγϯ/ωοτϫʔΫ)
ᶃϑΝΠϧஔͷΈͷ ɹ੩తαΠτ• HTML/CSS• JavaScript (֎෦௨৴ͳ͠)• ϛυϧΣΞ(HTTPαʔό)• Πϯϑϥ(Ϛγϯ/ωοτϫʔΫ)
ᶃϑΝΠϧஔͷΈͷ ɹ੩తαΠτΠϯϑϥ αʔόωοτϫʔΫ)5.-$44 +BWB4DSJQU)551αʔόϑΝΠϧऔಘ
ᶄόοΫΤϯυͰ ɹϖʔδੜ͢Δ੩తαΠτ• HTML/CSS• JavaScript (֎෦௨৴ͳ͠)• όοΫΤϯυ(ݴޠ/ϑϨʔϜϫʔΫ)• ϛυϧΣΞ(HTTPαʔό)• Πϯϑϥ(Ϛγϯ/ωοτϫʔΫ)
ᶄόοΫΤϯυͰ ɹϖʔδੜ͢Δ੩తαΠτΠϯϑϥ αʔόωοτϫʔΫ)551αʔόϒϥβ͔ΒϑΝΠϧऔಘʹݟ͍͑ͯΔ όοΫΤϯυ)5.-$44 +BWB4DSJQUόοΫΤϯυͰϑΝΠϧΛੜͯ͠)551αʔό͢
ᶅόοΫΤϯυͰ ɹϖʔδੜ͢ΔಈతαΠτ• HTML/CSS• JavaScript (֎෦௨৴ͳ͠)• όοΫΤϯυ(ݴޠ/ϑϨʔϜϫʔΫ)• ϛυϧΣΞ(HTTPαʔό/DBαʔό)• Πϯϑϥ(Ϛγϯ/ωοτϫʔΫ)
ᶅόοΫΤϯυͰ ɹϖʔδੜ͢ΔಈతαΠτΠϯϑϥ αʔόωοτϫʔΫ)551αʔόϒϥβ͔ΒϑΝΠϧऔಘʹݟ͍͑ͯΔ όοΫΤϯυ)5.-$44 +BWB4DSJQU%#αʔόόοΫΤϯυͰϑΝΠϧΛੜͯ͠)551αʔό͢
ᶆϑϩϯτΤϯυʹΑΔ ɹಈతαΠτ• HTML/CSS• JavaScript (֎෦௨৴͋Γ)• όοΫΤϯυ(ݴޠ/ϑϨʔϜϫʔΫ)• ϛυϧΣΞ(HTTPαʔό/DBαʔό)• Πϯϑϥ(Ϛγϯ/ωοτϫʔΫ)
ᶆϑϩϯτΤϯυʹΑΔ ɹಈతαΠτΠϯϑϥ αʔόωοτϫʔΫ)551αʔόϒϥβϑΝΠϧऔಘͱ9)3ʹΑΔσʔλऔಘόοΫΤϯυ9)3Λड͚Δ"1*)5.-$44+BWB4DSJQU%#αʔόόοΫΤϯυͰσʔλ࡞+49)3
WebΞϓϦΛ࡞Δʹ• ࠷ऴతʹɺଟ͘ͷཁૉ͕ඞཁʹͳͬͯ͘Δɻ• ϑϩϯτΤϯυɺόοΫΤϯυɺΠϯϑϥɺͦΕͧΕ͕ผͷٕज़ཁૉͰΓཱ͍ͬͯΔɻ• ࣗಈԽͰ͖ͦ͏?
ཧ͢Δલʹ
ࣗಈԽ #ͱ
ࣗಈԽͱ• ͋Δಛఆͷ࡞ۀ༰ɺ࡞ۀखॱΛɺ ػց(ίϯϐϡʔλ)ʹͤΔ͜ͱɻ• ਓ͕ؒͰ͖Δ͜ͱ (͔ͭɺ܁Γฦ͠Δ͜ͱ)Λ ίϯϐϡʔλʹͤΔɻ
• جຊ໘ͳ࡞ۀ• ಉ͜͡ͱΛେྔʹ܁Γฦ͢• ͦͷׂʹؾΛ͏• ͦͷ্Ͱؒҧ͑Δ• ؒҧ͑ͨ߹γϟϨʹͳΒͳ͍ਓ͕ؒͰ͖Δ͜ͱΛͤΔ
ࣗಈԽͯ͠خ͍͜͠ͱ
خ͍͜͠ͱ• ఆܕॲཧΛ࣮֬ʹߦͳ͑Δ• Ұ୴ޭͨ͠Βͣͬͱޭ• ࣦ͠ഊͨ͠ΒʮखॱҎ֎ʯʹ͕͋Δ͜ͱ͕Θ͔Δ
خ͍͜͠ͱ• ָ͕Ͱ͖Δ• ৽͍͜͠ͱʹखΛ͚ͭΒΕΔ• ػೳՃɾվળ• ৽͍͠αʔϏε
Ͳ͏͍͏͜ͱΛࣗಈԽͰ͖Δ͔
ࣗಈԽͰ͖Δ͜ͱ• ఆܕॲཧͯ͢
ϑϩϯτΤϯυཁૉ• Ϗϧυ (ίϯύΠϧ / τϥϯεύΠϧ)• ΦʔτϦϩʔυ• Lint / Format• ςετ• σϓϩΠ
ϑϩϯτΤϯυཁૉ• Ϗϧυ (ίϯύΠϧ / τϥϯεύΠϧ)• Babel, Webpack, …• ΦʔτϦϩʔυ• Webpack, …• Lint / Format• ESLint, …• ςετ• Jest, …• σϓϩΠ• SCP, …
όοΫΤϯυཁૉ• Ϗϧυ (ίϯύΠϧ)• ϗοτσϓϩΠ• Lint / Format• ςετ• σϓϩΠ
όοΫΤϯυཁૉ (Java)• Ϗϧυ (ίϯύΠϧ)• Javac + Gradle, …• ϗοτσϓϩΠ• IDE + Gradle, …• Lint / Format• Checkstyle, ..• ςετ• JUnit, …• σϓϩΠ• SCP, …
Πϯϑϥཁૉ• ߏཧπʔϧ• ϗετ(VM)ߏங• ϛυϧΣΞߏங• ςετ• VM/ίϯςφͷΠϝʔδϏϧυ
Πϯϑϥཁૉ• ߏཧπʔϧ• ϗετ(VM)ߏங• ϛυϧΣΞߏங• Ansible, Chef, …• ςετ• ServerSpec, …• VM/ίϯςφͷΠϝʔδϏϧυ• Docker, Packer, …
Ԡ༻• CI• GitͷίϛοτΛݕͯ͠ςετ• CD• ςετͰͳ͚Ε• σϓϩΠͷͨΊʹΠϯϑϥΛࣗಈߏங• σϓϩΠ
Ԡ༻• CI• GitͷίϛοτΛݕͯ͠ςετ• CD• ςετͰͳ͚Ε• σϓϩΠͷͨΊʹΠϯϑϥΛࣗಈߏங• σϓϩΠ• Jenkins, CircleCI,…
ࡉʑ͖ͯͨ͠ͷͰ ͬ͘͟Γೝࣝ
ͬ͘͟Γೝࣝ• ϑϩϯτΤϯυɺόοΫΤϯυɺΠϯϑϥɺͦΕͧΕͷࣗಈԽରΛݟͯ͠Έͯɺ ͬ͘͟Γͱͨ͠ೝࣝΛݻΊΔɻ
ͬ͘͟Γೝࣝ• ϑϩϯτΤϯυ/όοΫΤϯυͰΓ͍ͨ͜ͱ݁ߏࣅ͍ͯΔ• ͏ݴޠπʔϧͷҧ͍͔ΒͦΕͧΕʹൃల͍ͯ͠Δ͕ɺຊ࣭తʹΓ͍ͨ͜ͱಉ͡ɻ• Πϯϑϥίʔυͷ࣌• ߏཧπʔϧͰίʔυԽ͢Δ͜ͱͰ࠶ݱੑ͕֬อ͞ΕɺࣗಈԽ͕ਐΜͰ͍Δɻ
ϏϧυϗοτσϓϩΠίϛοτϏϧυόοΫΤϯυϑϩϯτΤϯυ ΠϯϑϥΦʔτϦϩʔυߏจνΣοΫ։ൃڥߏங੩తղੳΠϯλϓϦλίϯύΠϥखݩ ։ൃڥͰಈ࡞֬ೝςετ࣮ߦ
ίϛοτ$*$%੩తղੳϏϧυςετ ຊ൪ڥߏஙσϓϩΠςετڥߏங
·ͱΊ
·ͱΊ• ϑϩϯτΤϯυɺόοΫΤϯυɺΠϯϑϥɺ ͦΕͧΕʹࣗಈԽΛ͢Δٕज़ɾπʔϧ͕͋Δɻ• ԼهͷͨΊʹΔɻ• ҆શ• ࣮֬• ָΛ͢Δ
·ͱΊ• ݸʑͷٕज़ɺ͍ඥɻ• ෳͷٕज़Λܨ͗߹ΘͤͯɺҰຊͷ͍ඥʹ͢Δɻ• ͦͷඥ͕ɺϢʔβʔʹՁͱͯ͠ಧ͘Α͏ʹɺ͘ଠ͍ͯ͘͜͠͏ɻ• ͦΕ͕ɺʮࣗಈԽʯͷٕज़ɻ
·ͣ• ͯ͘ྑ͍ͷͰඥΛฤΜͰΈΔ• ίϚϯυΛฒͨεΫϦϓτΛ࡞Δ͜ͱɺཱͳࣗಈԽɻ• ՁΛੜΉͨΊʹָΛ͠Α͏!• ָΛ͢ΔͨΊʹΛ͠Α͏!
ࣗಈԽͷੈքΑ͏ͦ͜
end
tacck
tarappo
takmin
tenforward
hankehly
ymty
microcms
moritama1515
daihiraoka
yoshidashingo
niryuu
takashi1029
m3hiro3
bluesmoon
destraynor
geeforr
kneath
colly
dougneiner
quramy
lara
jeffersonlam
jrom
malarkey
myddelton