最近読んだウェブフロントエンド関連の技術書2冊
最近読んだけど特にどこにも感想を書いていなかった技術書を2冊まとめておきます。
実践Next.js ——App Routerで進化するWebアプリ開発
実践Next.js ——App Routerで進化するWebアプリ開発：書籍案内｜技術評論社
App Router が登場してからもうしばらく経つが、未だに会社のプロダクトでも個人開発でも Pages Router で頑張っていたので、そろそろ移行していかないとな、となっていたタイミングでちょうど発売された書籍。
この書籍を読み進めながら、その内容に沿って自分のこのブログを Next.js の App Router に移行していくって感じで実際にコードを書きながら読み進めた。
自分のブログの場合は全て静的なページとして作るので、この書籍を読みながら App Router 環境の中で SSG をするための実装を進めていったが、とても簡単に実装ができた。
どんな記述があると動的レンダリングになるか、ということがとてもわかりやすく書かれていて便利。
特にこのブログにおいては、Parallel Routes と Intercepting Routes を用いたダイアログの実装はまんまこの書籍の通りにやっていて、理想の挙動ができているのでとても役に立っている。
また、会社のプロダクトで新しく Next.js を使って立ち上げるタイミングがあったので、そこでもこの書籍を読みつつ実装を進めている。
そちらはウェブアプリケーションなので基本的に動的レンダリングになる。こちらのプロダクトでは、書籍にある Next.js が拡張している fetch のキャッシュ機構や、Server Component や Server Action の話を参考にしながら実装を進めている。
Next.js の難しさはキャッシュの難しさだと僕は思っていて、そこを一から丁寧に説明してくれているので、僕の中の Next.js 難しい〜の気持ちがだいぶ軽減されてとても良かった。
というわけで App Router やっていくぞという人にはぜひ読みながら実装していってくれとおすすめしたい一冊でした。
Tailwind CSS実践入門
社で開発している UI コンポーネント集を styled-components から Tailwind CSS に移行することが決まったので、がっつり学ばなくてはということで手に取った一冊。
著者は pixiv のエンジニアの方で、pixiv のデザインシステムである charcoal はとても質が高いのを以前から知っていたので、この書籍にも以前から興味がありました。
読んでみての感想として、この書籍の良いところは、Tailwind CSS の機能だけではなく Tailwind CSS の思想やユーティリティファーストの考え方についてをまず説明した上で機能の話に入っていくので、それぞれの機能がなぜそうなっているのかの理解がしやすいという点です。
この書籍に書かれたことを理解した上で実装を進めると、何をやるのが適切で何をやっていけないかということがわかるので、より Tailwind CSS の思想にあったフロントエンド実装ができるな〜と感じました。
また個人的に嬉しかったこととして、あまり最近の CSS の事情を追えていなかったために知らなかった CSS の機能や考え方を知ることもできた点です。
特に、leading-trim を使ったハーフレディングの除去の話に関しては、常々「figma では要素同士の margin が理想通りになってるのに figma のままに実装すると要素の line-height 分 margin が変わっちゃう問題」で悩んでいたので、衝撃を受けました。まずハーフレディングという概念を知らなかったので、この問題が解決できるのか…！となりました。
というわけで、ただの Tailwind CSS の使い方の本ではなく、その設計思想を理解した上で実装を進めるための手引となる本です。また、Tailwind CSS のプラグインの作り方や、さらには Tailwind CSS でデザインシステムを構築するためのやり方というところまで踏み込んでおり、とても満足感のある一冊でした。
おわり
というわけで直近読んだ2冊をまとめました。
技術書読むたびに毎回感想ブログを書くのはなかなか大変なので、こういう思い立ったときに良かった技術書をまとめるのは結構良い。
今後も続けたい。