x-business-card's Introduction

エンタープライヤーのためのWeb Components Study

~~Web ComponentsでWeb名刺を作ろう！~~

はじめに

この資料はWeb名刺を作成するハンズオンを通じて、Web標準の「Web Components」学習するための資料です。Polymerの学習ではありませんのでご注意ください。
(なお、資料の内容は2014年9月現在のWeb Componentsの仕様に基づくものです。)

ゴール

Web Componentsの基本を把握し、様々なWeb Componentsのサンプルを見ながら、オリジナルのWeb Componentsを作れるようになるまでをゴールとしています。

前提となるもの

学習を進めるにあたり、ローカルにWebサーバを立てる必要があります、資料の中ではgrunt-contrib-connectを使って簡易Webサーバが起動するようにしてあるため、NodeとGruntの実行環境が必要です。
GitとChromeがインストールされていることを強く推奨します。
Githubアカウントがあると配布がスムーズに行えて尚良です。
フロントエンド開発が初めての方、開発環境構築が面倒な方は、ブラウザ上で簡単にフロントエンド開発ができるCloud9のアカウントを作成して、これを利用してください。

デモ

http://html5bizj.github.io/x-business-card

発表スライド

エンタープライヤーのためのWeb Componentsハンズオン from Mitsuru Ogawa

脚注

文中での 💝 は技術的な細かい内容について書いています。ハンズオンでは取り扱いません。

作者

mitsuruog

後援：html5jエンタープライズ部

x-business-card's People

Contributors

Stargazers

Watchers

x-business-card's Issues

JavaScriptコードがひとまとまりになっていることについて

JavaScriptが一つにまとまっているが、アクティベートするところは分けるべきでは...

定義したWeb Componentsに
・画像を追加する
・イベントを定義する
といったような内容は
<template>
<script>
SomeThing...
</script>
</template>
として定義すべきであるが、アクティベートするロジックは分けるべきではと思います。
また、templateを定義したファイルにアクティベートするロジックを
入れるべきではないと考えます。

如何でしょう？ :-)

html5bizj / x-business-card Goto Github PK