Vue.js の特徴の一つとして、実装箇所的に段階的に導入できる、技術レベル的に段階的に導入できるというものがある。

導入順路memo

• CDN から Vue.js を読み込むように HTML に書く
• HTML にターゲットとなる要素(以下 el要素)を設置
• HTML body 最後端に Vue オブジェクト生成 js コード(以下 new Vue)を書く
• new Vue にel要素をelに設定
• new Vue を別ファイル化して HTML から読み込む DOM 構築完了イベントにフック
• new Vue に data を設定
• el要素内に Vue のプレースホルダを埋め込んで data とバインディング
• el要素内に制御用属性を書き込んでコントロール
• 適宜 filter, computed, method 等を作りバインディングする。
• CDN から Vue.js を読み込むように HTML に書く