【改訂版リリース】「Next.jsでつくるフルスタックアプリ」Next.jsバージョン15対応版

Next.jsフルスタック開発入門書の改訂版リリース

先日、Next.jsをバックエンドとフロントエンド両方に使ってアプリを開発する入門書『Next.jsでつくるフルスタックアプリ　前編・後編（三好アキ著）』をリリースしました。

ビギナーを対象にしているので、JavaScriptやReact、Next.jsなどの深い知識は不要です。

本書は同名既刊書の改訂版にあたり、使っているNext.jsのバージョンが14から、先月（2024年10月）リリースされたばかりの15に変えてあります。

Kindle Unlimited利用者は無料購読可能です。

Next.jsでつくるフルスタックアプリ　前編（バックエンド開発）

【2024年11月リリース。最新のNext.jsをつかった本格アプリの開発手法がわかる入門書】

880円 → 0円

Amazonのページに移動する

Next.jsでつくるフルスタックアプリ　後編（フロントエンド開発）

【2024年11月リリース。最新のNext.jsをつかった本格アプリの開発手法がわかる入門書】

880円 → 0円

Amazonのページに移動する

3度目の改訂版

本書の最初のバージョンを出したのは2022年4月です。

その時は、当時の最新のNext.jsバージョン12を使っていました。

その後、Appルーターを採用した新しいバージョンのNext.jsがリリースされたので、それに合わせた改訂版を出したのが2023年11月です。

この時はNext.jsバージョン14を使っていました。

その後、このバージョン14版をベースにした『動かして学ぶ！Next.js/React開発入門』が、翔泳社より今年（2024年）9月にリリースされました。

その翌月には、Reactバージョン19の正式リリースを待たずしてNext.jsの新しいバージョンである15がリリースされたので、それに合わせて内容を改定したものが今回出したものになります。

変更点や追加した内容など

今回のNext.jsバージョン15では、14から大きな変更（Breaking changes／破壊的変更）はありませんでした。

本書に関係する小さな変更点としては、キャッシュ関係のコード、およびcontextが非同期となりawaitが必要になった点です。

なお、本書では後編の最後に参考情報として、データベースのデータをサーバーコンポーネントから直接取得する内容を追加してあります。

姉妹書について

本書は、数週間前に出した下記書籍と姉妹書の関係にあります。

Next.js Server Actionsでつくるフルスタックアプリ

【2024年11月リリース。少ないコードですばやく本格的なフルスタックアプリを開発する方法を紹介】

880円 → 0円

Amazonのページに移動する

同一のフルスタックアプリを、今回の『Next.jsでつくるフルスタックアプリ（前編・後編）』ではRoute Handlersを使って、上記の姉妹書ではServer Actionsを使って開発しています。

そのためこの姉妹書と本書を合わせて読むことで、開発したいアプリにより適したコードの設計方法を理解できるようになります。

目次（Next.jsでつくるフルスタックアプリ　前編・後編）

Next.jsでつくるフルスタックアプリ　前編（バックエンド開発）

【2024年11月リリース。最新のNext.jsをつかった本格アプリの開発手法がわかる入門書】

880円 → 0円

Amazonのページに移動する

はじめに

第1章　基礎知識と開発ツールの準備
ウェブサイトとウェブアプリケーションの違い
フロントエンドとバックエンド
CRUD操作
React／Next.jsを使う理由
ターミナルの使い方
Node.jsのダウンロード
npmについて
VS Codeのダウンロード
Thunder Clientのインストール
エラーが発生した場合の対処方法

第2章　Next.jsバックエンド開発の準備
Next.jsのインストール
フォルダの中身
バックエンド開発で使うフォルダの準備
バックエンドフォルダの働き
必要なフォルダとファイルの作成

第3章　アイテム操作機能
アイテムの作成　その1
アイテムの作成　その2
アイテムの読み取り（アイテムをすべて）
アイテムの読み取り（アイテムをひとつ）
アイテムの修正
アイテムの削除

第4章　ユーザー登録とログイン機能
ユーザー登録機能
ログイン機能
ログイン状態の維持
ユーザーのログイン状態を判定する機能
誰がログインしているかを判定する機能

第5章　バックエンドのデプロイ
デプロイの手順（Vercel）

Next.jsでつくるフルスタックアプリ　後編（フロントエンド開発）

【2024年11月リリース。最新のNext.jsをつかった本格アプリの開発手法がわかる入門書】

880円 → 0円

Amazonのページに移動する

はじめに

第6章　フロントエンド開発の準備／Reactの書き方／Next.jsのサーバーコンポーネント
アイテムデータの保存
コードのクリーンアップ
Reactの書き方とスタイルの適用方法
サーバーコンポーネント（Next.js Appフォルダ）

第7章　ユーザー登録ページとログインページ
必要なフォルダとファイル
ユーザー登録ページ
ログインページ
複数の項目を含んだstateの書き方（補足）

第8章　アイテムページ
すべてのアイテムデータを読み取るページ
1つだけアイテムデータを読み取るページ
アイテムデータを作成するページ
アイテムデータを編集するページ
アイテムデータを削除するページ
ページの表示を制限する
スタイルの適用とコンポーネント

第9章　フロントエンドのデプロイ
バックエンドURLの修正（環境変数の設定）

第10章　ブラッシュアップ
画像のアップロード
ローディング
メタデータの設定方法
サーバーコンポーネントを使ったデータ取得の方法（参考情報）

関連書
著者について