LeacTion!について / About LeacTion!

Webナイト宮崎 vol.11 で発表した資料です

Transcript

1. LeacTion! ʹ͍ͭͯ
   ษڧձɾLTͷͪΐ͏Ͳ͍͍ίϝϯτπʔϧ͕ཉ͔ͬͨ͠ͷͰ࡞ͬͯΈͨ
   2020-11-27 WebφΠτٶ࡚ vol.11 ܂ാӳࢿ
   

   View Slide

2. ࣗݾ঺հ
   • ܂ാӳࢿ(37)
   • ϑϦʔϥϯεΤϯδχΞ
   • ։ൃۀ຿
   • ϝϯλʔ
   • ʮͯ͛΄͛ʯॴଐ
   • झຯଟ਺
   

   View Slide

3. LTʹ࣭໰΍ίϝϯτ͕͍ͨ͠
   ΈΜͳͷ൓Ԡ͕Έ͍ͨ
   

   View Slide

4. ͜Ε·Ͱ
   • Ҵຊ͞Μ (@shogo0525) ͕։ൃ͍ͯͨ͠ Hasso
   • ൃද࿮͝ͱʹϖʔδΛ࡞ͬͯίϝϯτͰ͖ͨ
   • ॾࣄ৘͋ΓผͷπʔϧΛ࢖͏͜ͱʹ
   • લճͷWebφΠτٶ࡚ vol.10 Ͱར༻ͨ͠ Handsup!
   • ແྉͰखܰ
   • ʮ͍͍ͶʂʯॱͰࣗಈతʹιʔτ͞Εͯ͠·͍ʮ͍͍Ͷʂʯېࢭʹ
   

   View Slide

5. ΤϯδχΞͳΒ
   ཉ͍͠΋ͷ͸
   ࣗ෼Ͱ࡞Δ
   

   View Slide

6. ࡞ͬͨ
   

   View Slide

7. LeacTion!
   

   View Slide

8. = Reaction! for LT
   

   View Slide

9. https://leaction.web.app/
   

   View Slide

10. ಛ௃
    • ։࠵ऀ΋ࢀՃऀ΋ϩάΠϯෆཁͰར༻Ͱ͖Δ
    • ൃද࿮ΛϖʔδભҠͤͣʹ͙͢ʹ੾Γସ͑ΒΕΔ
    • ʮ͍͍ͶʂʯͰ͖ΔʢҰਓҰճ·Ͱʣ
    

    View Slide

11. ࠾༻ͨ͠ϑϨʔϜϫʔΫɾαʔϏε
    • Vue 3
    • ϦϦʔε௚ޙͩͬͨͷͰ࢖ͬͯΈͨ
    • TailwindCSS
    • Ver.2 ͕ϦϦʔε͞ΕͨͷͰͦͷ͏ͪҠߦ͍ͨ͠
    • Firebase (Hosting, Firestore, Cloud Functions)
    • Cloud Functions ͷCDNΩϟογϡػೳΛར༻
    

    View Slide

12. FirestoreͷΞΫηε਺ΛԼ͍͛ͨ
    ϒϥ΢β
    7VF
    
    )PTUJOH
    
    $MPVE
    'VODUJPOT
    'JSFTUPSF
    POST
    GET
    $%/
    $BDIF
    Hostingܦ༝ͰCloud FunctionsΛݺͼग़͠ϨεϙϯεΛCDNΩϟογϡ͢Δ
    https://firebase.google.com/docs/hosting/manage-cache?hl=ja
    

    View Slide

13. ࣍ճ
    Firestoreͷ
    ϦΞϧλΠϜΞοϓσʔτʹ
    ੾Γସ͍͑ͨ
    

    View Slide

14. ࠓճͷϦΞΫγϣϯΛड͚ͯ
    ͲΜͲΜվળ͠·͢
    

    View Slide

15. https://github.com/tegehoge/LeacTion
    ϓϧϦΫ͓଴͓ͪͯ͠Γ·͢
    

    View Slide