vuenight.pdf

Transcript

1. Serverless+Nativescript-vueͰ
   ΞϓϦ࡞ͬͯΈͨ࿩
   
   ٢໺խ໹ !BZBTBNJOE
   
   

   View Slide

2. ࣗݾ঺հ
   

   View Slide

3. ࣗݾ঺հ
   ٢໺ խ໹ (23)
   (Masaya Yoshino)
   FusicΤϯδχΞ
   Geek StudioӡӦ
   ۝भΞΠυϧޫGENKI
   ʰՎͬͯགྷΕΔΤϯδχΞʱ
   Twitter: @ayasamind
   ࠷ۙͷؔ৺: Ethereum, NEM
   

   View Slide

4. ࣗݾ঺հ
   ि1ษڧձͯ͠·͢
   ͓ؾܰʹ!!!
   

   View Slide

5. ࠓճͷςʔϚ
   

   View Slide

6. Serverless+Nativescript-vueͰ
   ΞϓϦ࡞ͬͯΈͨ࿩
   
   ٢໺խ໹ !BZBTBNJOE
   
   

   View Slide

7. NativeScriptͬͯʁ
   

   View Slide

8. NativeScriptͬͯʁ
   ɾJavaScriptͱCSSͰiOS,AndroidΞϓϦΛ࡞੒͢Δ͜ͱ͕
   Ͱ͖ΔϑϨʔϜϫʔΫɻ
   ɾWebViewͷUIϨϯμϦϯά͸࢖༻͍ͯ͠ͳ͍ɻ
   ɾAngularɺVueʹରԠɻ
   NativeScript
   

   View Slide

9. NativeScript-Vue
   

   View Slide

10. NativeScript-Vue
    

    View Slide

11. NativeScript-Vue
    

    View Slide

12. NativeScript-VueΛମݧ!
    

    View Slide

13. https://play.nativescript.org/?
    template=play-vue
    

    View Slide

14. NativeScript-Vueͷ࢝Ίํ
    

    View Slide

15. NativeScript-Vueͷ࢝Ίํ
    ωΠςΟϒΞϓϦͷ։ൃ؀ڥΛߏங
    

    View Slide

16. NativeScript-Vueͷ࢝Ίํ
    ωΠςΟϒΞϓϦͷ։ൃ؀ڥΛߏங
    tnsίϚϯυ͕ศརɻ
    $ tns doctor ։ൃ؀ڥ͕੔͍ͬͯΔ͔਍அ
    

    View Slide

17. NativeScript-Vueͷ࢝Ίํ
    

    View Slide

18. NativeScript-Vueͷ࢝Ίํ
    $ yarn install
    $ yarn run watch:
    (͸iOS͔android)
    

    View Slide

19. NativeScript-Vueͷ࢝Ίํ
    

    View Slide

20. όοΫΤϯυ͸?
    

    View Slide

21. View Slide

22. NativeScript-Vueͷॻ͖ํ
    

    View Slide

23. NativeScript-Vueͷॻ͖ํ
    σΟϨΫτϦߏ੒
    IUUQTHJUIVCDPNBZBTBNJOE/&.&&5
    

    View Slide

24. NativeScript-Vueͷॻ͖ํ
    JS෦෼
    WebͷVuejsͱ΄΅ಉ͡!
    

    View Slide

25. NativeScript-Vueͷॻ͖ํ
    JS෦෼
    ɾVue-router΍Vuex͕શ͘ಉ͡Α͏ʹ࢖༻Ͱ͖Δɻ
    ɾhttpΫϥΠΞϯτ͸axios౳Ͱ͸ͳ͘ɺnativescriptͷhttpModuleɻ
    ɾiOSͰ͸SSLԽͯ͠ͳ͍URLʹΞΫηε͢ΔલʹઃఆΛ͍͡Δඞཁ༗ɻ
    etc…
    

    View Slide

26. NativeScript-Vueͷॻ͖ํ
    HTML,CSS෦෼
    CSS͸Webͱಉ͡Α͏ʹهड़Մೳ
    HTML͸ಠࣗͷλά͕͋Δ
    

    View Slide

27. NativeScript-Vueͷॻ͖ํ
    HTML,CSS෦෼
    

    View Slide

28. ࣮ࡍʹNativeScript-VueͰΞϓϦ
    Λͭͬͯ͘Έͨ
    

    View Slide

29. ࣮ࡍʹNativeScript-VueͰΞϓϦΛͭͬͯ͘Έͨ
    ͭ͘Δ΋ͷɹҐஔ৘ใ×ϒϩοΫνΣʔϯΞϓϦ
    ֓ཁɹɹ ۙ͘ʹ͍Δਓʹແ଄࡞ʹ౤͛મ͕Ͱ͖Δ
    

    View Slide

30. ࣮ࡍʹNativeScript-VueͰΞϓϦΛͭͬͯ͘Έͨ
    Ͱ͖ͨ΋ͷ(·ͩग़དྷͯͳ͍)ɹ
    

    View Slide

31. ࣮ࡍʹNativeScript-VueͰΞϓϦΛͭͬͯ͘Έͨ
    ओͳػೳ
    ɾҐஔ৘ใऔಘ
    ɾ౤͛મ(ೖۚɾૹۚ)
    ɾϝοηʔδ
    

    View Slide

32. ࣮ࡍʹNativeScript-VueͰΞϓϦΛͭͬͯ͘Έͨ
    όοΫΤϯυ
    ɾnativescript-nodeify
    npm,yarnϞδϡʔϧΛ͍͍ײ͡ʹnativescriptͰ
    ࢖͑ΔΑ͏ʹͯ͘͠ΕΔɻ
    ɾaws-amplify
    aws-sdkΛػೳΛߜͬͯ࢖͍΍ͨ͘͢͠Α͏ͳ΋ͷ
    

    View Slide

33. ࣮ࡍʹNativeScript-VueͰΞϓϦΛͭͬͯ͘Έͨ
    όοΫΤϯυ
    ΢ΥϨοτ৘ใ
    Ϣʔβʔ৘ใ
    Ґஔ৘ใ
    ೝূ
    $PHOJUP
    "84-BNCEB
    "84-BNCEB
    

    View Slide

34. ࣮ࡍʹNativeScript-VueͰΞϓϦΛͭͬͯ͘Έͨ
    ೝূ
    

    View Slide

35. ࣮ࡍʹNativeScript-VueͰΞϓϦΛͭͬͯ͘Έͨ
    Ґஔ৘ใऔಘ
    

    View Slide

36. ࣮ࡍʹNativeScript-VueͰΞϓϦΛͭͬͯ͘Έͨ
    Ґஔ৘ใऔಘ
    

    View Slide

37. σϞ
    

    View Slide

38. IUUQTXXXZPVUVCFDPNXBUDI WF324NGSYI6
    

    View Slide

39. ͭͬͯ͘Έͨײ૝
    

    View Slide