【Books】「プロフェッショナルWebプログラミング　Vue.js」を読みました

あけましておめでとうございます。
年末年始休暇に入る前はいろいろと予定を立てていたのですが、気がつけば目標のほとんどを達成することなく仕事初めとなってしまいました（例年のことですが）

それはさておき、「プロフェッショナルWebプログラミング　Vue.js」を購入しました。
お恥ずかしながら技術書を買うのはとても久しぶりです。

Ｖｕｅ．ｊｓプロフェッショナルＷｅｂプログラミング /エムディエヌコ-ポレ-ション/山田典明

技術書を読むよりもググることが多くなった昨今ですが、本書は読みやすく分かりやすい内容となっていました。
ちなみに私のスキルレベルはjQueryを使えば多少Javascriptを書くことができ、1年半ほど見様見真似でVueを使っているという感じです。

ADs

本書の構成

下記の構成となっています。

■PART1　Vue.jsの基本を学ぶ
◯CHAPTER1　Vue.jsとは？
◯CHAPTER2　ToDoアプリで基本を学ぶ(1)　Vue.jsの第一歩
◯CHAPTER3　ToDoアプリで基本を学ぶ(2)　v-modelでフォームの使い勝手を向上
◯CHAPTER4　ToDoアプリで基本を学ぶ(3)　フォームの操作
◯CHAPTER5　ToDoアプリで基本を学ぶ(4)　コンポーネント

■PART2　Vue.jsをWebサイトに組み込む
◯CHAPTER1　WebサイトでのVue.jsの使いどころ
◯CHAPTER2　モーダルを作ってみよう
◯CHAPTER3　カルーセルを作ってみよう
◯CHAPTER4　アコーディオンを作ってみよう
◯CHAPTER5　商品一覧表示&検索を作ってみよう
◯CHAPTER6　クイズを作ってみよう

■PART3　Jamstackで静的サイトを作る
◯CHAPTER1　Nuxt.jsの準備をする
◯CHAPTER2　Nuxt.jsで静的なページを作る
◯CHAPTER3　部分的にCMS化する
◯CHAPTER4　Netlifyへデプロイする

※目次の抜粋です。
MdN社の紹介ページより

PART1ではv-modelやイベントのバインド、computedやwatchなどの関数の説明など、基本的な使い方の解説です。
PART2ではモーダルやカルーセルといった一般的なWebサイトで使われるコンポーネントの作成方法。
PART3では一般的なWebサイトでの組み込み方や静的出力の解説となっています。

PART1はVueの基本中の基本と言ってもいい非常に平易な内容となっているので、普段HTMLとCSSによるWebサイト制作がメインでjQueryをちょっとだけ使うことがあるという程度の方でも十分読める内容です。
PART2～3では実際の業務で作ることがありそうなコンポーネントやサイトの作成手法の解説となりますので、実務への応用もしやすいのではないかと思います。

良かった点

Vueは非常に使いやすく気に入っているのですが、たとえば中小企業のコーポレートサイトや飲食店の紹介サイトなど、閲覧者からのデータ送信がないサイトでは使うところがないだろうと思っていました。実際に私もWebアプリケーションならともかく、ランディングページや通常のサイト制作ではVueを使うことはありません。
ですがPART2の内容にあるような、一般的なWebサイトで使われるようなコンポーネントでの使用やPART3で解説されている静的出力など、一般的なWebサイトでも使えそうな手法が非常に参考になりました。
いきなり通常のWebサイト制作業務にVueを導入するのは現実問題として難しいのですが、機会があれば提案してみたいと思います。

また、各章の構成が「○○をつくるために必要な要素は□□で仕様は△△」となっている点も実践的だと思いました。
仕様があやふやなままでコードを書き始めて痛い目に合う…よくあることですからね。

※154pより

この本が向いていると思う人

WebアプリケーションではなくWebサイト制作に主眼を置いた内容となっていますので、「HTML/CSS/JS（というかjQuery）でサイト制作をやっているけどVueを自分の仕事でも使えるのだろうかと思っているような人」には向いているのではないかと思います。多分書名の「プロフェッショナル」は「Webサイト制作を仕事としてやってる人」という意味でしょう（違ったらすみません）

逆に、会員制SNSやなんとかジェネレータのようなWebアプリケーション的なものをつくりたい場合、本書ではVuexやVue-Routerについては触れられてないので物足りなく感じるかもしれません。そういう方には猫本のほうがいいと思います。