タグ

関連タグで絞り込む (1)

タグの絞り込みを解除

WebComponentsとpolymerに関するJxckのブックマーク (8)

  • Polymer 1.0をさわってみて - console.lealog();

    さて、ここにこういうサイトがあります。 nodefest.jp 実はこのサイト、噂のPolymerの1.0をふんだんに使ってます。 というわけで、そんなそこまでがっつり使い込んだわけではないですが、知見らしいものが一応たまったので・・。 まだ見ぬ未来のポリマリストのために書いておきます。 Polymer Starter Kit github.com こういうのがありまして。 とりあえずcloneしてきてビルドすればそれっぽい雰囲気はすぐにつかめると思うので、さわってみたい人はここからはじめると良さそうです。 Gulp まずは外堀から埋めていきます。 # localhost:3000 で開発(ビルドしない) gulp serve # localhost:3000 で開発(ビルドしたものは`dist`配下に) gulp serve:dist # ビルドするだけ(`dist`配下に) gulp

    Polymer 1.0をさわってみて - console.lealog();
  • platform.js ⇒ webcomponents.js | Polymer Blog

    The latest goings-on with the Polymer project and in the community. We'll update this page to announce major releases and showcase cool stuff being built with Polymer. Have an idea for an article? Suggest it!

    Jxck
    Jxck 2014/10/20
    platform.js は webcomponents.js に改名らしい。
  • Polymer と Web Components の違い9選(もとい Polymer の便利機能)

    違い、または付加機能 色々な周辺事情で、勢力を広げつつある Polymer さん。(つい最近、それに加担したような気もする) 「どこまでが Web Components で、どこからが Polymer なのか」を理解するためにもPolymerの機能をメモる。Polymer は色々なことを便利にしてくれるライブラリであり、差分を言い出すとキリがないので主要なポイントだけ。 <template> が自動で Shadow DOM に放り込まれる Shadow DOM内の <link> をインラインの <style> に展開 repeat のサポート {{interpolate}} のサポート <element> のかわりを <polymer-element> としてサポート on-click とかイベントハンドラの宣言 this.$ による idが付加された要素のコレクション observe に

    Polymer と Web Components の違い9選(もとい Polymer の便利機能)
    Jxck
    Jxck 2014/08/07
    まさしく昨日話してたやつだ。 “「どこまでが Web Components で、どこからが Polymer なのか」”
  • Polymer の Shadow DOM Polyfill - Qiita

    Polymerは、WebComponentsが実装されてないブラウザにもWebComponentsの機能を使えるようにするためのPolyfillを提供している。(Polymerの一部であるplatform.jsというのがPolyfillのためのライブラリ) Browser Compatibility - Polymer ただ、あたりまえだけどShadow DOMの機能だけは正確にPolyfillできてないみたい。例えばpolymer-ui-clockというコンポーネントをShadow DOMに対応していないブラウザで見てみると次のように、単にカスタムエレメントの子要素にDOMを追加しただけで、CSSも単にhead要素内に展開されているだけである。 なので、例えば次のようなCSSがあったら、#widget-titleのテキストは赤色になる。 これがShadow DOMだと外側からのCSSに影

    Polymer の Shadow DOM Polyfill - Qiita
  • Polymerを実際に使ってみた - Qiita

    <link rel="import" href="bower_components/polymer/polymer.html"> <polymer-element name="x-test"> <template> This is <b>{{owner}}</b>'s name-tag element. </template> <script> Polymer('x-test', { // initialize the element's model ready: function() { this.owner = 'Rafael'; } }); </script> </polymer-element> 公式に乗ってるサンプルほぼそのまんまです。polymer-elementのname属性には、必ず -を含んだ名前 をしているする必要があるので注意です。 後はこれをHTML imports

    Polymerを実際に使ってみた - Qiita
  • PolymerでCustom Elementsは簡単に作れるのか - Qiita

    エモい話はブログに書きました http://nekova.hatenablog.com/entry/2014/07/05/211303 簡単に作るために必要なこと 自分で一から作るより、generatorに作らせた方が早いし便利 [?] What do you want to use? Polymer [?] What's the GitHub repository? your-repo 小さなコンポーネントだと your-repo と your-element は同じになることが多い [?] What's your GitHub username? username [?] What's the name of your element? your-element [?] How would you describe the element? Descriptionは書かないとIssue

    PolymerでCustom Elementsは簡単に作れるのか - Qiita
  • Polymer と Web Components #io14

    Google I/O の数週間前に、Seth Ladd に「今ウェブ開発者が一番学ばなければいけないことは何ですか?」と質問した人がいて、横で聞いてたのですが、彼の回答は Web Components と Polymer でした。 Google I/O でも、Eri...

    Polymer と Web Components #io14
    Jxck
    Jxck 2014/07/01
    今回 WebComponents 多かったんだなぁ。確かに Web を変えていくと思う。あとはエコシステムがどう回るかかなぁ。
  • Web Components を支えるPolyfillライブラリ

    Hello 生成されるJSそのものはピュアな感じなので、たしかにbosonicを捨ててもWeb Componentsとして成り立ちそうではある。 瑣末だが、この記事を書いてる時点で試したらWeb Platform featuresのフラグをEnableにしたCanaryで、bosonic-pollyfillsがエラー吐いてる... 余談、実はえらいかも Polymerコンポーネントって、結局Polymer入れないと使えないなら、BackboneJSで使えないAngularディレクティブみたいなもんな気がしてきた。Bosonicのコンセプト、実は偉いかも。(出来る範囲は制限されるかもしれないけど) — あほむバーガー (@ahomu) June 30, 2014 結論 個人的にはふつうのPolyfillとして動いてくれるものを精査したかったのだけど、結果的に Polymer/platform

    Web Components を支えるPolyfillライブラリ
  • 1