本記事では、Atomic Design(アトミックデザイン)の勉強におすすめの参考書を紹介しています。
気になった参考書があれば、購入する前にAmazonの無料試し読みで内容を確認することをおすすめします。
表紙がイラストをたくさん使っているから、内容も初心者向けだろうと思い購入してみたら、図解での説明が少なく文字で埋め尽くされている参考書だった。。なんてこともありますので。
【月額980円で読み放題!】
Amazon Kindle Unlimited
Amazon Kindle Unlimited


Amazon Kindle Unlimitedに登録すると、月額980円で読み放題だからオススメだよ!



初回30日間は無料だから、まだ登録したことのない人はぜひ試してみてね!
全プログラマー必見!
変数名/関数名にもう悩まない!
変数名/関数名にもう悩まない!
リーダブルコード


メリット
- 美しいコードが書けるが自然と書けるようになる
- 他の開発者が理解しやすいコードになる
著:Dustin Boswell, 著:Trevor Foucher, 解説:須藤 功平, 翻訳:角 征典
¥2,640 (2023/07/23 02:48時点 | Amazon調べ)


目次
Atomic Design ~堅牢で使いやすいUIを効率良く設計する
出版社 | 技術評論社 |
著者 | 五藤 佑典 |
発売日 | 2018/4/25 |
ページ数 | 487ページ |
本書の構成
- UI設計における現状の問題を振り返る
- コンポーネント・ベースのUI開発
- Atomic DesignによるUIコンポーネント設計
- UIコンポーネント設計の実践
- UIコンポーネントのテスト
- 現場におけるコンポーネント・ベース開発のポイント
AtomicDesignとは何なのか。
引用元:Amazon
そもそもデザインやUIとは何のために、どのように機能すべきなのか
デザイナーとフロントエンジニアとの協業について、など網羅的によく学べました。
様々な観点からのテストに関してもとても参考になりました。
最新のkindle版だからか他の方のレビューにあるような誤字、脱字は気になりませんでした。設計、テストなどチュートリアルでは得られないReact実践的な内容が学べます。
引用元:Amazon

