新書リリース。最新のNext.jsを学べる『Next.jsでつくるフルスタックアプリ 前編・後編』
Next.js + Appフォルダ
今週末（2023年11月30日）に最新のNext.jsを使ってフルスタックアプリを開発する書籍（前編・後編）を発売します。
この本は昨年2022年4月に発売した同名書籍のアップデート版になります。
旧版ではNext.jsバージョン12を使って開発を行っていましたが、2022末にリリースされたNext.jsバージョン13では「Appフォルダ」の導入やサーバーコンポーネントのデフォルト化など非常に大きな変更が加わり、Next.jsのコードの書き方も大きく変わりました。
本書は、そのような最新のNext.jsに準拠してフルスタックアプリ開発を行う教本です。
私がこれまで書いてきた本のように、本書もビギナー向けとなっているのでReactやNext.jsの知識がなくてもトライできる難易度です。
前編では、AppフォルダのRoute Hanldersを使ってバックエンド開発を進めます。
ユーザー登録機能、ログイン機能、アイテムの作成・読み取り・編集・削除といったCRUD操作、データベース（MongoDB）との連携の解説がメインです
後編ではReactの基本的な書き方に始まり、サーバーコンポーネントの使い方、ユーザー登録ページ、ログインページ、アイテムの各操作ページ、画像のアップロード方法などを紹介しています。
なお現在のNext.jsではServer Actionsという機能が安定版となっており、これを使えばあえてバックエンドを分離して開発せずとも、いわゆるフルスタックアプリを作れますが、本書では「フロントエンド + バックエンド = フルスタックアプリ」と定義して、それぞれを分けて開発を行う手法を説明しています。
この記事の著者については下記リンクをチェック
Amazon著者ページ：https://www.amazon.co.jp/stores/author/B099Z51QF2
公式サイト：https://monotein.com
Twitter：https://twitter.com/monotein_
本書で扱う主なテクノロジー
前編・後編では以下のようなことをカバーしています。
• Appフォルダ
• サーバーコンポーネント
• middleware.js（Next.js）
• カスタムフック（React）
• useState / useEffect
• ログイン
• トークン（JSON Web Token）
• データベース（MongoDB）
• CRUD操作
• 画像のアップロード（Cloudinary）
• 環境変数
執筆スケジュールの遅れ
本書はもともと今夏に出版をする予定でしたが、さまざまなスケジュールが重なり時間が取れなかったため、出版が遅れに遅れていました。
幸い先月と今月（10 - 11月）は時間的に余裕があったため、何とか執筆を終えて、2023年が終わるよりも前に出版まで至ることができました。
年末年始の休暇時、本書が読者の方のNext.jsへの理解を深める一助となることを願っています。
目次
前編
第1章 基礎知識と開発ツールの準備
ウェブアプリケーションとは？
フロントエンドとバックエンド
CRUD操作
React／Next.jsを使う理由
ターミナルの使い方
npm
VS Code
エラーが発生した場合の対処方法
第2章 Next.jsバックエンド開発の準備
Next.jsのインストール
フォルダの中身
バックエンド開発で使うフォルダ
必要なファイルとフォルダの作成
第3章 アイテム操作機能
アイテムの作成 その1
アイテムの作成 その2
アイテムの読み取り（アイテムをすべて）
アイテムの読み取り（アイテムをひとつ）
アイテムの修正
アイテムの削除
第4章 ユーザー登録とログイン機能
ユーザー登録機能
ログイン機能
ログイン状態の維持
ユーザーのログイン状態を判定する機能
誰がログインしているかを判定する機能
第5章 バックエンドのデプロイ
デプロイの手順（Vercel）
後編
第6章 フロントエンド開発の準備／Reactの書き方／Next.jsのサーバーコンポーネント
アイテムデータの保存
コードのクリーンアップ
コードの書き方とスタイルの適用方法
サーバーコンポーネント（Next.js Appフォルダ）
第7章 ユーザー登録ページとログインページ
必要なフォルダとファイル
ユーザー登録ページ
ログインページ
複数の項目を含んだstateの書き方（補足）
第8章 アイテムページ
すべてのアイテムデータを読み取るページ
1つだけアイテムデータを読み取るページ
アイテムデータを作成するページ
アイテムデータを編集するページ
アイテムデータを削除するページ
ページの表示を制限する
スタイルの適用とコンポーネント
第9章 フロントエンドのデプロイ
バックエンドURLの修正（環境変数の設定）
第10章 ブラッシュアップ
画像のアップロード
ローディング
この記事の著者については下記リンクをチェック
◆ Amazon著者ページ：https://www.amazon.co.jp/stores/author/B099Z51QF2
公式サイト：https://monotein.com
Twitter：https://twitter.com/monotein_
◆ React、Next.js、TypeScriptなどのお役立ち情報や実践的コンテンツを、ビギナー向けにかみ砕いて無料配信中。メルマガ登録はこちらから → https://monotein.com/register-newsletter
この記事が気に入ったらサポートをしてみませんか？