GitHub contributionsでうじまるを育てよう/lets_raise_your_uzimaru_with_github_contributions

GitHub contributionsでうじまるを育てるゲームを作ったお話です。
Vue.js/tailwindcss/Vercel(旧Now)/Vercel Serverless Functionsを使ったサーバレスWebフロントエンドアプリ開発の事例紹介にもなっています。
サービスのURLはこちら→ https://uzimaraiser.now.sh
リポジトリ→ https://github.com/konnyaku256/uzimaraiser

うじまる生誕LT会での登壇資料です。
https://zli.connpass.com/event/176933/

Transcript

1. (JU)VCDPOUSJCVUJPOTͰ
   ͏͡·ΔΛҭͯΑ͏
   ͏͡·Δੜ஀-5ձ
   !LPOOZBLV
   
   

   View Slide

2. ͜ΜʹΌ͘ !LPOOZBLV
   4FSWFSTJEF&OHJOFFS
   

   View Slide

3. ͭͬͨ͘΋ͷ
   

   View Slide

4. View Slide

5. View Slide

6. (JU)VCDPOUSJCVUJPOTͰ
   ͏͡·Δ
   ΛҭͯΔήʔϜ
   V[JNBSBJTFSʢ͏͡·Β͍͟ʔʣ
   

   View Slide

7. ΀Ζ͙Β·ʔʹ ͳͭ͘ ;͗͠ͳ ͱΓ
   ͔͍͵͠ͷ ͜ΈͬͱΛ ͨ΂ͯ ͍ͤͪΐ͏͢Δ
   ͏͡·Δ
   

   View Slide

8. (JU)VCͰ
   ׆ಈ͢Δͱ
   ͏͡·Δ͕
   ੒௕ʂ
   ༷ࢠΛ
   γΣΞʂ
   

   View Slide

9. V[JNBSV SBJTFFS Ͱ ͏͡·ΔΛҭͯΔͻͱͷҙ
   ͏͡·ΔΛҭͯͳ͕ΒɺίʔυΛॻ͖ͳ͕Βɺ
   ͍ͬ͠ΐʹ੒௕͠Α͏ʂ
   IUUQTV[JNBSBJTFSOPXTI
   /PXPOSFMFBTF
   

   View Slide

10. ։ൃٕज़
    8FCΫϥΠΞϯτ 41"18"
    4UBUJDTJUFT
    4FSWFSMFTT'VODUJPOT
    QVTINBTUFS
    8FCIPPLT
    

    View Slide

11. ήʔϜσʔλͷอଘ
    ࠓճͷߏ੒Ͱ͸όοΫΤϯυʹ%#͕ͳ͍
    χοΫωʔϜ΍(JU)VCͷϢʔβ໊͸MPDBM4UPSBHFʹอଘ͍ͯ͠Δ
    7VFKTͷϥΠϑαΠΫϧϑοΫΛ࢖ͬͯదٓσʔλΛૢ࡞
    

    View Slide

12. curl https://github.com/users/konnyaku256/contributions
    (JU)VCDPOUSJCVUJPOT(&5"1*ͷ࡞੒
    (JU)VCͷϓϩϑΟʔϧʹදࣔ͞Ε͍ͯΔDPOUSJCVUJPOHSBQIͷ৘ใ͸࣍ͷΑ͏ͳ
    (&5ϦΫΤετͰऔಘͰ͖Δ
    Ϩεϙϯε CPEZͷத਎
    ͸্هͷΑ͏ʹͳ͍ͬͯΔͷͰ
    ྫ͑͹ɺSFDUཁૉ ૲άϥϑͷλΠϧʹ૬౰
    ͷEBUBDPVOUΛ͏·͘ύʔε͢Ε͹
    ίϯτϦϏϡʔγϣϯ਺ΛऔΓग़ͤΔ͜ͱ͕Θ͔Δ
    

    View Slide

13. (JU)VCDPOUSJCVUJPOT(&5"1*ͷ࡞੒
    ࠓճ͸ϦΫΤετʹBYJPTɺύʔεʹDIFFSJPΛ࢖ͬͨ
    7FSDFMͷ4FSWFSMFTT'VODUJPOTʹσϓϩΠ BQJʹϩδοΫίʔυஔ͍ͱ͚ͩ͘
    
    ࠷৽೔ͷίϯτϦϏϡʔγϣϯ਺Λύʔε͢Δॲཧͷ࣮૷ྫ
    dϏοτ൱ఆԋࢉࢠɺͭॏͶΔͱখ਺ͷ੾ΓࣺͯԋࢉʹͳΔ
    ࢀߟ࣮૷
    IUUQTHJUIVCDPNQPUBUPEDPOUSJCVUUFS
    IUUQTHJUIVCDPNTBMMBSHJUIVCDPOUSJCVUJPOTDIBSU
    

    View Slide

14. UBJMXJOEDTT
    $44ݏ͍೿͚ͩͬͨͲɺ͜ΕͳΒ޷͖ʹͳΕͦ͏ʂͱͳͬͨ
    UBJMXJOEDPOGJHKT ۦಈͰએݴతʹελΠϧఆٛͰ͖Δͷ͕Α͔ͬͨ
    7FSDFM
    αʔόΠϯϑϥͷ͜ͱΛߟ͑ͳͯ͘ྑ͗ͯ͢೴͕ୀԽͦ͠͏
    ϏϧυσϓϩΠͷૣ͍ͱ͖஗͍ͱ͖ͷ͕͚ࠩͬ͜͏͋ͬͨ
    ৽͘͠৮ٕͬͨज़ͷॴײ
    

    View Slide

15. V[JNBSBJTFS͸ΦʔϓϯιʔεͰ։ൃ͞Ε͍ͯ·͢
    ༨༟͕͋Ε͹ࠓޙ΋ͪΐͬͱͣͭߋ৽͢Δ༧ఆͰ͢
    όάใࠂɺػೳ௥ՃͳͲ͓଴͍ͪͯ͠·͢ʂ
    4UBS΋։ൃͷྭΈʹͳΔͷͰੋඇʂʢٽ͍ͯتͼ·͢ʣ
    IUUQTHJUIVCDPNLPOOZBLVV[JNBSBJTFS
    $POUSJCVUJPOTXFMDPNF
    

    View Slide

16. 4QFDJBMUIBOLTUP!V[JNBSV
    

    View Slide