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

Vue.jsのない会社にVue.jsを入れていく

 Vue.jsのない会社にVue.jsを入れていく

B4e8461292c2cccef061741f8ba1ac3f?s=128

Ken Jumbo Haneda

May 27, 2020
Tweet

Transcript

  1. Vue.jsͷͳ͍ձࣾʹVue.jsΛೖΕ͍ͯ͘ ΦϯϥΠϯ։࠵ʂʲγϡʔϚΠʳ 5FDI-FBE&OHJOFFS͔Β࠷৽ٕज़Λֶ΂ʂ7VFKTฤ

  2. None
  3. S *OUSPEVDUJPO ຊ೔ͷ͓࿩ 1. ձࣾͷ͜ͱ 2. VueΛೖΕͨܦҢɾ՝୊ɾղܾࡦ 3. ·ͱΊ

  4. *OUSPEVDUJPO ࠓ೔࿩͢͜ͱ 1. VueΛೖΕΔࡍͷ૊৫ɾ։ൃ؍఺Ͱͷ՝୊ 2. ಋೖͷ݁Ռ

  5. *OUSPEVDUJPO ࠓ೔࿩͞ͳ͍͜ͱ 1. ࠷৽ͷVueͷ৘ใ 2. ࡉ͔͍ίʔυͷ঺հ

  6. Ӌా ݈ଠ࿠ 1SPpMF +VNCP!KVNCP0S/PU ٕज़ຊ෦αʔϏε։ൃ෦෦௕

  7. גࣜձࣾϨΞδϣϒ ΦϯϥΠϯӳձ࿩͸ɺΠϯλʔωοτΛ࢖ͬͨӳձ࿩αʔϏεɻ ͍ͭͰ΋Ͳ͜Ͱ΋Ϧʔζφϒϧʹɺ֎ࠃਓߨࢣͷϨοεϯΛडߨͰ͖·͢ɻ ແྉମݧɾແྉΧ΢ϯηϦϯά࣮ࢪதʂ ͥͻࢲͨͪͷϨοεϯΛडߨͯ͠Έ͍ͯͩ͘͞ɻ 3BSF+PCJOD 13

  8. 13

  9. 13

  10. 13 ϑϩϯτΤϯυɾόοΫΤϯυɾωΠςΟϒΞϓϦɾσβΠϯͰ༷ʑͳ ٕज़Λ૯ಈһֶͯ͠शऀͷͨΊͷγεςϜͷ։ൃɾӡ༻Λ͍ͯ͠·͢

  11. VueΛٕज़૊৫ʹ૊ΈࠐΉ

  12. $VSSFOUTJUVBUJPO ϨοεϯϧʔϜ 4."35.FUIPEš ͍͔ͭ͘ͷϓϩμΫτͰ7VFΛར༻ • -BSBWFM 7VF .1"  •

    7VF 41"  • /VYU 41"  
 ಋೖ͔Β͠͹Β͘ɾɾɾ ٕज़ಋೖΛͭͭ͠૊৫΋มԽ͍ͯ͠Δɻ
  13. 1SFWJPVTTJUVBUJPO ΤϯδχΞ͸όοΫΤϯυ΋ϑϩϯτ΋ରԠ͢Δ ϑϩϯτͱݺ͹ΕΔ৔ॴ͸ੜKTɺKRVFSZ σβΠφʔͱ࿈ܞͯ͠4BTT$44Λॻ͍ͨΓ͓ئ͍ͨ͠Γɾɾɾ ౰࣌ͷٕज़૊৫ Ұݟͯ͠ྲྀಈੑ͸ߴ͘ॊೈʹݟ͑ΔҰํͰɺ ΤϯδχΞࣗ਎͕ઐ໳ੑͷߴ͍ྖҬʹूதͨ͠ΓɺϩʔϧʢڧΈʣͷ෼ղ͕͠ʹ͍͘ ·ͨ࠾༻ࢢ৔ʹ΋ဃ཭͕͋Γɺ࠾༻ཁ݅΋੔ཧ͠ʹ͍͘ NFNP

  14. 1SFWJPVTTJUVBUJPO 9 ೥લɺ৽نࣄۀͷ։ൃͷࡍʹ7VFΛਖ਼ࣜʹ ೖΕ͍ͯ͘͜ͱΛܾఆɻ Ճ͑ͯʮϑϩϯτΤϯυ૊৫ʯΛ ࡞͍ͬͯ͘͜ͱ΋ܾΊͨɻ ͭ·Γ VueΛೖΕΔ = ϑϩϯτΤϯυ

    ɹ૊৫Λ࡞Δ ʹͳͬͨɻ
  15. 1SPCMFNT  ϑϩϯτΤϯυΤϯδχΞͷϩʔϧJTԿʁ໰୊  ϑϩϯτΤϯυͷႈ౳ੑ໰୊  7VF"QQͷύϑΥʔϚϯε؅ཧJT೉͍͠໰୊ 3ͭͷ໰୊ ͦ͜Ͱग़͖ͯͨ

  16. 1SPCMFN ϑϩϯτΤϯυΤϯδχΞͷϩʔϧJTԿʁ໰୊ • ٕज़͸Կ͕Ͱ͖Ε͹͍͍ͷʁ • "1*·Ͱ৮Δʁ • %PDLFS͸Ͳ͏͢Δʁ • "84͸ɾɾɾͲ͏͔

     • $*$%ͷઃఆ͸୭ʹґཔ͢Δʁ
  17. 4PMVUJPO 'SPOUFOE #BDLFOE %FTJHOFS +4 54 XFCQBDL  OQN ZBSOʜ

    1)1 .Z42-  "1* 1)17JFXʜ $44 4BTT 6*69 4UZMF )5.-ʜ ໌֬ʹ͢΂͖৔ॴ͸ ͚ͩ͜͜Ͱͳ͘͜͜ ϩʔϧࣗମͷ੔ཧ͸౰ͨΓલɺ Ճ͑ͯඞཁͩͬͨͷ͸͸ Կ͕ڠྗͯ͠޲͖߹͏΂͖͔ ͱ͍͏ϩʔϧͷ͔ͿΔ෦෼ɻ FY .1"ͳΞϓϦέʔγϣϯʹ͓͍ͯ ɹ1)1WJFXͰ6*૊Ή͔7VFͰ΍Δ͔ɺ ɹͦΕΛͲ͕ͬͪ୲౰ɾϨϏϡʔ͢Δ͔
  18. 4PMVUJPO ϩʔϧͷॏෳΛΧόʔ͢ΔͨΊʹ΍͖ͬͯͨɾ͍Δ͜ͱ • "1*.PDLΛৗʹ੔උͯ͠#&ϨεͰ։ൃΛਐΊΒΕΔΑ͏ʹ͢Δ • 4XBHHFSBQJTQSPVU΍OPEFͰγϯϓϧʹKTPOฦ͚ͩ͢ͷαʔό • ϑϩϯτΤϯυ͸ϏϧυγεςϜʹ੹೚Λ࣋ͭ • /1.ى఺ʢZBSOʣͷ։ൃΛඪ४Խ

    • "1*ͷ։ൃ͸ݪଇ͠ͳ͍ʢڥքͷ෼཭ʣ • ίʔμʔ࡞ۀͷվળͱίϯϙʔωϯτ؅ཧ஌ࣝͷڞ༗ • 4BTT$TTϕʔεͷίϯϙʔωϯτ෼཭"UPNJD$PNQPOFOUTԽ • σβΠφʔ͔ΒίʔσΟϯά࡞ۀͷ෼཭
  19. 4PMVUJPO 'SPOUFOE #BDLFOE %FTJHOFS +4 54 XFCQBDL  OQN ZBSOʜ

    1)1 .Z42-  "1* 1)17JFXʜ $44 4BTT 6*69 4UZMF )5.-ʜ ·ͨҰճߟ͑Δ͚ͩͰͳ͘ɺ ϝϯόʔͷࢥߟ΍τϨϯυͰ มಈ͍ͤͯ͘͞ඞཁ͕͋Δ ͱ͖ʹ͸ӽڥ͢Δ͜ͱ΋͋Γ ͦΕ͕ϝϯόʔͷεΩϧͷ޿͕Γ ʹ΋ͳΔ
  20. 4PMVUJPO .1" 41" "1* 'SPOU ٕज़తͳ݁߹౓૊৫తͳ݁߹౓ʹͳΔͨΊͳΔ΂͘41"ʜ • σϓϩΠύΠϓϥΠϯͷ෼཭ • %PDLFSґଘ͔Βͷ཭୤

    • -BSBWFMNJY͔Βͷ཭୤ • ϑϩϯτΤϯδχΞͷؔ৺ΛݮΒ͢
  21. 1SPCMFN ϑϩϯτΤϯυͷႈ౳ੑ໰୊ ʮޙͰ͍͍΍ɾɾɾʯ͍ͬͺ͍͋Γ·͢ΑͶ • Ϗϧυ࣌ؒ • σϓϩΠͷࣗಈԽ • ൥ࡶɾ૿Ճ͢Δίϯϙʔωϯτͷ੔ཧ •

    ϧʔϧͷඪ४Խ
  22. 4PMVUJPO 9997VFͷγνϡΤʔγϣϯͰى͖Δ͜ͱͷҰͭʹ
 ႈ౳ੑ୲อɺ࿙Ε͕ͪ໰୊͕͋Γ·͢ɻ ॾʑɺ։ൃͷ༏ઌ౓తʹͲ͏͠Α΋ͳ͍͜ͱ΋͋Γ·͕͢
 ๨Εͳ͍Ͱཉ͍͠ͷ͕ ʮ൴ΒʢϏϧυγεςϜɾλεΫϥϯφʔʣͷ͝ػݏΛଛͶͳ͍Α͏ʹͯ͠ɺ
 ͍ͭͰ΋ಉ݁͡ՌΛಘΒΕΔঢ়گΛ࡞Δʯ͜ͱͰ͢ɻ

  23. 4PMVUJPO 9997VFͷγνϡΤʔγϣϯͰى͖Δ͜ͱͷҰͭʹ
 ϑΝΠϧ਺ΊͬͪΌ૿͑Δ໰୊͕͋Γ·͢ɻ ॾʑɺ։ൃͷ༏ઌ౓తʹͲ͏͠Α΋ͳ͍͜ͱ΋͋Γ·͕͢
 ఺͚ͩ๨Εͳ͍Ͱཉ͍͠ͷ͕ ʮ൴ΒʢϏϧυγεςϜɾλεΫϥϯφʔʣͷ͝ػݏΛଛͶͳ͍Α͏ʹͯ͠ɺ
 ͍ͭͰ΋ಉ݁͡ՌΛಘΒΕΔঢ়گΛ࡞Δʯ͜ͱͰ͢ɻ ΏΔ͘΍ΔͳΒʮͱΓ͋͑ͣ$*Ͱςετ͸ճΔʯঢ়گΛ ࡞͓͚ͬͯͩ͘Ͱ΋ɺ͋ͱ͔Β୭͔͕։ൃ͢Δͱ͖ʹ ؀ڥ࠶ݱੑ͕ߴ·Γ·͢˕

  24. 1SPCMFN 7VF"QQͷύϑΥʔϚϯε؅ཧJT೉͍͠໰୊ • 4&0͸ʁ • ϩΪϯά͸Ͳ͏͢Δͷʁ • -JHIU)PVTFͷείΞ͸্͛Δͷʁͦ΋ͦ΋਺ࣈ͸୭࣋ͭʁ • ϦϦʔε͍ͯ͠Δ41"͕໰୊ͳ͍͔Ͳ͏͔ΛͲ͏ܭଌ͢Δͷ

     FY ฐࣾͷϨοεϯϧʔϜͷ৔߹ • Ի੠͕ฉ͑͜ͳ͍ͱ͍͏໰͍߹Θͤ૿Ճ • ϨοεϯͰ͖ͳ͍ͱԹ౓ײߴ͘໰͍߹ΘͤདྷͪΌ͏ • ஞ࣍ରԠ͸ΩϦ͕ͳ͍ʜ • ਖ਼ৗՔಇΛ୲อ͢ΔࢦඪΛ࡞Δඞཁ͕͋ͬͨ
  25. 4PMVUJPO ϩΪϯάʹΑΔՄࢹԽͱϞχλϦϯά "QQ4ZOD %ZOBNP%# "VSPSB ϩά΍σʔλͷूੵ ϓϩμΫτ σʔλͷ4ZOD ౰ॳɺ%ZOBNP%#Λ௚઀SFEBTIʹͭͳ͍Ͱ͍͕ͨɺ ूܭ͢Δʹ΋%2-

    %ZOBNP%#2VFSZ-BOHVBHF ͸42-ϥΠΫͳ͚ͩͰ දݱྗʹ͚ܽΔͨΊɺσʔλΛTZODͯ͠SFEBTIͰՄࢹԽɻ %BTICPSBE"MFSU౳Λ׆༻ͯ͠։ൃɾ$4Ͱͷӡ༻ʹ׆༻
  26. 4PMVUJPO ϩΪϯάʹΑΔՄࢹԽͱϞχλϦϯά
 8FC35$ͷෳࡶͳσόοάɾ4UBUT৘ใΛू໿͢ΔͨΊʹผ్ߏங ౰ॳɺ%ZOBNP%#Λ௚઀SFEBTIʹͭͳ͍Ͱ͍͕ͨɺ ूܭ͢Δʹ΋%2- %ZOBNP%#2VFSZ-BOHVBHF ͸42-ϥΠΫͳ͚ͩͰ දݱྗʹ͚ܽΔͨΊɺσʔλΛTZODͯ͠SFEBTIͰՄࢹԽɻ %BTICPSBE"MFSU౳Λ׆༻ͯ͠։ൃɾ$4Ͱͷӡ༻ʹ׆༻

  27. $PODMVTJPO • 7VFΛ৽͘͠૊৫ʹೖΕ͍ͯ͘͜ͱ
 ϑϩϯτΤϯυ૊৫Λ࡞Δͱ͍͏͜ͱ • ϑϩϯτΤϯυ૊৫Λ࡞Δͱ͖͸ϩʔϧͷ͔ͿΔͱ͜ΖΛߟ͑ͯΈͯͶ • ϑϩϯτΤϯυ͸ҟৗ͕ݟ͑ʹ͍͘ͷͰࢦඪΛ࡞Ζ͏Ͷ IUUQTSBSFKPCUFDIEFQUIBUFOBCMPHDPN ςοΫϒϩά΋ΑΖ͓͘͠ئ͍͠·͢ʂ

    7VFࣗମ͸΋ͪΖΜٕज़తʹϝϦοτ͕ͨ͘͞Μ͋ΓɺڗडͰ͖͍ͯΔ
 ͨͩͦΕ͚ͩͰͳͯ͘Ұॹʹ૊৫΋มΘ͍͚͍ͬͯͯΔͷ͕˕