はじめに
ツール開発をするためにvue.jsを学んでいるので、自分が学習したことを備忘録として残していきたいと思います。
私の現状のスキルはhtml、css、JavaScriptは超超初心者で、実務経験もほとんどありません。
私みたいな超超初心者の方でも理解しやすいようにまとめたので、参考になれば嬉しいです。
Vue.jsって何？
Vue.jsとは、UI開発のためのJavaScriptのフレームワークです。
フレームワークとは、アプリケーション開発に必要なものをまとめたものです。
何もない状態からアプリケーションを開発するとなると、本来作らなければいけない機能がたくさんあるなか、フレームワークを使えばそれらをつくる必要がありません。
また、一定のルールや仕組みがすでにあるので、
- エンジニアの間でコードをの書き方を統一できて理解しやすくなる
- 開発がスムーズに進んでコスト削減につながる
というようなメリットがあります。
Vue.jsの特徴
リアクティブなデータバインディング
リアクティブなデータバインディングとは、データの変更を保存すると自動で画面にも反映されることです。
htmlやcssを書くときにはデータを変更した後に保存し、画面を更新しないと変更箇所を確認できませんでした。
しかしこれによってデータの変更をした後に保存するだけで自動で画面に反映されるため、手動で画面を更新したりすることなく、画面で変更箇所を確認することができます。
コンポーネントベースの開発
コンポーネントとは、再利用な可能な独立した部品のことです。
例えば、ボタンのコンポーネントを作成すると、そのボタンを表示させたい部分に1行コードを書くだけでボタンを表示することができるようになります。
コンポーネントをうまく利用することができれば、
- コードの量を減らすことができる
- 作成したコンポーネントを変更するだけで、そのコンポーネントを使用してる部分を一気に変更できる
というメリットがあります。
シンプルで学習コストが低い
Vue.jsはJavaScriptの基本的な知識と少しの追加構文を学ぶだけで開発が進められるため、学習コストが比較的低いと言われています。
私はJavaScriptの基本的な知識も怪しいですが、、、
Vue.jsを進めながらの理解を深めていけば良いと助言をいただいたので、Vue.jsの学習を進めながらJavaScriptの理解を深めていきたいと思います。
拡張機能が豊富で柔軟な開発ができる
Vue.jsはさまざまなライブラリやプラグインが利用できるので、さまざまなニーズに合わせて開発を進めることができます。
まとめ
Vue.jsはJavaScriptのフレームワークであり、
- リアクティブなデータバインディング
- コンポーネントベースの開発
- シンプルで学習コストが低い
- 拡張機能が豊富で柔軟な開発ができる
という特徴がありました。
明日からは実際に手を動かして小規模なものを作りながら、コードの書き方やコンポーネントの使い方など、Vue.jsについて理解を深めていきたいと思います。
参考にした記事
Vue.js公式
アプリケーションフレームワークを徹底解説｜おすすめのフレームワーク9選も紹介
Vue.jsとは？特徴や利用するメリットなどをわかりやすく解説