1.はじめに
しばらくVue.jsについて記事をまとめていましたが、「そもそもVue.jsってどのような言語なのか？」についてまとめていなかったので、まとめていきます。
2.Vue.jsとは
JavaScriptをベースにしたフロントエンドフレームワークの1つです。
WebアプリケーションのUI（ユーザーインターフェース（※1））を効率的に構築するために使われます。
※1 画面、見た目や操作感を指すこともある（参考）
●特徴
①リアクティブシステム
→双方向バインディング（データと画面間の情報をリアルタイムで同期させる技術）により、下記画像のようにデータの変更が即座に画面に反映される仕組みを簡単に構築できます。
// 即座に反映したいデータをv-modelで定義するだけで実装可能
<v-text-field v-model="login_id"></v-text-field>
入力した文字は{{ login_id }}
（vuetifyを使用しています。）
// javascript側でも値を変更した場合、画面側にもその変更がリアルタイムで反映される
<v-text-field v-model="login_id"></v-text-field>
入力した文字は{{ reactive_login_id }}
<script>
（中略）
computed:{
reactive_login_id() {
return this.login_id + "change";
}
},
（中略）
</script>
②軽量で読み込みが早い
コンポーネント（部品）ごとに管理しており、画面の変更があった際に変更があったコンポーネントのみを再描画（読み込み）しているため、読み込みが早いとされています。
下記画像のようにボタンの色を変えた場合に、画面A全体を再読み込みするのではなく色が変わった部分のみ再読み込みを行っています。
③シンプルで学習しやすい
→標準的な HTML、CSS、JavaScript をもとに構成されているため、追加で覚えることが少なく、学習コストが低いと言われています。（次回以降に解説していきます。）
3.Vue.jsが向いているサービス
1. 中小規模のWebアプリケーション
Vueは軽量でシンプルであるため、中小規模のWebアプリケーションの開発に向いているとされています。
反対に、シンプルな開発を得意としているため、大規模な開発には向かないと言われています。
2. インタラクティブなWebサイト（動きの多いページ）
VueはリアクティブなUIが得意なので、ボタンを押したらすぐに表示が変わるようなWebサイトに向いています。
3. シングルページアプリケーション（SPA）
Vueは Vue Routerというライブラリを使うことで、ページの切り替えを素早く行う SPA（Single Page Application（※2）） を簡単に作れます。
※2 1つのページでコンテンツの切り替えを行う（画面遷移を行わない）Web アプリケーションの構造。例：Slackやnote
4.環境構築の方法（Windows）
色々やり方はありますが、私は下記で環境構築を行いました。
①参考コンフルを基にNode.js（npm）をインストール
②@vue/cliをnpmでインストール
npm install -g @vue/cli
③vueプロジェクトを作成
vue create プロジェクト名
④環境構築編を基に必要なライブラリをnpmでインストール&設定
⑤SpringBootを使っていたため、設定ファイルやbuildの設定を変更（参考コンフルのvueの設定変更 & build）
5.さいごに
次回からはVue.jsの基本的な書き方などをしばらくはまとめていきます。
ご興味ある方は次回以降も見ていただけますと幸いです。
参考資料
①双方向バインディングとは？初心者にもわかる基本解説！共起語・同意語も併せて解説！
②UIとは
③Vue.jsとはなにかを初心者向けに解説！どのような開発者におすすめのフレームワーク？
④SPA（シングルページアプリケーション）とは？開発事例やメリットデメリット
⑤【Vue.js】10分でできる！ ～ Vue.jsのインストール → プロジェクト作成と起動まで～
⑥SpringBoot上でVueを動かしてみた