Vue.js 入門を読んだ。備忘録のために感想を書いておく。
感想を書いている人の前提
- React, AngularJS, Angular X(4, 6 etc)を開発で使ったことがある
- Angular で SSR (Server Side Rendering) 対応をしたことがある
- webpack 利用経験あり
- Node.js, npm 周りの知識あり
何で読んでみようと思ったか
- 既存の jQuery の塊になっているプロジェクトに Vue.js を導入できるか
- Rails などの既存 MVC フレームワークに導入するときにどうやって導入できるか
- Vue.js の単一コンポーネントという仕組みを使ってどうやってアプリを構築していくのか
- Vue.js を使うときに綺麗に保守していくためのお作法は何か
感想
総ページ数 450 と結構ボリューミーな感じだったけど、説明の書き方がとても平素で分かりやすい。最初は Vue.js を触ってみることに集中して、 npm や webpack 周りの解説が煩雑になりそうな箇所が省かれるようになっていたのが初心者の方でも気軽に触れるようにする気遣いを感じた。
第1章のプログレッシブフレームワークVue.js のところはフロントエンドの経緯から説明されていて、Vue.js 自体の背景までも網羅されているため、Vue.js に関する使い方にすぐに入らないところが好感を持てた。フレームワーク自体の思想や背景は理解する上でかなり重要だと思う。
第2章から第7章までは具体的な使い方に加えて、Vuex や Vue Router の解説がされていて、これらも基本的な使い方が抑えられていて、プログレッシブフレームワークに焦点を当てた解説がされていた。公式ドキュメントから得づらい Vuex の具体的な使い方まで書かれていて、実践的な知識を得られたと思う。slot という概念をここで初めて知った。React で Header コンポーネントをプロジェクトで実装したことあるけど、slot を知らずに汚い書き方をしてしまったのは秘密 ... React にもあるのね。
第8章から具体的な Kanban-app というサンプルアプリを構築していくのだが、開発環境のセットアップ、設計、実装と実際の開発に近い形で紹介されている。Vue.js に特化しすぎず、Atomic Design を取り入れた設計手法の紹介なども行っており、新規プロジェクトを始める際にも大いに参考になりそうな解説が多かった。
開発環境のセットアップのところで、駆け足で E2E テストなどで利用するライブラリの解説が無かったりするが、そこは説明をしていなくてむしろ好感が持てた。ここらへんを解説しようとすると、めっちゃ間延びしそうだし。
Appendix は jQuery からの移行、Nuxt.js など役に立つ Topic が紹介されており、エコシステム全体を俯瞰する意味で大いに参考になった。特に jQuery からの移行の仕方は単純なスニペットを豊富に提示しているため、すぐに活かせる例もあると思う。
最後に
全体的に Vue.js だけに特化した解説ではなく、昨今のフロントエンド事情、開発、実装に関する言及が多分にされていて、これからフロントエンドを始めてみようって人に進めるのもアリだなぁ、と思った。
また、過激な意見と自覚はしているけど、Web Component に一番近い発想なのは Vue.js なのかなぁ、ともこの書籍を読んで考えてしまった。Atomic Design がしっくりハマったしなー。React でもできるんだけど、いかんせん JSX
プログレッシブフレームワークという思想はとても良いし、「小さいところから始める」という点では Vue.js はまさしく得意としているところだろうと思う。Redux で脱落しがちな人でもこの書籍があれば Vuex を使ってわかりやすいステート管理を行えるようになると思う。(まぁ React + Redux の話は何というか盛り上がりすぎて、過度な期待でトバッチリがあった気がするけど ...)
React や Angular ももちろん良いライブラリ(or フレームワーク)だし、それぞれ長所、短所はあるので、諸手を挙げて「Vue.js 万歳」という姿勢も無しっちゃ無しなので、適材適所で採用していくのがいいのかな。
しかしまぁ、Ant Design とか見ててもコンポーネント単位での OSS が vue でも増えているのは、こういった単一コンポーネント思想から来てるんすかねー。確かに自分で実装してみたい、って気力にはなるかも。
