1PMZNFSʹΑΔ
 8FC$PNQPOFOUTͷ ։ൃ 8FC$PNQPOFOUT$BGFCZ1PMZNFS+BQBO ,FOJDIJSP,JTIJEB !TJ[VIJLP

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

w ݱࡏͷόʔδϣϯ͸ w όʔδϣϯ͸ςΫχΧϧϓϨϏϡʔ൛ w όʔδϣϯ΋·ͩ·ͩݱ໾ w (PPHMFͷ$ISPNFνʔϜ͕։ൃ w 1PMZpMMͰ͸ͳ͍ 1PMZNFS

No content

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

6TF5IF1MBUGPSN

8FBSFGSJFOET https://custom-elements-everywhere.com/

No content

No content

https://github.com/PolymerElements/iron-ajax

No content

w8FC$PNQPOFOUTΛ࡞ΔͨΊͷܰྔ'8 wΞϓϦέʔγϣϯ΋࡞ΕΔ wঢ়ଶ؅ཧͱ͔͸ίϯϙʔωϯτ΍ผͷϥ ΠϒϥϦ͕ඞཁ wϑϧελοΫͰ͸ͳ͍

QPMZNFSTIPQ w FίϚʔεͷ18"σϞ ΞϓϦ w IUUQTHJUIVCDPN 1PMZNFSTIPQ w IUUQT TIPQQPMZNFS QSPKFDUPSH

https://polymer-jp.org/

)5.-&MFNFOU ϓϩύςΟૢ࡞ ςϯϓϨʔτૢ࡞ σʔλόΠϯσΟϯά ࣮ࡍ΍Γ͍ͨࣄ

)5.-&MFNFOU 1PMZNFS1SPQFSUZ"DDFTTPST 1PMZNFS5FNQMBUF4UBNQ 1PMZNFS1SPQFSUZ&GGFDUT 1PMZNFS&MFNFOU

)5.-&MFNFOU 1PMZNFS&MFNFOU 2.2 KB 3.4 KB 8.8 KB 11 KB 1PMZNFS1SPQFSUZ&GGFDUT 1PMZNFS5FNQMBUF4UBNQ 1PMZNFS1SPQFSUZ"DDFTTPST

w ৽͍͠ΞϓϦέʔγϣϯͷ࡞੒ w ৽͍͠$VTUPN&MFNFOUTͷ࡞੒ w 18"ΞϓϦέʔγϣϯ$VTUPN &MFNFOUTͷϏϧυ w ࣗಈςετ w ϩʔΧϧαʔόʔىಈ 1PMZNFS$-* https://github.com/ Polymer/polymer-cli

w WWͷϋΠϒϦουܗࣜͰॻ͔Ε ͨ$VTUPN&MFNFOUΛWܗࣜʹ ม׵͢Δ w 1PMZNFS͕ఏڙ͢ΔW༻ΤϨϝϯ τ͸ɺ͜ΕΛར༻ͯࣗ͠ಈม׵͞Ε ͍ͯΔ w Wͱಉ༷ʹɺϓϨϏϡʔ൛ 1PMZNFS.PEVMJ[FS https://github.com/ Polymer/polymer- modulizer

࡞ΔWT࢖͏

https://www.webcomponents.org/element/PolymerElements/paper-input

$VTUPN&MFNFOUT Polymer({ is: 'paper-input', behaviors: [Polymer.PaperInputBehavior, Polymer.IronFormElementBehavior], properties: { value: {notify: true, type: String}, },

)5.-5FNQMBUF [[label]] λά໊ ϓϨϑΟΫε ϥϕϧ αϑΟοΫε ࣮ࡍͷೖྗλά

)5.-5FNQMBUF class MyElement extends Polymer.Element { static get is() { return 'x-custom' } static get template() { return Polymer.html` <div>${this.headerTemplate}</div> <p>Hello this is some content</p> <div>${this.footerTemplate}</div> `; } static get headerTemplate() { return Polymer.html`...` } static get footerTemplate() { return Polymer.html`...` } }

)5.-*NQPSUT

4UZMF4IBEPX%0. :host { display: block; } :host([focused]) { outline: none; } :host([hidden]) { display: none !important; }

*ODMVEF4UZMFT input:disabled { @apply --paper-input-container-input-disabled; } input::-ms-input-placeholder { color: var(--paper-input-container-color, var(--secondary-text-color)); }

)BOEMFFWFOUT Polymer({ is: 'my-button', _tap: function() { console.log('押された'); } });

)BOEMFFWFOUT Polymer({ is: 'my-button', _tap: function() { console.log('押された'); }, ready: function() { this.$.myButton.addEventListener('tap', this._tap); } });

%BUBCJOEJOH [[label]] ಡΈࠐΈͷΈ ೖग़ྗ ಛఆͷϓϩύςΟ ʹ͸͕ඞཁ

ಋೖࣄྫ https://www.slideshare.net/hiroyukiaggre/whos-using-polymer

ͦ͏ͩ1PMZNFS࢖͓͏

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