実装で学ぶフルスタックWeb開発 エンジニアの視野と知識を広げる「一気通貫」型ハンズオン

著者 : 株式会社オープントーン 佐藤大輔 伊東直喜 上野啓二

• 翔泳社 (2023年12月18日発売)

作品紹介・あらすじ

Webシステムを「まるごと作る」フルスタック開発体験！幅広く活躍できるワンランク上のエンジニアになるために本書は、Webシステムの「フロントエンド」と「バックエンド」を、一冊でまるごと（＝フルスタックで）作り上げる書籍です。サンプルアプリケーションの開発を通じて、・フロントエンドとバックエンドをどのように連携させるか・リポジトリを効率的に管理するにはどうするか・設計情報をどのように共有するかといったポイントを、手を動かしながらひとつひとつ学習できます。実装手段のフレームワークには「Next.js」と「Django」を選定しているため、モダンなWeb開発の全体像を把握することにも役立ちます。分業化の進む現代的なWeb開発の現場で、あなたが自分の担当外の開発領域についてきちんと理解ができていないと感じるなら、本書は最適の学習書になるはずです。本書を読めば、フロントエンド／バックエンドそれぞれの動作原理や開発テクニックはもちろん、開発のさまざまな工程で効率化を図るためのノウハウを習得できます。Webシステム開発の全体像を見渡し、現場で幅広く活躍できるフルスタックな視野と知識が身につく一冊です。■対象読者・業務経験2～3年目のフロントエンドエンジニア／バックエンドエンジニア・自分の担当領域以外で用いられている開発手法や技術について把握したい人・モダンなWeb開発の全体像を把握したい人■目次【第I部　Webシステム開発の基本を理解する】第1章　Webシステム開発の基本を学ぶ第2章　開発基盤を理解する第3章　環境の整備と開発の開始第4章　フロントエンドとバックエンドのシステム連携の基本【第II部　Webシステム開発を実践する】第5章　フロントエンドの実装第6章　バックエンドの実装とフロントエンドとのシステム連携の実践第7章　非同期処理とバッチ処理第8章　データ構造・マスタデータの管理【第III部　現場で役立つ周辺知識を身につける】第9章　フルスタック開発のチーム構築とアーキテクチャ選定第10章　フルスタック開発の設計第11章　リポジトリ管理

感想・レビュー・書評

[amano225さんの感想 · 2024年3月17日]

フロントエンドにNext.js、バックエンドにDjangoを用いてWeb開発を行う流れを書いた本。
自分はこういう本を読んでも、読んで満足して実際にコードは書かないという事が多いのだけど、今回は本書にならって実践してみた。

ただ、やってみるとうまく動かない事が多数。自分の記述ミスということも多いのだけど、そもそもそのままだと動かない(Googleや生成AIで調べて解決した)というのもいくつかった。next.config.jsなんてファイルはないのだけど、この本の執筆時はあったのだろうか…。

後、これは自分のPCの問題なのだけど、WSLでDockerを動かしていると、メモリーを食いつぶされてWSLが動かなくなることがよく合った…。いろいろ調べたのだけど、うまく解決しなかった。まあ、5年前のPCだし、そろそろ買い替え時なのかな…(今はメモリ8GBだけど、次は16GBにしようと思った)

MySQLのインストールが、まるでWindows上にコンテナを作ってるように思えてそんなことができるのかと驚いたけど、これも一応、WSL上にコンテナを作ってるということでいいのだろうか？　実体がどこにできているのか気になった。

Dev ContainersというVSCodeの拡張機能は初めて知った。VSCodeから簡単にコンテナを作成できるとのことで、かなり便利だと思った。こっちはWindows上ではなく、WSL2のUbunutu上で作成していたけど、Windows上に置いたファイルでもコンテナ化できるのだろうか？
ただ、これ使うとかなり重くなるような気がする…。　

Backendを動かすコマンドは長すぎて覚えられない。覚えられないけど、後半では「起動してください」と書かれてるだけだからページを戻して調べる必要がある(仕方なく、付箋をつけてすぐ参照できるようにした)。「このコマンドは何度も使うことになるので、覚えておいてください」みたいに書いてほしかったところ。

フロントエンド側(Next.js)のコードは、行末にセミコロン(;)がついていたりついていなかったりとバラバラなのが気になったのだけど、そういうもんなのだろうか。

第3部の設計書については、よくまとまってあって参考になりそう。それにしても、設計書というだけでいろいろ種類があるんだなぁ。設計はまだまだ苦手意識があるのだけど、このへんもうまく作れるようになっていきたい。

[sou (08thse)さんの感想 · 2024年5月6日]

図書館で借りられたので、ざっくり流し読み。

書名の通り、ハンズオン形式＝サンプルコードベースで解説されています。React / Django / MySQL ベースです。

Amazon等のレビューでも言われていますが、各種サンプルが動かないようなので、翔泳社サイト等の訂正も含めてチェックする必要があるようです。

＃個人的には、非機能要件のところで「非機能要求グレード」に一切触れてない時点で少し物足りない感がありました…

[いんちょーさんの感想 · 2024年4月10日]

いま一つこの本の趣旨が分からなかった。表紙裏に対象読者として「業務経験２～３年目のフロントエンドエンジニア／バックエンドエンジニア」と書かれているが、仮にバックエンドエンジニアの立場で見てみると、モダンなJavaScriptの書き方についてほとんど触れられていないので、この本のハンズオンを実施してもあまりフロントエンドのことを理解できないような気がするし、フロントエンジニアの立場で見てみるとクラスモジュールの設計や複雑なモデル定義などについてほとんど触れられていない。
対象を初心者側に振るか、あるいは開発環境をDocker Compose+VSCodeに任せて、DBやチームビルディングには触れずにもう少し深いところまで掘り下げるか、どちらかの方が良かった気がする。
あとはハンズオンを謳っているのに、書かれている通りにコードを書いても動かなかったり、前後のつながりが悪くあるはずのデータがないのに更新しようとしたりしてエラーになったりするので、原因調査に時間がかかって思うようにハンズオンが進まない。これはちゃんと動作確認してからリリースするべきなんじゃないかと思う。