りんりん
【10章】NextJSでのバックエンド開発演習(前半)の振り返りと、できない自分と向き合いながら進むために
2026年02月05日
見出しはありません
要約を生成中...
10章の学習目安時間は「20時間」。 開始前は「まぁなんとかなるやろ」と思っていましたが、実際は 60時間以上 かかりました。
昨年のオフ会で、たむさんが「10章で進捗が止まった」と話していた理由が、今回身に染みて分かりました。 本当に難しい。 そして、自分がいかに知らないことだらけで、いざという時に前に進む力が足りていないかを痛感しました。
10章で時間のかかった理由は、覚えること・やることが圧倒的に多かったからです。
①SQLの勉強
まずは基礎固め。 SQLServer を仕事で触っていたとはいえ、改めて学び直し。
②DB設計(ER図の作成)+テーブルの概念の理解
中間テーブルの概念を理解しながら ER 図を作成。 「NULL が多い DB は危険」ということも理解。
③GitHub上に10章のリポジトリ作成→Prisma設定まで実施
ローカルと GitHub のリモート設定を切り替え、Prisma を導入。
(※手順は備忘録として記事の最後にまとめています)
④サイトマップでページ構成を理解し、API を実装
⑤Postman で API を叩いてデータ作成
API が正しく動くか確認しながらデータ投入。
⑥先に「実際の動作画面」を参考にしながら、画面実装
・microCMS から自前 API にデータ取得先を切り替え
・admin 画面の作成
・新規登録・更新・削除の動作確認
⑦提出前に npm run build
型エラーが出ないか最終チェック。
⑧課題提出
長かったけど、なんとか完走!!!
仕事では SQLServer を使っていたので、 「ローカルに DB を持つってどういうこと?」と思っていました。
Prisma を使うと、1つのファイル(dev.db)に DB を持てる。 しかも、
コード
npx prisma studioでブラウザ上に GUI が開く。
「え、そんなんできるんですか?」 と、吉本新喜劇の内場みたいに心の中でツッコんでしまいました。
仕事では誰も言っていなかった概念で、実際に画面実装していくと「めちゃくちゃ大事やん」と実感しました。NULL が多い社内の DB を見てきたけど、 「あれはあかんかったんやな…」と反省。
今回のブログアプリでは、 記事(Post) と カテゴリー(Category) がありました。
そして、記事は複数のカテゴリーを持てるし、 カテゴリーも複数の記事に紐づきます。これはデータベースの世界では 多対多と呼ばれる関係です。
多対多の関係は、 直接テーブル同士を結びつけることができないため、 必ず「中間テーブル」が必要になります。
中間テーブル(PostCategory)は、 「A と B の関係を管理するためのテーブル」 という役割を持っていて、記事にカテゴリーを複数つけられたり、カテゴリーに属する記事を一覧で取得できたり、データの整合性が保たれたり、NULL を乱発しなくて済むなどのメリットがあります。
記事一覧と記事新規作成画面が似ているなと思っていたら、 見本では PostForm を共通コンポーネント化していました。
React の基本を思い出しました。
状態は親が持つ
子は props で受け取る
新規作成画面(/admin/posts/new) ← 親
│
└── PostForm(子)
詳細・編集画面(/admin/posts/[id]) ← 親
│
└── PostForm(子)「React ってこういうところがすごいんや」と再認識できました!
正直、ほとんど何も見ずにコードを書くなんて無理でした。
特にカテゴリーセレクトの実装は、 ぶべさんの見本をほぼ丸写ししながら理解。
でも、ただ写すだけでは意味がないと思い、
見本を見ながら、動きや他のファイルとのつながりを理解する
自分で書けるところは自分で書いてみる
見本と比較して何が違うか考える
という流れで進めました。
「見本を使うけど、ちゃんと自分で考える」 これが大事だと実感しました。
思い返すと、仕事で初めて PHP を触ったときも同じでした。 会社情報の検索・更新画面を実装したとき、指導社員にヒントをもらいながら 3か月かけて必死に作ったのを覚えています。
でも、2回目以降の画面実装では、 「あ、前にやったあれと同じやん」と要領を得て、一人でできるようになりました。
今回の10章でも同じことを感じました。 最初はできなくても、必ず次につながる。 やったことは絶対に無駄にならない。
そのことを思い出せたのは、自分にとって大きな収穫でした。
手や思考が止まった時に、ぶべさんのストーリーズや、皆さんのブログを読みながら進めました。
特に心に残った言葉:
習得には個人差があります。 時間がかかる人も、続けていれば必ずできるようになるので、焦らずに取り組みましょう。(ぶべさんのストーリーズ)
すごい方が言っているからこそ説得力があって、 「諦めずに頑張らなあかん」と思えました。
約60時間。 目標時間を決めていなかったのが反省点。今日はここまでやるとか決めないといけないと反省しています。
CSS モジュールが多すぎて、 「どこに何があるんや…」となりがち。
Tailwind を使えば、 ファイル数も減ってもっと見やすくなるはず!
アプリ開発時には使えるようになりたいと思います。
10章では本当に詰まりまくって、途中で何度も心が折れそうになりました。 「みんなはどうやって乗り越えたんやろ…?」と思って検索してみたものの、 意外と10章の体験談って多くなくて(検索方法が悪かったらすみません…)。
普段はブログの下書きに学びをメモしているのですが、 今回は余裕がなくてメモすらほとんど残せませんでした。
だからこそ、 自分の振り返りとしても、誰かの参考になる記事としても、ブログを書くことの大切さを改めて感じました。
10章は特に情報量が多く、「どこでつまずいたか」「どう解決したか」を言語化しておくことが、 後から振り返ったときに大きな財産になるのかなと思います。
※このテーマは別記事で「ブログを書く大切さ」としてまとめて投稿したいと思っています。
最近、あかねさんのブログに「自走力がないと厳しい」という言葉がありました。 その言葉が、10章を終えた今の自分にすごく刺さりました。