【2020年版】Vue.js入門者必見!オススメのVue.js参考書・本・書籍まとめ。超初心者から上級者まで

この記事では、「Vue.js」を勉強するための参考書をご紹介します。

「Vue.js 参考書」で検索時の上位10位の意見も取り入れながら、最終的にたどり着いた参考書をご紹介します。

Vue.jsとは?需要は?

Vue.jsは、JavaScriptフレームワークです。最近かなりVue.jsという単語を聞くようになって来ました。
おそらくこれから間違いなく主流になるフレームワークです。
需要もどんどん高まっています。Vue.jsの月単価は、60万~100万と、他の言語、フレームワークに比べるとかなり高い方です。
今回は、そんなVue.jsをしっかりと学べる参考書をご紹介していきます。

前提知識は?

Vue.jsは、JavaScriptのフレームワークです。そのため、JavaScriptをある程度理解している方でなければいけません。
JavaScriptを理解するには、HTML、CSSの知識が前提知識となるので、
Vue.jsを学ぶ上で必要な前提知識は、JavaScript、HTML、CSSです。

JavaScriptのオススメの参考書

【2020年版】JavaScript入門者必見!オススメのJavaScript参考書・本・書籍まとめ。超初心者から上級者まで

自分に合った参考書までスキップ

 初心者
 中級者
 上級者

初心者にオススメのVue.jsの参考書3選

初心者とりあえず、この参考書一択!

Vue.jsの
ツボとコツが
ゼッタイにわかる本

Vue.jsのツボとコツがゼッタイにわかる本


この参考書について

どんな参考書?

本書は、初めてVue.jsを学習する方に向けて、とてもわかりやすい解説された参考書です。Amazonでもかなりの高評価で、たくさんの方が解説がわかりやすかったと言っています。なので、初心者はこの参考書一択ではないでしょうか。
前提知識のHTML、CSS、JavaScriptは、最低限分かっているだけでも、十分ついていける内容になっています。
内容は、簡単なECサイトの構築を作りながら、商品一覧の表示・取得やソートなどが学べる内容になっています。HTMLとJavaScriptで作成したプログラムで一旦解説し、Vue.jsを取り入れると、どのような実装になるのか、という流れで解説しているので、Vue.jsの魅力がより伝わってきます。

どんな人におすすめ?

  • Vue.js入門者
  • HTML、CSS、JavaScriptの知識が最低限しかない方
  • ES5の構文の方が言い方

何を学べる?

Vue.jsのツボを的確に押さえているので、初心者の方でもつまずかずに学ぶことができます。

評価

難易度
(2.0)
わかりやすさ
(5.0)
オススメ度
(5.0)
Amazon評価
(4.5)

目次

第1章 Vue.jsとフレームワークの基礎
第2章 Vue.jsをはじめよう!
第3章 Vue.jsで商品一覧を描画してみよう!
第4章 Ajaxで商品データを外部ファイルから読み込もう!
第5章 Vue.jsで自動見積フォームを作ってみよう!
第6章 Vue.jsのコンポーネントをモジュール化してみよう!

詳細を見る

Amazonで安く買う方法

 

実務的なVue.jsを学びたい方

これからはじめる
Vue.js
実践入門


この参考書について

どんな参考書?

本書は、豊富なサンプルコードで試しながら理解できる参考書です。
前提知識として、JavaScriptの基本的なことを理解していないと、ついていくのが少し厳しいかなと思います。
実務で使うための必要な基礎知識をしっかりと学べる参考書ですので、これから仕事などでVue.jsを使う方にオススメの参考書です。
内容は、ダウンロードしたサンプルファイルを実行しながら、簡単なアプリを作成していくという内容です。とてもサクサク進むので、他の参考書でつまずいた方も安心して読む進められrます。

どんな人におすすめ?

  • 他の参考書で挫折した方
  • JavaScriptの基本は押さえている方
  • これから会社でVue.jsを使う方

何を学べる?

Vue.jsの概要から、ディレクティブ、コンポーネントからテストまでとても幅広く学べます。

評価

難易度
(3.0)
わかりやすさ
(4.0)
オススメ度
(5.0)
Amazon評価
(4.5)

目次

Chapter1 イントロダクション
1-1 JavaScriptの歴史
1-2 jQueryからJavaScriptフレームワークへ
1-3 主なJavaScriptフレームワークとVue.js
Chapter2 Vue.jsの基本
2-1 Vue.jsを利用するための準備
2-2 Vue.js理解のための3つの柱
2-3 リアクティブデータ
Chapter3 ディレクティブ
3-1 イベント関連のディレクティブ
3-2 フォーム関連のディレクティブ
3-3 制御関連のディレクティブ
3-4 データバインディング関連のディレクティブ
3-5 より高度なイベント処理
Chapter4 コンポーネント(基本)
4-1 コンポーネントの基本
4-2 コンポーネント間の通信
4-3 コンポーネント配下のコンテンツをテンプレートに反映させる ~ スロット
Chapter5 コンポーネント(応用)
5-1 動的コンポーネント
5-2 v-modelによる双方向データバインディング
5-3 アニメーション機能
5-4 コンポーネントのその他の話題
Chapter6 部品化技術
6-1 ディレクティブの自作
6-2 フィルターの自作
6-3 プラグインの利用と自作
6-4 ミックスイン
Chapter7 Vue CLI
7-1 Vue CLIの基本
7-2 単一ファイルコンポーネント
7-3 TypeScript
Chapter8 ルーティング
8-1 ルーティングとは?
8-2 ルーティングの基本
8-3 ルーター経由で情報を渡す手法
8-4 マルチビュー、入れ子のビュー、ガードなど
Chapter9 Vuex
9-1 Vuexとは?
9-2 Vuexの基本
9-3 Vuexストアを構成する要素
9-4 巨大なストアを分割管理する ~ モジュール
Chapter10 テスト
10-1 単体テスト
10-2 E2Eテスト
Chapter11 応用アプリ
11-1 アプリの構造を概観する
11-2 アプリの共通機能を読み解く
11-3 アプリの実装を理解する

詳細を見る

Amazonで安く買う方法

 

時間をかけてしっかりと学びたいなら

基礎から学ぶ
Vue.js

基礎から学ぶ Vue.js


この参考書について

どんな参考書?

本書は、Vue.jsの参考書の中でかなり売れている方なのですが、評価が3とやや低いです。
その理由は、序盤から専門用語を使っているので、初心者が読み進められないからです。序盤で出て来た専門用語は、本書内で必ず解説しています。
そのため、本書は2周目が必須の参考書と言えるでしょう。
内容はとても網羅的に解説されています。しっかりと時間かけてVue.jsを学びたいという方には、最適な参考書です。

どんな人におすすめ?

  • しっかりと時間かけてVue.jsを学びたい方
  • 網羅的に勉強したい方

何を学べる?

Vue.jsとは?というところから、網羅的にしっかりと学べます。

評価

難易度
(3.0)
わかりやすさ
(4.0)
オススメ度
(3.0)
Amazon評価
(3.0)

目次

CHAPTER 1 Vue.jsとフレームワークの基礎知識
CHAPTER 2 データの登録と更新
CHAPTER 3 イベントとフォーム入力の受け取り
CHAPTER 4 データの監視と加工
CHAPTER 5 コンポーネントでUI部品を作る
CHAPTER 6 トランジションとアニメーション
CHAPTER 7 より大規模なアプリケーション開発
CHAPTER 8 Vuexでアプリケーションの状態を管理する
CHAPTER 9 Vue RouterでSPAを構築する

詳細を見る

Amazonで安く買う方法

 

中級者にオススメのVue.jsの参考書3選

入門後は、この参考書一択!

Vue.js入門
基礎から実践アプリケーション開発まで

Vue.js入門 基礎から実践アプリケーション開発まで


この参考書について

どんな参考書?

本書は、Vue.jsで開発する方なら、持っておきたい一冊です。
先ほど初心者に紹介した参考書では、基本は学べても、なかなか実際の業務に生かせない参考書ばかりでした。
しかし、この参考書は、とても実務的で、中規模のアプリケーション開発を想定して開発をしていきます。
そのため、実際の用件に求められる環境構築やコンポーネント設計、デバッグまで学ぶことができます。

どんな人におすすめ?

  • 基本的なVue.jsは知っている方
  • 実際にアプリケーションを作りながら勉強したい方

何を学べる?

かなり実務的で、Vue.jsの基本的なところから、実務で使うようなテストまで学べます。

評価

難易度
(3.0)
わかりやすさ
(4.0)
オススメ度
(5.0)
Amazon評価
(4.0)

目次

1. プログレッシブフレームワークVue.js
1.1 現代のWebフロントエンド開発の複雑化
1.2 Vue.jsの特徴
1.3 Vue.jsの設計思想
1.4 プログレッシブフレームワークの解決する段階的な領域
1.5 Vue.jsを支える技術
1.6 Vue.jsのエコシステム
1.7 Vue.jsのはじめの一歩
2. Vue.jsの基本
2.1 Vue.jsでUIを構築する際の考え方
2.2 Vue.jsの導入
2.3 Vueオブジェクト
2.4 Vueインスタンスのマウント
2.5 UIのデータ定義 (data)
2.6 テンプレート構文
2.7 フィルタ(filters)
2.8 算出プロパティ(computed)
2.9 ディレクティブ
2.10 ライフサイクルフック
2.11 メソッド(methods)
3. コンポーネントの基礎
3.2 Vueコンポーネントの定義
3.3 コンポーネント間の通信
3.4 コンポーネントの設計
4. Vue Routerを活用したアプリケーション開発
4.1 Vue Routerによるシングルページアプリケーション
4.2 ルーティングの基礎
4.3 実践的なルーティングのための機能
4.4 サンプルアプリケーションの実装
4.5 Vue Routerの高度な機能
5. Vue.jsの高度な機能
5.1 トランジションアニメーション
5.2 スロット
5.3 カスタムディレクティブ
5.4 描画関数
5.5 ミックスイン
6. 単一ファイルコンポーネントによる開発
6.1 ツールのインストール
6.2 単一ファイルコンポーネントとは
6.3 単一ファイルコンポーネントの仕様
6.4 単一ファイルコンポーネントのビルド
6.5 単一ファイルコンポーネントの動作を体験する
6.6 単一ファイルコンポーネントの機能
7. Vuexによるデータフローの設計・状態管理
7.1 複雑な状態管理
7.2 データフローの設計
7.3 Vuexによる状態管理
7.4 Vuexのコンセプト
7.5 タスク管理アプリケーションの状態管理
7.6 ストアのモジュール分割
7.7 VuexストアとVueコンポーネント間の通信
8. 中規模・大規模向けのアプリケーション開発1 開発環境のセットアップ
8.1 Vue.jsのプロジェクト構築の特徴
8.2 本章で作成するアプリケーション
8.3 アプリケーションの開発環境構築
8.4 Vue CLIによる開発環境の構築
8.5 アプリケーションのビルド
8.6 テスト環境
8.7 フロントエンド・バックエンド連携
8.8 さらなる開発環境の強化
9. 中規模・大規模向けのアプリケーション開発2 設計
9.1 コンポーネント設計
9.2 単一ファイルコンポーネント化
9.3 状態モデリングとデータフローの設計
9.4 ルーティング設計
10. 中規模・大規模向けのアプリケーション開発3 実装
10.1 開発方針の整理
10.2 コンポーネントの実装
10.3 データフローの実装
10.4 ルーティングの実装
10.5 開発サーバーとデバッグ
10.6 E2Eテスト
10.7 アプリケーションのエラーハンドリング
10.8 ビルドとデプロイ
10.9 パフォーマンス測定・改善

詳細を見る

Amazonで安く買う方法

 

Firebaseにも興味のある方なら

改訂新版
Vue.jsとFirebaseで
作るミニWebサービス

改訂新版 Vue.jsとFirebaseで作るミニWebサービス (技術の泉シリーズ(NextPublishing))


この参考書について

どんな参考書?

Firebaseと合わせて勉強できる参考書です。
内容は、簡単なアプリケーションを作りながら、解説していくのですが、途中、バージョンがやや古いため、手順通り行ってもその通りに動きません。
ある程度理解できている方なら、このバグを解消できるのですが、初心者のかたは、スルーするしかなさそうです。
ただ、Firebaseも使ってみたい方にはとてもいい参考書です。
ちなみにkindleunlimitedなら、無料で読めます!

どんな人におすすめ?

  • Firebaseに興味がある方
  • 簡単なアプリを作ってみたい方

何を学べる?

FirebaseでのVue.jsを使ったアプリケーションの作り方が学べます。

評価

難易度
(4.0)
わかりやすさ
(4.0)
オススメ度
(3.0)
Amazon評価
(3.0)

目次

第1章 はじめに
1.1 この本の目的・ターゲット
1.2 本書であまり触れない部分
1.3 本書の構成と対応環境について 他
第2章 サーバーレスシングルページアプリケーションの基本
2.1 SPAとフレームワーク(Vue.jsの紹介)
2.2 サーバーレスってなに?
2.3 Firebaseは何ができる?
2.4 そのままの構成で本格的なWebサービスで使える?
第3章 開発環境のセットアップとデプロイまでの流れ
3.1 vue-templesのダウンロードとセットアップ
3.2 SFCでのコンポーネントの内容について
3.3 Firebaseのセットアップとデプロイ
第4章 Googleアカウントでのユーザー登録と、ログイン状態の判別
4.1 componentsを作成し表示する
4.2 Firebaseでログインの設定
4.3 Googleログインの実装 他
第5章 エディターの作成:データベース作成とデータ保存
5.1 メモを編集できるマークダウンエディターを作る
5.2 メモを複数作成可能にする
5.3 メモの削除機能追加
5.4 Firebase Realtime DBのruleを設定する 他
第6章 見た目を整える
6.1 リセットCSSを導入する
6.2 CSSファイルの管理
6.3 プレビュー用CSSの追加 他

詳細を見る

Amazonで安く買う方法

 

プロゲラミング中級者でVue.jsを学びたいなら

速習
Vue.js
速習シリーズ

速習Vue.js 速習シリーズ Kindle版


この参考書について

どんな参考書?

本書は、Vue.jsの中級者向けではなく、プログラミング中級者が、Vue.jsをさくっと学ぶための本です。
プログラミング初心者が読めば、全くわからない参考書ですが、逆にプログラミング中級者が読めば、他の入門書を読むより圧倒的に効率よくVue.jsを学べます。
内容は、全体像の理解から、実装までをかなりわかりやすく解説されています。
ちなみにkindleunlimitedなら、無料で読めます!

どんな人におすすめ?

  • プログラミング中級者の方
  • さくっと学びたい方

何を学べる?

プログラミング中級者以上の方が、さくっと効率よくVue.jsの基本・概念が学べます。

評価

難易度
(4.0)
わかりやすさ
(4.0)
オススメ度
(4.0)
Amazon評価
(4.0)

目次

Part 1:イントロダクション
Part 2:Vue.jsの基本
Part 3:イベント処理
Part 4:フォーム開発
Part 5:条件分岐とループ
Part 6:もっとデータバインディング
Part 7:コンポーネント
Part 8:ディレクティブ/フィルター/プラグイン
Part 9:コマンドラインツールvue-cli
Part 10:ルーティング

詳細を見る

Amazonで安く買う方法

 

上級者にオススメのVue.jsの参考書2選

英語ですが、、、、

Vue.js
Up and Running

上級者にオススメのVue.jsの参考書2選


この参考書について

どんな参考書?

上級者は、オライリーで足りない知識をつけるのですが、Vue.jsはまだオライリーの日本語訳が出ていません
そのため、さらっとオススメしておきます。
英語に抵抗がない方ならいいのですが。。。

どんな人におすすめ?

  • 上級者の方
  • 英語に抵抗のない方

何を学べる?

Vue.jsを網羅的に完璧に学べます。

評価

難易度
(5.0)
わかりやすさ
(4.0)
オススメ度
(2.0)
Amazon評価
(3.5)

目次

Learn Vue.js basics, including its use of templates to display data on a page
Set up Vue projects from scratch, or use vue-cli to set up from a template
Create a maintainable codebase by splitting code into self-contained components
Discover how Vue.js works with CSS to style your websites and applications
Use render functions and JSX, rather than templates, to determine what Vue displays
Control how code is executed and displayed with vue-router
Manage state in one centralized place with the Vuex library
Write unit tests to ensure your Vue components don’t break in the future

詳細を見る

Amazonで安く買う方法

 

Amazonでお得に買う方法

Amazonの賢い買い方をご紹介します。

Amazonのギフト券で買うと商品を安く買えます。現金でチャージした金額 x 最大2.5%分のポイントがもらえます。

一回のチャージ額 通常会員 プライム会員
5000〜19,999円 0.5% 1.0%
20,000円〜39,999円 1.0% 1.5%
40,000円〜89,999円 1.5% 2.0%
90,000円〜 2.0% 2.5%

Amazonプライム会員の方だったら、使わなきゃ損ですね。

Amazonプライムなら、kindleで無料で読める参考書も結構あります!

今なら、Amazonチャージ初回購入で1000ポイントもらえるキャンペーンもあります。

 

簡単登録!

Amazonチャージ初回購入で、1000ポイントキャンペーンはこちら

まとめ

初心者なら

中級者なら

上級者なら

コメントを残す