Polymerを使った次世代Webアプリケーションの開発を体験しよう/phpstudy-2017-02

PHP勉強会 2017年2月発表資料

Transcript

1. 1PMZNFSΛ࢖ͬͨ
   ࣍ੈ୅8FCΞϓϦέʔγϣϯͷ
   ։ൃΛମݧ͠Α͏
   QIQTUVEZCZ!TJ[VIJLP
   

   View Slide

2. ,FOJDIJSP,JTIJEB
   5PLZP +"1"/
   TJ[VIJLP!HNBJMDPN !TJ[VIJLP
   IUUQTHJUIVCDPNTJ[VIJLP
   IUUQCMPHPQFOUPLZPKQ
   2QN[OGTEQGFQ
   
   

   View Slide

3. େࣄͳ͜ͱ͸࠷ॳʹ
   

   View Slide

4. ͦ͏ͩ1PMZNFS࢖͓͏
   1PMZNFS
   

   View Slide

5. 1PMZNFS
   https://www.polymer-project.org
   

   View Slide

6. 8):1PMZNFS
   w ͱʹ͔͘1PMZNFS͕޷͖
   w ϑϩϯτΤϯυͷ%0.୯ҐճؼͷྲྀΕ
   w &YUFOTJCMF8FC.BOJGFTUPΛ࣮ݱ
   ͍ͤͨ͞
   w 1SPHSFTTJWF8FC"QQTͷ࣌୅
   

   View Slide

7. K2VFSZqBTIҎલ
   ϑϩϯτΤϯυ αʔόʔαΠυ
   σβΠϯ
   )5.-$44
   )5.-+4
   αʔόʔαΠυϓϩάϥϛϯά
   

   View Slide

8. K2VFSZ'MBTIશ੝ظ
   ϑϩϯτΤϯυ αʔόʔαΠυ
   σβΠϯ
   )5.-$44
   K2VFSZ
   'MBTI
   )5.-K2VFSZ
   αʔόʔαΠυϓϩάϥϛϯά
   

   View Slide

9. K2VFSZ'MBTIҎ߱
   ϑϩϯτΤϯυ αʔόʔαΠυ
   σβΠϯ
   )5.-$44
   #BDLCPOF&NCFS3FBDU
   "OHVMBS
   αʔόʔαΠυϓϩάϥϛϯά
   

   View Slide

10. 1PMZNFSҎ߱
    ϑϩϯτΤϯυ αʔόʔαΠυ
    σβΠϯ
    )5.-$44
    1PMZNFS
    αʔόʔαΠυ
    ϓϩάϥϛϯά
    

    View Slide

11. https://extensiblewebmanifesto.org/
    ඪ४Խ૊৫Ͱ͋Δ8$ͱϒϥ΢βϕϯμ͚ͩͰͳ͘
    8FC։ൃऀ΋ר͖ࠐΜͰ8FCͷະདྷΛ֦ு͍ͯ͜͠͏
    

    View Slide

12. https://developers.google.com/web/fundamentals/
    getting-started/codelabs/your-first-pwapp/?hl=ja
    

    View Slide

13. w W
    w WW
    w WW
    w W
    w W
    w W
    w W
    w W
    w W
    w W
    w W
    https://github.com/Polymer/polymer/releases
    93
    Releases!!
    

    View Slide

14. WebComponent

    ࢖ͬͯ·͔͢ʁ
    

    View Slide

15. 8FC$PNQPOFOUT
    w4IBEPX%0.
    w$VTUPN&MFNFOUT
    w)5.-*NQPSUT
    w)5.-5FNQMBUFT
    https://github.com/w3c/webcomponents
    

    View Slide

16. w1PMZNFS
    w95BH
    w#040/*$
    w4LBUF+4
    w3FBDU+4
    w"OHVMBS
    8FC$PNQPOFOUT
    >8FC$PNQPOFOUTPSH
    

    View Slide

17. w8FC$PNQPOFOUT
    w%BUB#JOEJOH
    w#FIBWJPST
    w)FMQFST
    w.BUFSJBM%FTJHO
    w$-*5PPMT
    

    View Slide

18. https://www.webcomponents.org/collection/Polymer/elements
    

    View Slide

19. https://customelements.io/
    

    View Slide

20. https://codelabs.developers.google.com/?cat=Web
    

    View Slide

21. LIVE DEMO
    

    View Slide

22. ͦ͏ͩ1PMZNFS࢖͓͏
    1PMZNFS
    

    View Slide

23. 2QN[OGTEQGFQ
    
    1PMNFSDPFEP
    w(PPHMF$PEFMBCTͷϋϯζΦϯ
    wNFFUVQ
    w-5େձ
    w044׆ಈʢΤϨϝϯτ࡞੒ͳͲʣ
    

    View Slide

24. WJTJUNZCMPHHJUIVC
    https://github.com/sizuhiko
    http://blog.open.tokyo.jp
    

    View Slide