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

20201202発表 Vue.jsを使ったProgressiveな新規サービス開発

doyaaaaaken
November 29, 2020
170

20201202発表 Vue.jsを使ったProgressiveな新規サービス開発

doyaaaaaken

November 29, 2020
Tweet

More Decks by doyaaaaaken

Transcript

  1. smartroundͱ͸ • αʔϏε • ʰελʔτΞοϓɾ౤ࢿՈؒͷσʔλڞ༗ϓϥοτϑΥʔϜʱSaaS • ελʔτΞοϓʹ͸גओ૯ձɾࢿຊ੓ࡦαʔϏε౳Λఏڙ • ౤ࢿՈʹ͸౤ࢿઌ؅ཧαʔϏεΛఏڙ •

    ٕज़ελοΫ • ϑϩϯτVue.js×TypescriptɺαʔόαΠυKotlinɺΠϯϑϥAWS • ʰsmartroundΛࢧ͑Δٕज़ʱͱ͍͏ٕज़঺հࢿྉ΋ެ։͍ͯ͠·͢
  2. Level1. Vue.jsͷجຊػೳͷΈར༻ɿ࢓૊Έ • ॲཧ • HTMLͷdata-attributeʹඳը͍ͨ͠σʔλΛJSONͱͯ͠ೖΕ͓͖ͯɺ ͦΕΛར༻͢ΔܗͰVue.jsͰը໘ඳը • Ϣʔεέʔε •

    v-if, v-forͳͲVue.jsͷը໘ඳըܥػೳ͚ͩར༻͍ͨ͠έʔε • ڞ௨తͳίϯϙʔωϯτΛVueComponentԽ͠࠶ར༻͍ͨ͠έʔε
  3. Level2. ͪΐͬͱϦονͳը໘ʹɿ࢓૊Έ • Ϧονͳը໘Λ࡞Δͷʹ൐͍৭ʑͳVue.jsؔ࿈ػೳΛ࢖͍࢝ΊΔ • VueRouterΛ࢖͍ɺҰ෦ͷϖʔδ܈͚ͩSPAతͳڍಈʹͨ͠Γ… • mixinΛ࢖ͬͯɺڞ௨ॲཧΛ੾Γग़ͨ͠Γ… • event

    busΛ࢖ͬͯɺ਌ࢠؔ܎ͷແ͍ίϯϙʔωϯτؒͰͷΠϕϯτ఻೻Λͨ͠ Γ… • mixin΍event bus͸γϯϓϧͰ࢖͍΍͍͢Ͱ͕͢ ػೳͷෳࡶੑ͕ߴ͘ͳΔͱϝϯςφϯεੑ͕௿͍ͷͰVuexΛ࢖͏