$30 off During Our Annual Pro Sale. View Details »

サイゼリヤガチャで PWA開発に入門した話

marusho
June 26, 2021

サイゼリヤガチャで PWA開発に入門した話

PWA Night Conference 2021 LT Session

サイゼリヤガチャで PWA開発に入門した話
https://saizeriya-1000yen.marusho.io/

marusho
https://twitter.com/marusho_summers

marusho

June 26, 2021
Tweet

Other Decks in Programming

Transcript

  1. αΠθϦϠΨνϟͰ


    PWA։ൃʹೖ໳ͨ͠࿩
    PWA Night Conference 2021 LT Session
    @marusho_summers

    View Slide

  2. ࣗݾ঺հ
    • marusho 🦊 (@marusho_summers)


    • ௨৴ձࣾ → ෆಈ࢈ܥελʔτΞοϓ → ϑϦʔ&Webษڧத


    • Ұൠٕज़৬ → σʔλΤϯδχΞ → WebΤϯδχΞ(ʹͳΓ͍ͨ)


    • Python, AWS


    • झຯ: ݸਓ։ൃɺ⛰ొࢁɺα΢φ🧖

    View Slide

  3. αΠθϦϠΨνϟͬͯԿʁ

    View Slide

  4. αΠθϦϠ1000ԁΨνϟ
    1000ԁҎ಺Ͱ஫จͰ͖Δ


    αΠθϦϠϝχϡʔΛϥϯμϜදࣔ
    Ҏ্ɻ

    View Slide

  5. 2019/05/09

    View Slide

  6. ಥવ όζΔ
    ΊͬͪΌϏϏΔɻ
    ↓ TwitterτϨϯυ 1Ґ
    ↓ωοτχϡʔεʹͳΔ
    ↓ ৭Μͳ1000ԁΨνϟ͏·ΕΔ
    ↓ ಈతܭը๏Ͱ࠷ߴΧϩϦʔΛܭࢉ͢Δਓʑ
    ↓ ࣾ௕ʹೝ஌͞Εͯͨ

    View Slide

  7. خ͍͠ 🤗

    View Slide

  8. ͱ͋Δίϝϯτ

    View Slide

  9. 🤔 PWA?

    View Slide

  10. ͚ͨͯ͢ʂΠϯλʔωοτʂ

    View Slide

  11. ౰࣌ͷPWAͷೝࣝ
    • WebαΠτΛωΠςΟϒΞϓϦͬΆ͘Ͱ͖Δ


    • ϒϥ΢βͷΞυϨεόʔফͤΔΒ͍͠
    ͔͚ͬ͐ʂ

    View Slide

  12. 😊 PWA΍Δͧ

    View Slide

  13. ߏ੒Λมߋ
    ΦϑϥΠϯಈ࡞Λ࣮ݱ͢ΔͨΊ


    ϑϩϯτΤϯυͰ׬݁


    View Slide

  14. PWAԽ͸3εςοϓͰ͓खܰʂ


    1. HTTPSରԠ


    2. ϚχϑΣετϑΝΠϧͷ࡞੒


    3. Service Workerͷ࡞੒
    😅 Ұ൪ۤ࿑ͨ͠ͷ͸ϑϩϯτͷ஌ࣝෆ଍
    (ϑϨʔϜϫʔΫΛ࢖͑͹΋ͬͱ؆୯)

    View Slide

  15. ·ͱΊ
    • PWAͰ͓खܰΞϓϦԽ͕Ͱ͖ͨʂ


    • PWA͖͔͚ͬͰϑϩϯτΤϯυֶशΛ࢝ΊΒΕͨ


    • ݸਓ։ൃͩͱɺ(޷͖উखʹ)खΛಈ͔ͯ͠ཧղͰ͖Δ

    View Slide

  16. ·ͱΊ
    • ֶशͷաఔͱͯ͠ɺϞϊΛ࢒͢͜ͱ


    • ͱΓ͋͑ͣɺ࡞ͬͯΈΔʂ


    • ͱΓ͋͑ͣɺެ։ͯ͠ΈΔʂ


    • ͢Δͱɺੈք͕มΘΔ͔΋ʂʂ

    View Slide

  17. 🔥 ݸਓ։ൃ͸͍͍ͧ

    View Slide

  18. ͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠
    ૉఢͳPWA&ݸਓ։ൃϥΠϑΛ🎉

    View Slide