ykhrss / fw-practice01

fw-practice01

自身のGithubアカウントにForkしてトライしてください

practice01 01

practice0101 のようなブランチを切って練習を開始してください

編集対象ファイル

• src/js/common/script01.js

プレビューファイル

• src/s01.html

作業内容

上記編集対象ファイルを編集し

<button>alert ： jquery</button>

のclickにより
button要素内のテキストnodeである「alert ： jquery」を
alert出力するJavaScriptサンプルを作成してください

コードはjQuery機能に依存してかまいません

ただ漫然と書くと3行以内で書けてしまうコードですが、
大規模プロジェクトの1パーツを作成するような意識をもって
何らかの構造化を目指して作成してください

わかりにくい場合は
レビューを通して徐々に作り上げていきましょう

practice01 02

practice0102 のようなブランチを切って練習を開始してください

編集対象ファイル

• src/js/common/script02.js

プレビューファイル

• src/s02.html

作業内容

上記編集対象ファイルを編集し

<button>alert ： native js</button>

のclickにより
button要素内のテキストnodeである「alert ： native js」を
alert出力するJavaScriptサンプルを作成してください

jQueryの機能に依存しないサンプルソースを作成しましょう

practice01 03

practice0103 のようなブランチを切って練習を開始してください

編集対象ファイル

• src/js/common/script03.js

プレビューファイル

• src/s03.html

作業内容

上記編集対象ファイルを編集し

<button>alert ： es2015</button>

のclickにより
button要素内のテキストnodeである「alert ： es2015」を
alert出力するJavaScriptサンプルを作成してください

es2015の構文に従って作成してください
practice01 02のコードを利用する場合、
es2015の構文に置き換えられる箇所をなるべく多く見つけて書き換えましょう

practice01 04

practice01 04にはコードを書く作業はありません
ソースコードを確認してそれぞれの違いを確認してください

プレビューファイル

• src/s04.html

確認対象ファイル

• src/js/common/script04.js

確認内容

practice01 03までと同様の動作を、
いろいろなJavaScriptフレームワークによって作成したサンプルを用意しました。
practice01 03までとのソースコードの差異をよく確認してください。

practice02の予告

practice02では、practice01を参考にして
feed list実装などを題材に
実際に各フレームワークごとのJavaScriptサンプルコードを書いてみましょう