Vue.jsはJavaScriptに活用されるオープンソースのオブジェクト指向Webアプリケーションフレームワークです。シンプルで自由度が高いことから現在人気急上昇中のフレームワークとして注目を集めております。この記事ではVue.jsを理解するために初心者でも分かる歴史、メリット、基礎知識などを簡単に解説していきます。
Vue.jsとはJavaScriptに活用されるエヴァン・ユー(Evan You)氏によって開発されたオープンソースのオブジェクト指向Webアプリケーションフレームワークです。2014年2月に誕生し、GoogleにてAngularJSを使用した開発に携わっていたエヴァン・ユー氏がAngularJSをモデルに本当に好きな部分だけを抽出してVue.jsの作成を行ったという経緯があります。特徴として、スクリプトタグを一行書くのみで使い始めることが出来る手軽さやAngularJSと比較して規模が小さい分学習コストが低いなどが挙げられます。
JavaScriptとはネットスケープコミュニケーションズ社によって1995年に誕生したプログラミング言語の一種でその中でもオブジェクト指向スクリプト言語に区分されます。主な目的として動的な機能をWebページに生成するためのプログラミング言語として開発されました。Webサイト、Webアプリ、ゲームなど様々な用途に活用できるため注目を集めております。名称にJavaが含まれるためJavaの仲間と誤解を生むこともありますがJavaScriptは全く異なるプログラム言語です。開発当時サン・マイクロシステムズ社が開発したプログラミング言語『Java』が大きな注目を集めていたことや同社との業務提携を行った背景もありJavaにちなんだ名称が付けられました。
JavaScriptのメリット・基礎知識について解説された記事はこちら>>
『JavaScriptにおけるシステム開発を簡単に行えるように用意された枠組みのこと』
JavaScriptフレームワークとはJavaScriptにおけるシステム開発のプログラミングを効率的に実施するために汎用的な機能群をまとめ、システムの骨組みとなるテンプレートまで用意してくれる枠組みのことです。フレームワークを活用することでプログラミングにおける記述コードを最小限に抑えることが出来ます。JavaScriptフレームワークの代表的な種類としてjQuery、AngularJS、Vue.jsなどが挙げられます。
JavaScriptフレームワーク人気どころ6選ついて解説された記事はこちら>>
Vue.jsの読み方は『ビュージェイエス』です。発音は「 / v j u ː /」( view と同様)であると公式サイトにて紹介されております。エンジニア界隈では略称して「Vue(ビュー)」と呼ばれることが多いようです。名前の由来については公表されておりませんでした。
Vue.jsはエヴァン・ヨー(Evan You)氏によって開発され2014年にユーザーインターフェイスを構築するための、オープンソースJavaScriptフレームワークとしてリリースされました。エヴァン・ヨー氏は元々エンジニアとしてGoogle社でAngularJSを使用しており「Angularの本当に好きだった部分を抽出して、余分な概念なしに本当に軽いものを作ることができたらどうだろうか?」と考えていたことがVue.jsの開発に繋がったきっかけだそうです。
Vue.jsのメリットを見ていきましょう。
Vue.jsは開発を効率的に実施できるというメリットがあります。これはDirective(ディレクティブ)という、Viewの要素に付加できる独自属性が用意されているためです。Directiveを使用することでDOM (Document Object Model)操作をすることができ、HTML要素の表示・非表示などを柔軟に選択することができます。このようにVue.jsはHTML側の要素とJavaScript側の値やイベントとの対応付を自動で行うことができます。よってjQueryよりも簡潔に分かりやすくコードを記述することができます。
Vue.jsはデータバインド(データと描画を同期する仕組み)を持っているというメリットがあります。Vue.jsはデータバインドに特化しているためデータの変更があればUIの表示を更新し、UIの変更があればデータの更新を行うように自動化されます。このように双方向にデータバインドを行う行為を双方向データバインディングと呼びます。
Vue.jsは学習コストが低いというメリットがあります。他のフレームワークに比べても独自のルールが少ないという点やフレームワーク自体の規模が小さいため覚えることも必要最低限で済みます。jQueryと似ている部分も多いため、jQueryの使用を理解している方はスムーズにVue.jsを習得できるでしょう。
Vue.js以外のJavaScriptによるシステム開発に用いられる代表的なフレームワークを紹介させていただきます。
jQueryとはJavaScriptに活用されるジョン・レシグ(John Resig)氏によって開発されたクライアントサイドスクリプトを簡易化するためのライブラリです。2006年8月に誕生し、基本理念を『write less, do more(少ない記述で、もっと多くのことをする)』を掲げております。特徴として非常に簡単でかつ少ない記述でHTMLとCSSを操作することができます。またjQueryを利用する世界中の方々が様々なプラグインの作成を行っていることから拡張性が高いことも特徴として挙げられます。jQueryはJavaScirptの発展に大きく影響を与えたライブラリと言えるでしょう。
AngularJSとはJavaScriptに活用されるGoogle社によって開発されたオープンソースWebアプリケーションフレームワークです。2009年に誕生し、ミシュコ・へブリー(
Mishko Hebley)氏とアダム・アブロンズ(Adam Ablons)氏が主軸となって開発がなされました。特徴としてフルスタックなフレームワークと呼び声が高く、AngularJSが用意する機能を全て使いこなすことができればその他の技術は不要と言えるほど多機能で充実しております。AngularJSとAngularJS2が存在し、AngularJS2についてはGoogle社とマイクロソフト社の協力の下で作成されました。
React.jsとはJavaScriptに活用されるジョーダン・ウォーク(Jordan Walk)氏によって開発されたオープンソースWebアプリケーションフレームワークです。2011年にFacebook社のプログラマンーであるジョーダン・ウォーク氏が同社のサービスであるFacebookにて使用し、2013年にオープンソース化されました。特徴としてUI/UXを意識した開発に向いていることやAndroidとiOSの両プラットフォームに対応していることなどが挙げられます。またReact.jsは数々の有名なサービスにて採用されております。代表的なものとしてFacebook、Instagram、Yahooなどが挙げられます。
Vue.jsを理解するために初心者でも分かる歴史、特徴、基礎知識などを簡単に解説させていただきました。Vue.jsを一言で表すと『Angularの良い部分だけを抽出した人気急上昇中んフレームワーク』です。Vue.jsには「開発を効率的に実施できる」「データバインドに特化している」「学習コストが低い」というメリットが挙げられます。Vue.jsについてこの記事に記載されている最低限の内容は理解をしておくようにしましょう。