後悔しないためのVueコンポーネント設計

関連サイト

本書の関連ページが用意されています。

• NextPublishingオフィシャルWebサイト

内容紹介

本書はVue.jsを利用してシングルページアプリケーションの作成を考えているエンジニア、特にコンポーネントの設計や分類に悩んでいる方のためのガイドブックです。テストの書き方がわからない、コンポーネントのアンチパターンを知りたい、といった方のために、テストしやすい、またはしづらいコンポーネントとはなにか、単体テストの書き方などについて丁寧に解説しています。

〈本書の対象読者〉
・Vue.jsのコンポーネント設計に自身がない
・Vue.jsのコンポーネントの分類で悩んでいる
・Vue.jsのコンポーネントのアンチパターンを知りたい
・Vue.jsのコンポーネントのテストの書き方がわからない

書誌情報

• 著者: 中島 直博
• 発行日: 2019-06-28
• 最終更新日: 2019-06-28
• バージョン: 1.0.0
• ページ数: 64ページ(PDF版換算)
• 対応フォーマット: PDF, EPUB
• 出版社: インプレス NextPublishing

対象読者

著者について

中島 直博

株式会社ピクセルグリッド所属のフロントエンド・エンジニア。v0.10からVue.jsを使い始め、業務/個人を問わず数多くのプロジェクトで採用経験あり。

目次

第1章　なぜテストを書くのか

• 1.1　なぜ「私」はテストを書くようになったのか

第2章　テストしやすいコンポーネントと、テストしづらいコンポーネント

• 2.1　テストしやすい/しづらいコンポーネント
• 2.2　機能を少なくシンプルに保つ
• 2.3　依存は少なく
• 2.4　なるべく状態を持たせない
• 2.5　propsの型指定で避けたほうがいい型
• 2.6　親子コンポーネント間のやりとり
• 2.7　Storeのgettersに注意
• 2.8　ライフサイクルフックに直接処理を書かない

第3章　コンポーネントを分類する

• 3.1　コンポーネントの種類を知る
• 3.2　２種類で足りる？

第4章　ディレクトリ構成とコンポーネントの分類

• 4.1　UIのサンプル
• 4.2　basicsディレクトリ
• 4.3　componentsディレクトリ
• 4.4　containersディレクトリ
• 4.5　pagesディレクトリ

第5章　なにをテストするか

• 5.1　テストの対象
• 5.2　コンポーネントのテスト項目
• 5.3　Vuexのテスト
• 5.4　どうやってテストするか

第6章　テスト実行環境の構築

• 6.1　Vue CLIを使った環境構築
• 6.2　Vue CLI UIを使う
• 6.3　テストのサンプル

第7章　テストを書く

• 7.1　サンプルアプリケーション
• 7.2　テストの実行方法
• 7.3　ディレクトリとファイル構成
• 7.4　Jestの使い方と機能
• 7.5　vue-test-utils
• 7.6　basicのテスト
• 7.7　componentのテスト
• 7.8　containerのテスト
• 7.9　pageのテスト