Vue.jsに慣れるまでの勉強法

article-thumbnail

こんにちは、お読みいただきありがとうございます。 ケン(@gootablog)です。

去年くらいから会社の業務でVue.jsを使った開発を担当しています。はじめはJavaScriptも表面的な理解しかなく苦戦していましたが、最近はとくに詰まることなく書けています。

なのでこれからVue.jsを始める方にどんな感じで勉強したほうがいいかを書いていきます。

Vue.jsを勉強し始める前のスキル

使い始める前はPHPを使った開発をメインにやっていました。その際にjQueryは結構使っていましたが、JavaScriptは全然。ペライチのスクリプトをたまに書くくらいでフレームワークとかは使ったことがありませんでした。

なので簡単に言うと、PHPやjQueryでプログラミング自体の下地はありますがJavascriptのしっかりとした文法や構文理解はイマイチって感じです。

その状態で開発が始まり、仕事を進めつつこれから書く感じで理解を深めていきました。

まずはVue.js公式リファレンスを読む

まずは公式リファレンスですね。日本語の翻訳もされているので難なく読むことができます。

Vue.js

一度ですべて理解はできないので、全体像を理解するためにサッと読む、全体像を理解した上で読む、それでもわからないところはじっくり読むって感じで進めました。

公式のリファレンスは今でも調べるときに使っていてある程度書けるようになっても学びが多いです。

簡単なVue.jsの本を読む

公式リファレンスを読んだら、自分のレベルに合う書籍を見つけて買いましょう。

僕はこちらの「基礎から学ぶVue.js」というものを購入しました。これもサクッと全体を読んで、あとは自分がわからないところを重点的に読むようにしました。

コンポーネント間のデータフロー、データの扱い、Vuexのところの理解が浅かったのでその部分を中心にインプットするようにしました。

もっと詳細かつ難易度を上げるなら「Vue.js入門 基礎から実践アプリケーション開発まで」という書籍を買うといいでしょう。

暇なときにいろいろ作る

あとはプライベートな時間で試しにいろいろ作りましょう。Vueのライブラリを試してみたり、UIコンポーネントを試してみたり、買った本の写経してみたり。

いろいろ作ってみると、自分の理解度がわかるのでインプットがやりやすいし、リファレンスや本を見返してこういう使い方もできたのかなどの発見もあるのでおすすめです。

そして作ったものはできるだけパブリックな状態にしておきましょう。VueだけならNetlifyを使えば無料で公開できます。サーバーを使う場合も安いVPS借りれば低コストなので積極的に使ってみましょう。

Tech Vue.js

関連記事