Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Jamstack×microCMS 実装編

Jamstack×microCMS 実装編

JAMSTACK Meetup #1 の発表スライドです。

Kazuki Shibata

January 30, 2020
Tweet

More Decks by Kazuki Shibata

Other Decks in Technology

Transcript

  1. +BNTUBDLºNJDSP$.4
    ࣮૷ฤ
    !TIJCF
    +".45"$,.FFUVQ

    View full-size slide

  2. ࣲా࿨ف,B[VLJ4IJCBUB
    !TIJCF
    ΢Υϯλגࣜձࣾͷڞಉ૑ۀऀ$00ɻ
    σβΠϯɺϑϩϯτΤϯυ࣮૷ʢओʹ41"ʣ͕޷͖ɻ
    3FBDUϝΠϯ͚ͩͲɺ࠷ۙ7VF/VYU͋ͨΓ΋৮Δɻ

    View full-size slide

  3. +BNTUBDLͱ͸

    View full-size slide

  4. +BNTUBDLͱ͸
    ๏ 8FCαʔόʔʹґଘ͠ͳ͍αʔόʔϨεͳߏ੒Ͱ͋Δ
    ๏ ࣄલʹϏϧυ͞Εͨ੩తͳϑΝΠϧΛ$%/͔Β഑৴͍ͯ͠Δ
    ๏ "1*Λݺͼग़͢৔߹͸+BWB4DSJQUܦ༝ͰߦΘΕ͍ͯΔ

    View full-size slide

  5. Ұൠతͳ+BNTUBDLߏ੒

    View full-size slide

  6. +BNTUBDLͷར఺
    ๏ ඞཁͳͷ͸੩తϑΝΠϧͷϗεςΟϯάͷΈ
    /FUMJGZɺ(JU)VC1BHFTɺ4ɺ/PXͳͲʢݸਓར༻ϨϕϧͳΒແྉʣ
    ๏ "1*ίʔϧ͸Ϗϧυ࣌ͷΈ
    "1*ϦΫΤετ਺ͷ੍ݶ͕͋ͬͯ΋҆৺
    ๏ ߴηΩϡϦςΟˍύϑΥʔϚϯε͕ྑ͍
    ੩తϑΝΠϧΛͨͩ$%/͔Β഑৴͍ͯ͠Δ͚ͩ

    View full-size slide

  7. (PPHMFτϨϯυʢੈքʣ

    View full-size slide

  8. NJDSP$.4ͱ͸

    View full-size slide

  9. αʔϏε֓ཁ
    ๏ ೔ຊ੡ͷΫϥ΢υܕϔουϨε$.4
    ๏ ඇΤϯδχΞͰ΋࢖͍΍͍͢؅ཧը໘
    ๏ ίϯςϯπ͸"1*ܦ༝Ͱऔಘ
    ๏ Ϗϡʔଆ͸ࣗ༝ʹௐ੔ʢΞϓϦɾ*P5ͳͲʹ΋ʣ

    View full-size slide

  10. NJDSP$.4ͷٕज़ߏ੒
    ๏ "84"NQMJGZ੡
    "QQ4ZOD-BNCEB%ZOBNP%#4$PHOJUP
    ๏ αʔόʔϨε41"ߏ੒
    ๏ ϑϩϯτ͸3FBDU੡
    ๏ 4FOUSZͰ41"ͷόάऩू

    View full-size slide

  11. NJDSP$.4ͷਪ͠ϙΠϯτ
    ʘதͷਓ͕ڭ͑ͪΌ͏ʗ

    View full-size slide

  12. ෼͔Γ΍͍͢6*69
    ๏ ϔουϨε$.4͸։ൃऀͱඇ։ൃऀͷ྆ํ͕࢖͏
    ๏ ྆ऀʹͱͬͯ෼͔Γ΍͍͢6*͕ඞཁ

    View full-size slide

  13. ։ൃऀࢹ఺
    ˠͱʹ͔͘"1*Λݺͼग़͢·ͰΛૉૣ͘ɺ؆୯ʹ

    View full-size slide

  14. "1*ϨεϙϯεΛ(6*͔Βઃܭ͢Δ͚ͩ

    View full-size slide

  15. ؅ཧը໘͔Β"1*ϨεϙϯεΛ֬ೝͰ͖Δ

    View full-size slide

  16. ฤूऀࢹ఺
    ˠͱʹ͔͘"1*ͱ͍͏୯ޠΛݟͤͳ͍

    View full-size slide

  17. "1*ܥͷϝχϡʔΛશͯඇදࣔ

    View full-size slide

  18. ๏ ॊೈͳεΩʔϚઃఆ͕Մೳ
    ๏ εΩʔϚ͸͍ͭͰ΋มߋՄೳ
    ๏ ϑΟʔϧυ͸ଓʑ௥Ճத
    ࣗ༝ͳεΩʔϚ

    View full-size slide

  19. ڧྗͳը૾ฤू"1*
    NJDSP$.4Ͱ͸ը૾ྨ͸$%/͔Β഑৴͞Ε·͢ɻ
    ը૾63-ͷޙΖʹύϥϝʔλΛ෇༩͢Δ͜ͱͰɺϦαΠζ΍੾Γൈ͖Λ؆୯ʹߦ͏͜ͱ͕Ͱ͖·͢ɻ
    8FC1ม׵ͳΜ͔΋Ͱ͖·͢ɻ
    NPVOUBJOKQH I NPVOUBJOKQH X NPVOUBJOKQH pUDSPQXI

    View full-size slide

  20. ฤूཤྺػೳ
    ๏ ίϯςϯπૢ࡞ͷཤྺ͕ݟΒΕΔ
    ๏ ͍ͭͰ΋Ͳͷόʔδϣϯʹ΋໭ͤΔ

    View full-size slide

  21. ڧྗͳ"1*ύϥϝʔλ
    ๏ ϑΟϧλʔػೳ
    FRVBMT
    OPU@FRVBMT
    MFTT@UIBO
    HSFBUFS@UIBO
    DPOUBJOT
    FYJTUT
    CFHJOT@XJUI
    ࢦఆͨ͠஋ͱ׬શҰக
    ࢦఆͨ͠஋ͱ෦෼Ұக
    ࢦఆͨ͠஋ͱҰக͠ͳ͍
    ࢦఆͨ͠஋ΑΓখ͍͞
    ࢦఆͨ͠஋ΑΓେ͖͍
    ଘࡏ͢Δ
    OPU@FYJTUT
    ଘࡏ͠ͳ͍
    ࢦఆͨ͠஋͔Β࢝·Δ
    pMUFST DBUFHPSZVQEBUF
    UJUMFߋ৽UJUMF"1*

    ྫɿ

    View full-size slide

  22. +BNTUBDLͷ࣮૷ʢ/VYUฤʣ

    View full-size slide

  23. ୊ࡐNJDSP$.4ϒϩά
    IUUQTNJDSPDNTJPCMPH

    View full-size slide

  24. ओͳ੩తαΠτδΣωϨʔλ
    3FTU"1*ϕʔε (SBQI2-ϕʔε
    3FBDU੡ BUTCZ
    7VF੡
    (BUTCZ
    (SJETPNF
    /VYU

    View full-size slide

  25. /VYUͩͱॏཁͳͷ͸͜ͷͭ
    ๏ BTZOD%BUB
    ๏ OVYUDPOpHKT

    View full-size slide

  26. /VYUͷBTZOD%BUB
    ๏ αʔόʔαΠυͰ͸ॳճ͚ͩݺͼग़͞ΕɺΫϥΠΞϯταΠυͰ͸ϖʔδ
    ભҠΛ͢Δͨͼʹݺͼग़͞ΕΔ
    ͜͜ʹඇಉ࣌ॲཧΛॻ͘͜ͱͰɺOVYUHFOFSBUF࣌͸"1*Ϩεϙϯε΋)5.-ʹؚ
    ΊͨܗͰੜ੒͞ΕΔ

    View full-size slide

  27. هࣄը໘ͷߏ੒
    هࣄຊจ
    ΧςΰϦʔ
    هࣄҰཡ

    View full-size slide

  28. <هࣄৄࡉϖʔδͷྫ>

    View full-size slide

  29. <هࣄৄࡉϖʔδͷྫ>

    View full-size slide

  30. OVYUDPOpHKT
    ๏ OVYUHFOFSBUF࣌ʹσϑΥϧτͰ͸ಈతͳϧʔςΟϯάύε͸੩తϖʔδ

    ੜ੒͞Εͳ͍
    ྫɿQBHFTJOEFYWVF͸ੜ੒͞ΕΔ͕ɺQBHFT@TMVHJOEFYWVF͸

    ੜ੒͞Εͳ͍
    ๏ OVYUDPOpHKTͷHFOFSBUFઃఆͰ"1*Λݺͼग़͠ɺ੩తੜ੒͢ΔͨΊͷ

    ϧʔςΟϯάύεΛࢦఆͯ͋͛͠Δඞཁ͕͋Δ
    ๏ ଞʹ΋OVYUDPOpHKT͔Βͷ"1*ܦ༝ͰαΠτϚοϓ࡞੒΍344ϑΟʔυ
    ͷ࡞੒΋Ͱ͖Δ

    View full-size slide

  31. ͏·͍͘͘ͱ͜Μͳײ͡Ͱੜ੒Ͱ͖Δ

    View full-size slide

  32. ·ͱΊ
    ๏ +BNTUBDL͸଎ͯ͘ηΩϡΞͰ͍҆
    ๏ NJDSP$.4͸εΰΠ
    ๏ +BNTUBDLͷ࣮૷͸νϣοτΉ͍ͣ

    ʢಛʹ1SPNJTFɺ"TZOD"XBJUͷ஌ࣝ͸ͪΌΜͱ࣋ͬͯΔඞཁ͋Γʣ

    View full-size slide

  33. 5IBOLT

    !TIJCF

    View full-size slide