実践
Vue.jsを使いこなす
12
記事執筆時点のバージョンは0.11.4です。最新バージョンVue.js 2.0を元に書かれた「これから始めるVue.js 2.0」シリーズがあります。(2017年3月現在)

Vue.jsのv1.0.0へのアップデート内容を解説します。今回はAPIの変更と、新しく追加された機能を紹介します。また、すでに稼働しているWebアプリなどにおいて、安全にv1.0へ移行する手順についても触れます。

中島 直博
中島 直博 | フロントエンド・エンジニア

2015年の10月にVue.jsのバージョン1.0.0がリリースされました。この記事では大きな変更があったテンプレートの構文に関する変更を解説します。コードがより直感的にわかりやすくなるよう改変が加えられています。

中島 直博
中島 直博 | フロントエンド・エンジニア

シリーズの最終回はVue.jsを使ったアニメーション機能を紹介します。CSSやJavaScriptを用いたアニメーションを登録し、DOMの追加、削除のタイミングで実行することができます。

中島 直博
中島 直博 | フロントエンド・エンジニア

Vue.jsの便利な機能を解説します。今回は、データバインディングで頻出する実装、値の監視方法や、ViewModelへの動的データの定義、データ数や、表示順を変えるフィルタ機能などを紹介します。

中島 直博
中島 直博 | フロントエンド・エンジニア

Vue.jsにはアプリケーション作成を楽にする基本機能のほか、さまざなディレクティブやオプションが用意されています。今回は、デフォルト設定の変更や、サブクラスの作成などを紹介します。

中島 直博
中島 直博 | フロントエンド・エンジニア

今回はViewModel間でイベントを通じて、データをやり取りする方法を解説します。この方法を利用すると、コンポーネントはイベントを伝える役割に専念でき、独立性の高い設計が可能になります。

中島 直博
中島 直博 | フロントエンド・エンジニア

今回はさまざまな機能をコンポーネント化して実装する方法を解説します。まずは、Vue.jsにはいくつかの実装方法がありますが、もっともシンプルで基礎的な方法を紹介します。

中島 直博
中島 直博 | フロントエンド・エンジニア

何かが起こったら、何かをするというVue.jsのイベントハンドリングの実装を紹介します。この記事では、ViewModelのライフサイクルイベント、v-onによるイベントハンドリングの解説をします。

中島 直博
中島 直博 | フロントエンド・エンジニア

この記事ではテンプレート記述の際に役立つ、使用頻度が高いディレクティブの使い方を解説します。似たような機能を持つディレクティブでも、使い分けのポイントがあるので、注意しましょう。

中島 直博
中島 直博 | フロントエンド・エンジニア

Vue.jsのテンプレート機能の使い方を解説します。テンプレートの部品化、配列の要素を繰り返し表示したりすることで、意図通りの描画をし、しかもコードを見通しよく保ちます。

中島 直博
中島 直博 | フロントエンド・エンジニア

Vue.jsの機能のうち、もっとも基本となる機能の利用方法について解説していきます。Vue.jsの使う上で核となるModelとViewを紐付ける役割を持つ、ViewModelの解説を中心にします。

中島 直博
中島 直博 | フロントエンド・エンジニア

双方向データバインディングに特化したVue.jsは、シンプルで学習コストも低いといわれます。第1回目はVue.jsがフレームワークとして、どんな強みをもっているのか、その特徴をコードから概観します。

中島 直博
中島 直博 | フロントエンド・エンジニア