Download as PDF, PPTX
![LODを使ったサイトとプラグインを作ってみた話[WordBenchOsaka]](https://cdn.slidesharecdn.com/ss_thumbnails/wordbentchosaka33-140920001750-phpapp02-thumbnail.jpg?width=640&height=640&fit=bounds)
やらいや！WebComponents wp-dfes03 LT
- 1. やらいや！ Web Components WP-D Fes#03 LightningTalk
- 2.
- 3. あんた誰？ • 岡本秀高（ヒデ） • 京都生まれ京都育ち •PHPエンジニア • Code for Shiga/Biwako • WordCamp Kansai 2015 • http://wp-kyoto.net/
- 4.
- 5. What’s 「やらいや！」 • 鳥取の方言で「やろうや！」 •和太鼓でお世話になった人から聞いた言葉。 • 語感がすごく気に入っている。 • →「山内利一 YARAIYA」で検索やらいや！
- 6.
- 7.
- 8. WebComponentsとは？ • 「オレ専用HTMLタグ」が作れるスゴいヤツ • CSSやJSまでタグの中に組み込めちゃう便利なヤツ •Google/Mozilla謹製HTMLタグまであるヤバいヤツ
- 9. こんなに便利なWebComponents • オリジナルのHTMLタグを作って要素を使いまわせる • 「コンポーネント内だけのCSS」が作れる •「HTMLタグ単位」で外部ライブラリを利用できる
- 10.
- 11. Polymer 0.5 • MaterialDesign対応 • Flexboxにも対応 • その他色んなPolyfil実装
- 12.
- 13.
- 14. JavaScriptの壁 • templateタグを呼び出すためにJavaScriptが必要 • jQueryではなくNativeJS •jQuery慣れしていると、かなり取っ付きにくい
- 15.
- 16.
- 17. 言葉の壁 • 重要そうな奴は大体英語 • Polyfilのドキュメントなんて余計に英語 •Google翻訳との地道な戦い
- 18.
- 19.
- 20.
- 21.
- 22.
- 23. 開拓され始めた日本語版 • 最近ついにPolymerの日本語チュートリアルができた • PolymerPolytechnic Codelabs http://itshackademic.com/codelabs?locale=ja • StackOverflow日本語版の登場 • HTML5Conferenceなどで注目度爆上げ中 →日本語技術記事が増えてくる・・・はず！
- 24. 集めよう、お気に入りコンポーネント • importするだけで、オリジナルHTMLタグが利用可能！ • GitHubなどに山ほど公開されている •自分で作ったものの公開ももちろんOK！
- 25. 集めよう、 お気に入りコンポーネント • Polymer PaperElements https://www.polymer-project.org/docs/ elements/paper-elements.html • Google Web Components http://googlewebcomponents.github.io/ • Custom Elements http://customelements.io/
- 26.
- 27.
- 28. 相性抜群の「WP-API」 • WordPressのデータをREST APIで取得 •Ajax処理するWebComponentを読み込んで、 • オリジナルHTMLタグに放り込むだけ。 • NoPHPでWordPressサイトが作れちゃう！
- 29.