Vue.jsの特徴

#プログラミング勉強日記
2020年9月12日
JSには色々なフレームワークがあって、開発の用途によって使用するフレームワークが違うと思うので、まとめてみようと思う。ReactについてとAngularについてまとめたので、今回はVue.jsについてまとめる。

#Vue.jsとは
　Vue.jsは、UIを構築するためのJavaScriptのフレームワーク。Vue.jsでコードを書くときは、無駄な長い記述を少なくできる。Vue.js独自の規格やルールも少ないので、他のフレームワークよりも自分の好きな方法でアプリ開発を行うこともできる。

#特徴

##コンポーネント指向である
　ReactとAngularと同様で、Vue.jsもコンポーネント指向である。コンポーネント指向は、ソフトウェアを機能ごとに部品(コンポーネント)として分割して、必要に応じて組み合わせて使う考えのことである。
　機能を小さい部品にして持たせているので、状態の管理もしやすくて再利用も容易にできる。再利用性が高くなり、デザインと技術の共同作業を簡単にすることができ、開発スピードの向上ができる。

##学習コストが低い
　様々なフレームワークがあり、開発現場ごとに新しい技術を取得しないといけないことも珍しくないが、その中でもVue.jsは学習コストが低く、初心者や経験者問わずすぐに開発することができるという特徴がある。Vue.jsがシンプルであり、非常に人気が高いので日本語での技術ブログや記事が充実している。

##ディレクティブ
　Vue.jsはDirectiveというView要素に付加できる独自要素がある。ディレクティブを使用することで、DOMを簡単に操作することができ、HTML要素の表示・非表示を柔軟に変化でき、開発スピードを速められる。

##双方向データバインディング
　Vue.jsもデータバインドに特化したフレームワークである。
　アプリでユーザ画面(View)で操作した内容をデータ(Model)の反映、データ(Model)の内容が変わったときに画面(View)に反映する必要がある。なので、Viewを操作するときはModelに反映するために、画面からHTMLの要素を取得して要素をデータとして処理、処理したデータを画面に反映するプログラムを書く必要がある。

##クラスを利用可能
　JSでは使えなかったクラスを利用することができる。Vue.jsでは連想配列の形でクラスを作成して、様々なデータの入れ物として活用することができる。

##TypeScriptも利用可能
　Vue CLIにはJestやMochaを使って簡単に単体テストを行うためのプラグインオプションがある。公式のVue Tesyユーティリティもあり、作成したアプリの動作を検証することができる。

##URLのルーティングができない
　ルーティングとは同じページ上で疑似的なページ遷移すること。
　Vue.jsではURLのルーティングを単体で行うことができる。ルーティングを必要とする場合には管理が複雑になることがあり、単一のページ以外が表示されない扱いになり、アクセス解析やSEO上の不都合が生じることがある。

##古いブラウザには非対応
　Vue.jsを利用して作ったサイトは古いブラウザでは見ることができない。

#参考文献
【Vue.js入門】特徴や他のフレームワークとの比較などを紹介！

Vue.jsとは？特徴とできることを具体例を交えて紹介