Chapter 01無料公開

この本の内容について

だら
だら
2021.09.21に更新

この本は Next.js と Firebase を使い、質問箱のようなサービスを作る方法を解説します。実際に何もないゼロの状態から作り始め、デプロイしてサービスとしてアクセスできるようにした手順をすべて書いています。

また、その関係上特定の技術をしっかり学ぶための本ではありません。一度ものを完成させるための手順を学ぶことで、作るためには何が必要かを知り、気になった部分を更に別の本などで学び、様々な技術への学びを深めていくための入り口となります。

実際に作ったサービスは下記になります。

https://nextjs-firebase-app.vercel.app/

技術概要

この本では主に下記の技術を利用して開発していきます。

  • Next.js 10.0.4
  • React (React Hooks)
  • Recoil 0.1.2
  • Firebase (Admin, Authentication v9, Firestore v9)
  • TypeScript
  • Bootstrap5
  • Vercel

Firebase の Admin でないライブラリが v8 から v9 にバージョンアップして破壊的変更が行われたため 2021/9 に本書は最新であるそちらの記述に書き換えて対応しました。
動作確認はしておりますが本の中では問題が出る部分が残っている可能性もありますのでもし問題が見つかりましたら随時お知らせいただけますと幸いです。

開発内容概要

この本では下記の開発を実際に行います。

  • 匿名認証を用いた簡単なユーザー認証
  • 質問の投稿
  • 質問への回答
  • デザインや動線の設定
  • OGP の作成

事前準備

開発する PC にて、下記が利用できる前提で進めていきます。事前にインストールなどを行ってください。

  • git
  • Node.js
  • GitHub へのユーザー登録
  • Firebase を利用するための Google アカウントの準備
  • Vercel へのユーザー登録

やっていないこと

GitHub などでのソースコードの公開はやっておりません。理由はそれを動かしただけで完成した気分になってしまい、学習の差支えになる可能性があるからです。ただし実際のコードは全て書きながら説明していますので、読みすすめることで作れるようになります。

フィードバックのお願い

物理本でなく Web 上の本として書きましたので、随時修正が可能です。そのためせっかくですのでわかりにくいところや改善したほうが良いところなどがあればぜひフィードバックをお願いします。読者の方のお声を元により良い本にしていきたいと思います。

バージョンアップやプログラムを修正した後に本も修正するのですが、この時に関連する場所をすべて修正しきれずに抜けが出てしまうことなどがあります。ですのでほんの些細な部分でも動かない所があれば報告いただけると本当に助かります。