20200909_Shifter_オンラインミートアップ - LT
ͦͷ WordPress ͪΐͬͱ Shifter ʹҠߦͯ͠Έ·ͤΜ͔ ʁ[9/9 Zoom։࠵] Shifter ΦϯϥΠϯϛʔτΞοϓ“Shifter Headless ͱ Algolia ׆༻ज़ʂ”גࣜձࣾ ݱαϙʔτ্佂 େ2020.09.09օ͞ΜɺߘΛ͓ئ͍͠·̇͢[email protected](FU4IJGUFS
View Slide
օ͞ΜͲ͏ɺ͜ΜΜ
ࣗݾհ• ্佂 େ (řŚŜŵ ŻŝűƁ) ※ handle : kusokamayarou• 42ࡀ (1978.01.14 ੜ)• ग़ / ॴࡏɿࣛࣇౡݝປ࡚ࢢ• 2012ʹ౦ژ͔Β̪λʔϯͰݱ৬ɻ• ΠϯϑϥΤϯδχΞ (AWS)ɺϞόΠϧΤϯδχΞ (iOS)ɹ˞ϑϧελοΫʁ• JAWS-UG ࣛࣇౡ ίΞϝϯόʔɺςϨϫʔΫɺෳۀɻ• ͖ͳ͜ͱɿՈɾԹઘɾອըΛಡΉ͜ͱɾྉཧͳͲɹ˞࠷ۙɺDQλΫτ
࣍1. Shifter ͱͷɺग़⁊͍…2. Shifter ͬͯɺԿͳͷ…3. Shifter ͱͷɺࠓͷؔੑ…4. Shifter ͱͷɺ͜Ε·Ͱ…5. Shifter ͱͷɺ͜Ε͔Β…✨6. ·ͱΊ
͝ࢦఠɾ͝ҙݟɾ࣭͓͝ؾܰʹֻ͓͚Լ͍̇͞
ʲୈ̍ʳShifter ͱͷɺग़⁊͍…ʙ ͋ͷ࣌ɺ͋ͳͨʹग़⁊Θͳ͚Ε… ʙ
2017ʮAMIMOTO AMI ͱͷग़⁊͍ʯ• 2017.07 : AMIMOTO AMI ͱͷग़⁊͍ɺͦͯ͠ DigitalCube ͷ͜ͱΛΔ• AMIMOTO AMI ΛͬͯɺWordPress Λ্ཱͪ͛ͯɺଓઌΛ RDS ʹมߋͯ͠ΈΔ - Qiita
2018ʮShifter ͱͷग़⁊͍ʯ• 2018.10 : JAWS FESTA 2018 OSAKA ͷϒʔεͰɺShifter ͱग़⁊͏• JAWS FESTA 2018 OSAKA ʹࢀՃ͖ͯ͠·ͨ͠!! - ࣛࣇౡࢢͷاۀʹۈΊͯɺປ࡚ͰςϨϫʔΫͯ͠Δ IT ΤϯδχΞͬΆ͍ਓͷϒϩά• JAWS FESTA 2018 OSAKA ࠙ձ Ͱɺ௩ ೋ ͞Μͱ͓ͯ͠ɺFacebook Ͱܨ͕Δɻ• ͔֬ɺ ҏ౻ തඒ ͞ΜɺձͰݟ͔͚ͨؾ͕͢Δ…ɻ
2020ʮͱΓ͋͑ͣɺҿΉʂʯ• 2020.01 : ΏΔ͔ͳ߹ಉ Web ษڧձ @ ࣛࣇౡ ͰɺShifter Ҡߦ͠Α͏ͱܾΊΔʂʂʂ• DigitalCube ͷ খլ ߒ௨ ͞Μɾଜ भฏ ͞Μ ͱҿΉɻϝνϟΫνϟָ͔ͬͨ̇̇̇͠• ଜ भฏ ͞Μ͕ɺKagoshima WordPress Meetup ͷ ଜ भฏ ͞ΜͱॳΊͯΔʂ• ΏΔ͔ͳ߹ಉ Web ษڧձͰɺShifter ʹग़ձ͓͏ !!! - ࣛࣇౡࢢͷاۀʹۈΊͯɺປ࡚ͰςϨϫʔΫͯ͠Δ IT ΤϯδχΞͬΆ͍ਓͷϒϩά
ʲୈ̎ʳShifter ͬͯɺԿͳͷ…ʙ ΕΔఔɺ͔Βͳ͘ͳ͍ͬͯ͘… ʙ
Shifter :The static site generator for WordPress.• Shifter: The static site generator for WordPress.• ʮ੩తαΠτδΣωϨʔλʔʯʹ͍ͭͯཏతʹઆ໌͠·͢ | Dyno4IJGUFSΛ༻͢Δͱɺ8PSE1SFTTαΠτΛͰ࡞·ͨҠߦͰ͖·͢ɻ͜ΕɺεέʔϥϒϧͰɺ߈ܸ͔Β҆શͰɺˋ੩తԽ͞Ε͓ͯΓɺηΩϡϦςΟରࡦΩϟογϡϓϥάΠϯ͕ෆཁͰ͢ɻ
What is Shifter ?• υΩϡϝϯτ͋Δ͚Ͳ…• What is Shifter? | Shifter Documentation
※ ࢲͷೝࣝ (ͪΐͬͱෆ͚҆ͩͲ…)• WordPressɹ˞ ϒϩά͔ΒେنαΠτ·Ͱ࡞ΕΔ CMS | WordPress.org ຊޠ• → ࠓӡ༻தͷ WordPress ͑ΔΑ̇• Jamstackɹ˞ Jamstack | JavaScript, APIs, and Markup• ʮࣄલʹੜͨ͠ϑΝΠϧΛ CDN ͔Βఏڙ͢ΔܗͰಈ͘ɺߴͰηΩϡΞͳαΠτΞϓϦͷ͜ͱɻΣϒαʔόʔΛཧͨ͠Γ࣮ߦͨ͠Γ͢Δඞཁແ͍ɻʯ• ʹ CDN (Content Delivery Network ) + SSG (Static Site Generator) ???• → ಈతͳϖʔδ (ݕࡧϖʔδɺ͍߹ΘͤϑΥʔϜɺ༧ϑΥʔϜͳͲ) ɺͦͷ··Ͱ͑ͳ͍…ɻ• Serverless• → αʔόʔͷӡ༻ཧɺඞཁແ͍ʂ• → ٯʹɺαʔόʔ͋Γ͖ͷϓϥάΠϯϓϩάϥϜɺਖ਼ৗʹಈ࡞͠ͳ͍…ɻ
※ ·ͣɺͱʹ͔ͬͯ͘ΈΑ͏ʂʂʂ• جຊ 3 Step (ΞΧϯτ࡞ɺαΠτ࡞ɺ(WordPressཧը໘ͷฤू)ɺ੩తσʔλੜ)• ͷαʔόϨεWordPressͱݴΘΕΔʮShifterʯ৮ͬͯΈͨ | ΠϯλʔϑΣΠεσβΠϯελδΦגࣜձࣾ
ʲୈ̏ʳShifter ͱͷɺࠓͷؔੑ…ʙ དʑͳࢲΛݟͯཉ͍͠… ʙ
˒ Shifter ͱ ֤छαʔϏε ͱͷߏ ˒ݕࡧϖʔδ༧ϑΥʔϜ͍߹ΘͤϑΥʔϜίʔυཧ
ʲୈ̐ʳShifter ͱͷɺ͜Ε·Ͱ…ʙ ཪΒΕ͍ͨ… ʙ
ʼ Shifter ͷҠߦͷঢ়گ• ϓϩδΣΫτ։࢝ɺ2020/03 Ͱɺݱࡏਐߦத…ɻ• Ҡߦ͢ΔαΠτɺ6 αΠτͰɺطʹ 5 αΠτҠߦࡁɻ• શͯͷαΠτͷҠߦͷऴྃɺ2020.10 Λ༧ఆɻ• Shifter ͷҠߦʹབྷΜͰɺ͜Ε·Ͱ Qiita ʹ 10 ຊ΄ͲهࣄΛߘɻ• kusokamayarou - Qiita• Shifter αϙʔτͷ͍߹Θͤɺ20݅ఔɻ ※͍ͭ͋Γ͕ͱ͏͍͟͝·͢ʂ• ͍߹Θͤ༰ɺग़དྷΔ͚ͩ Qiita ʹߘ͠Α͏͔ͳͱࢥ͍ͬͯ·͢ɻ• ςʔϚΛߋ৽͢Δͱ wp-content/themes ԼͷςʔϚͷϧʔτϑΥϧμ໊͕มߋ͞ΕΔɻ ·Issue #12 · getshifter/shifter-github• Shifter Meetup ʹɺ݄͔̐Β΄΅ຖ݄ͷϖʔεͰɺ̐ճࢀՃɻ• JP_GetShifterʛEventRegistʢΠϕϯτϨδετʣ
ʼ ݕࡧϖʔδ : Algolia• Algolia ͷ InstantSearch.js ΛͬͯɺWordPress ͷݻఆϖʔδ (ςϯϓϨʔτ) ͰɺߘͷݕࡧϖʔδΛ࡞͢Δɻ - Qiita• ཱ͓ͪ - 1ͰεςοϓΞοϓͰ͖Δݱཱ͓ͪϒϩά - | ݱΫϥυ Conne ʢίϯωʣ
ʼ ༧ϑΥʔϜ : YouCanBook.me• ※ Qiite هࣄɺࣥචத…• σϞϯετϨʔγϣϯͷ͓ਃࠐΈ | ݱΫϥυ Conne ʢίϯωʣ
※ ༧ϑΥʔϜʹؔͯ͠• SuperSaaS : ւ֎αʔϏεɺAPI༗Γɺ¥750/MɺػೳগͳΊ• Bookafy : ւ֎αʔϏεɺAPI༗Γɺ$9.0/MɺGoogle࿈ܞɺzoom࿈ܞ• YouCanBook.me : ւ֎αʔϏεɺAPI༗Γɺ$10.0/MɺGoogle࿈ܞ(ڧ੍)ɺŸŖſػೳ๛• Coubic : ࠃαʔϏεɺ¥4,980/MɺGoogle࿈ܞɺػೳ͕ଟա͗ͯͪΐͬͱ…• AirRESERVED : ࠃαʔϏεɺ¥5,000/Mɺళฮ͚ɺػೳ͕ଟա͗ͯͪΐͬͱ…• SELECTTYPE : ࠃαʔϏεɺ¥1,500/Mɺళฮ͚ɺػೳ͕ŸŧŒŞŧŒଟա͗ͯͪΐͬͱ…• ༧ϑΥʔϜͷར༻ͱͯ͠ɺւ֎αʔϏεͷํ͕ͪΐ͏Ͳྑ͍͔ͳɻ• ࠃαʔϏεͷํɺళฮͷΣϒαΠτ͚ͳͲɺෆཁͳػೳଟ͘ɺ͍ͮΒ͞…ɻ·ͨɺͦͷɺྉׂۚߴؾຯ…ɻ• ༧ϑΥʔϜͰͷར༻ͱͯ͠ɺBookafy, YouCanBook.me ͋ͨΓ͕ͪΐ͏Ͳྑ͍͔ͳɻͨͩɺຊޠରԠͱ͔ͷ͋Δ͔͠Εͳ͍ͷͰɺࣄલʹ֬ೝΛʂ
ʼ ͍߹ΘͤϑΥʔϜ :ɹKwes formɺSATORI• WordPress αΠτͰɺMW WP Form Ͱ࡞͍ͨ͠߹ΘͤϑΥʔϜΛɺݻఆϖʔδ & KwesForms Ҡߦͯ͠ΈΔɻ - Qiita
※ ͍߹ΘͤϑΥʔϜʹؔͯ͠• WordPress Λ Shifter Ҡߦ͢Δʹ͋ͨͬͯɺϑΥʔϜαʔϏεΛ৭ʑௐͯΈͨɻ - Qiita• Zapier Λհͯ͠ɺKwes Forms ͷ͍߹ΘͤΛɺkintone ΞϓϦ Post ͯ͠ΈΔ - Qiita• Zapier ͰɺJSON ͷϦετจࣈྻΛมͯ͠ɺkintone ͷνΣοΫϘοΫε߲ʹΠϯϙʔτ͢Δ - Qiita
※ ϓϥάΠϯ ڥपΓ ͳͲ• ϓϥάΠϯʹ͍ͭͯ• Force disabled plugins | Shifter Documentation• CloudFront ద༻ࡁΈͷ WordPress αΠτΛɺShifter Ҡߦ͢Δɻ - Qiita• Jetpack by WordPress.com ʹɺ݁ߏखؒऔΓ·ͨ͠…ɻ• WordPress ςʔϚͷཧʹ͍ͭͯ• Shifter Github Plugin/Theme Installer Λͬͯࣗ࡞ςʔϚɾϓϥάΠϯΛΞοϓσʔτ͠Α͏ #JP_Getshifter | Gatespace's Blog• Shifter Ҡߦޙͷ WordPress ςʔϚͷ GitHub ΛͬͨϦϦʔεཧͱͦͷద༻ʹ͍ͭͯࢼͯ͠Έͨɻ - Qiita• ։ൃɾݕূڥʹ͍ͭͯ• Local | Local WordPress development made simple• LocalbyFlywheel ΛͬͯɺϩʔΧϧʹ WordPress ͷ։ൃɾݕূڥΛͪΐͬͺͰߏங͢Δɻ - Qiita
※ Shifter ͷҠߦͷϙΠϯτ• WordPressαΠτΛShifterʹҠߦ͢Δ࣌ͷϙΠϯτ #JP_Getshifter | Gatespace's Blog• CloudFront ద༻ࡁΈͷ WordPress αΠτΛɺShifter Ҡߦ͢Δɻ - Qiita• ҠߦͷखॱɺҰΕಉ͡खॱͰग़དྷΔͷͰɺ·ͣςεταΠτΛҰҠߦͯ͠ΈΑ͏ʂಛʹɺυϝΠϯབྷΈͷઃఆɺඇৗʹΘ͔ΓͮΒ͍ͷͰɺཁҙʂ• ҠߦޙͷݕূͰɺඞཁͳϒϥβͰϨΠΞτಈ࡞ͷݕূΛ͓ͯ͜͠͏ʂ͜Ε·Ͱͳ͔ͬͨͷʹɺજࡏతͳෆ۩߹͕ݟ͔ͭΔ͜ͱɻಛʹɺIE ཁҙʂ• αΠτʹΑͬͯɺShifter Ҡߦ͠ͳ͍͜ͱҰͭͷબࢶɻ• ಈతͳϖʔδ (ݕࡧϖʔδɺ͍߹ΘͤϑΥʔϜɺ༧ϑΥʔϜͳͲ) ͕ଟ͍΄ͲɺࣄલʹϖʔδΛ੩తԽ͢ΔରԠ͕ඞཁͱͳΔͷͰɺҠߦ͔͞Ή…ɻ• ֤छαʔϏεͷબఆʹ͓͍ͯɺҠߦ͢ΔWebαΠτͰͷඞਢͷཁ݅ͳͲΛ֬ೝ͠Α͏ʂ• ※ Shifter DocumentationɺBlog | ShifterɺShifter Advent Calendar 2019 - QiitaɺShifter - Qiita• ※ Shifter αϙʔτɺShifter Partner Networkɹ˞ ࠷ѱɺࢲ ( kusokamayarou ) Ͱ…
ʲୈ̑ʳShifter ͱͷɺ͜Ε͔Β…✨ʙ Ӭԕͷಀආߦ… ʙ
ʼWebαΠτͷతׂ ※ࢲ͕ࢥ͏• Web αΠτͷத৺ʹ͋Δͷͱͯ͠ɺاۀɾ৫ɾݸਓɾαʔϏεɾϓϩμΫτɾΠϕϯτɾΩϟϯϖʔϯͳͲ༷ʑͳ༁ͳΜͰ͕͢…• ͨͩɺWeb αΠτͷׂͬͯͳΔͱɺλʔήοτͱͳΔϢʔβʔͦΕͧΕʹରͯ͠ɺదͳίϯςϯπఏڙΛߦ͏͜ͱʹΑͬͯɺϢʔβʔΤΫεϖϦΤϯεΛҾ͖ى͜͠ɺϢʔβʔΛ࣍ͳΔΞΫγϣϯ༠͏͜ͱʹ͋Δͷ͔ͳɺͱࢥ͏ΜͰ͢…• ͳͷͰɺWeb αΠτͷثίϯςϯπͰ͋ΓɺͦͷίϯςϯπΛߟ͑ɺੜΈग़͠ɺѻ͏ WebσΟϨΫλʔ Web σβΠφʔɺϥΠλʔɺϚʔέςΟϯά෦ͱ͔͕ɺWeb αΠτͷओͩͱɺࢲߟ͍͑ͯͨΓ͢Δ༁Ͱ͢…• ͿͬͪΌ͚ɺϑΝογϣϯࡶࢽΛݟͯɺʮ͜ͷࢴ࣭͘͢͝ྑ͍Ͷʯͱ͔ɺʮ͜ͷஸੌ֨͘ྑ͍Ͷʯͱ͔ɺݴΘΕͯɺʮ͍ɺͦ͏͍͏ͷྑ͍͔Β༸ݟͯɺങͬͯͶɻʯͬͯײ͡ͰɺWeb ΤϯδχΞ ͬͯɺWeb αΠτʹ͓͍ͯɺ͋͘·ͰཪํͰ͔͠ͳ͍ͷ͔ͳɺͱ…• ͪΖΜཪํ͕Ͳ͏ʹ͔ͳͬͯ͠·͏ͱɺͦΕʹ͔͍ͬͬͯΔͷ͕શ͕ͯͲ͏ʹ͔ͳͬͯ͠·͏ͷͰ…ɺඇৗʹॏཁͰ͋Δ͜ͱɺ͍ٙΑ͏ͳ͍༁Ͱ͕͢…• ͨͩɺଟ͘ΛੜΈग़ͣ͞Ԇʑͱଓ͘࡞ۀʹɺඇৗʹ༗༻ͳΤϯδχΞϦιʔε͕ΘΕͯ͠·͏ͷɺܦӦϚωδϝϯτతʹɺ·ͨͦ͜Ͱಇ͘ Web ΤϯδχΞࣗʹͱͬͯɺՌͨͯ͠ྑ͍͜ͱͳͷ͔ʁɹͱ͍͏͜ͱ͋Δ͔ͳɺͱ…
ʼShifter ͷҙຯͱҙٛͱظ ※ࢲ͕ࢥ͏• ͦ͏͍͏ҙຯͰɺࢲɺShifter WordPress Λͬͨ Web αΠτΛɺWeb ΤϯδχΞͷख͔Β͠ɺओͱͳΔ Web σΟϨΫλʔ Web σβΠφʔɺϥΠλʔɺϚʔέςΟϯά෦ͷखʹड͚͢ɺඇৗʹૉΒ͍͠αʔϏεͩͱࢥ͍ͬͯ·͢ɻ• ಛʹɺݱঢ়ಈ͍͍ͯΔ WordPress ͷ Web αΠτΛগͳ͍ͰɺҠߦग़དྷΔͷɺඇৗʹྑ͍ͳ͊ɺͱࢥ͍·͢ɻ• Ͱ͢ͷͰɺݱࡏ WordPress Λӡ༻͍ͯ͠Δํɺ·ͨɺ͜Ε͔Β WordPress αΠτΛ্ཱͪ͛Α͏ͱߟ͍͑ͯΔํɺShifter ΛୈҰީิʹߟ͑ͯྑ͍Μ͡Όͳ͍͔͊ɺͱࢥ͍ͬͯ·͢ɻ• ͨͩɺવͷࣄͳ͕ΒɺShifter ͱ͍͏αʔϏεʹ࠷ߴʹຬͱ͍͏༁Ͱͳͯ͘ɺ͜Ε͔Βظ͍ͨ͠ͱ͜Ζ͋Γ·ͯ͠…• Ұͭɺʮྗڧ͞ʯ͔ͳͱɻαʔϏεͷෆ҆ఆ͞ણࡉ͕͞ʑ֞ؒݟ͑Δ͜ͱ͕͋ΔͷͰɺগʑͷ͜ͱʹಈ͡ͳ͍ྗڧ͍αʔϏεʹͯ͠Β͑Δͱɺඇৗʹ͋Γ͕͍ͨͳ͊ɺͱɻ• ͏Ұͭɺʮ༏͠͞ʯ͔ͳͱɻWeb ΤϯδχΞͷखΕΔͷͷɺओͱͳΔ Web σΟϨΫλʔͳͲͷਓͨͪʹͱͬͯɺ͍қ͍αʔϏε͔ͱ͍͏ͱɺ·ͩ·ͩෆศΛڧ͍ͯ͠·͍ͬͯΔ෦͋ͬͯ…(·͊ɺ͜Ε WordPress ͷ ੍Ͱ͋Δ͔͠Ε·͕ͤ…)ɺओͱͳΔํʑʹͱͬͯɺศརͳػೳ͕͜Ε͔Β૿͍͑ͯ͘ͱخ͍͠ͳ͊ɺͱࢥ͍ͬͯ·͢ɻ
͖উखͳ͜ͱݴͬͯɺ͢Έ·ͤΜʂʂʂ
ʲΤϐϩʔάʳ·ͱΊʙ ͍͑ͨɺ࠷ޙͷ͍… ʙ
✊ ·ͣɺɹɹؾܰʹͬͯΈΑ͏ʂ• ΫϥυαʔϏεΛͪΐͬͱͬͯΈΔ͙Β͍ɺେͨ͠खؒίετແ͍ͷͰɺ͙͢ʹͬͯΈΑ͏ʂʂʂ• ϑϦʔϓϥϯɺ͋͘͢͝Γ͕͍ͨʂײँ̇̇̇
✊ ͦͯ͠ɺɹɹΞτϓοτ͠Α͏ʂ• ͔ͤͬ͘ମݧͨ͠Μ͔ͩΒɺͪΐͬͱͨ͜͠ͱͰશવྑ͍ͷͰɺΞτϓοτ͠Α͏ʂʂʂ• Ұݴ͚ͩͰશવ OKʂʂʂɹͦͷ࣌ɺϋογϡλά͚ͪΌ͓͏ʂʂʂ• αʔϏεϓϩόΠμʔʹɺͬͱͬͱΞτϓοτͯ͠ཉ͍͠ʂʂʂ• ใ͕গͳ͍ͱෆ҆ʹͳΔ…ɻ҆৺ͯ͠ɺTry ͍ͨ͠ʂʂʂ• ·ͨɺใͷछྨ͕গͳͯ͘ɺෆ҆ʹͳΔ…ɻఏڙ͍ͯ͠ΔαʔϏεͷใ͚ͩͰͳ͘ɺͦΕΛத৺ͱͨؔ͠࿈͢Δใ͕ଟ͍ͱɺ͘͢͝خ͍͠ʂʂʂ• Shifter Partner Network ͷํʑग़དྷΔൣғͰɺΞτϓοτ͚ͯ͠Δͱɺඇৗʹ͋Γ͕͍ͨͰ͢ʂʂʂ
• ͔ͤͬ͘ͷग़ձ͍ܨ͕ΓΛେʹͯ͠ɺ͓ޓ͍Λ ϑΥϩʔ & Φʔμʔ ͠߹͓͏ʂʂʂ• ؤுͬͯΞτϓοτͯ͘͠Εͨ͜ͱʹײँͯ͠ɺपΓͷํʑʹ͑Α͏ʂʂʂ• ༐ؾΛग़ͯ͠ɺૉʹײͨ͜͡ͱΛ͑Α͏ʂʂʂɹΠϕϯτ͋Γ͕ͱ͏ʂʂʂ✊ ग़ձ͍ܨ͕ΓΛେʹͯ͠ɺɹɹϑΥϩʔ & Φʔμʔ ͠߹͓͏ʂօ͞Μܨ͕Γ·͠ΐ͏ʂ!LVTPLBNBZBSPV
ͦͷ WordPress ͪΐͬͱ Shifter ʹҠߦͯ͠Έ·ͤΜ͔ ʁօ͞Μɺ͝ਗ਼ௌͲ͏͋Γ͕ͱ͏͍͟͝·ͨ͠ʂࢼͯ͠ΈͨΒɺΞτϓοτ͠Α͏ʂ[email protected](FU4IJGUFS