認証（Firebase-auth）

[empitsu]

Next.js × Firebase Authentication × Vercel で認証アプリをお手軽に作ってデプロイする https://blog.kimizuy.dev/posts/next-firebase-auth

Next.js × TypeScript × Firebase AuthenticationでGoogle認証を実装する https://qiita.com/y-shida1997/items/f5e52c7288813a8184ff

カスタム認証にしてるっぽい？ https://github.com/gladly-team/next-firebase-auth/tree/main/example

Firebaseの存在をフロントエンドから隠蔽するために https://blog.ojisan.io/fb-nukeru

[empitsu]

static

Authenticating Statically Generated Pages https://nextjs.org/docs/authentication

useEffectでuseSWRでuser情報取得 https://github.com/vvo/next-iron-session/blob/master/examples/next.js/lib/useUser.js

[empitsu]

When using Firebase Authentication, we recommend using the static generation pattern.

https://nextjs.org/docs/authentication#firebase

[empitsu]

static

• Nextが推奨してる
• useAuthStateが使えるのでonStateChange使わなくて良い
• loadingの画面の実装が必要
• prefetchされるのでTTIが早い

getQuizz

• useAuthStateでuser情報を取得
• user情報を取得した後、useEffectでquizを取得
• サーバーサイドに隠蔽したい場合はapi routesを使う

SSR

• loadingの実装不要
• user情報の取得にはonStatusChangeの実装が必要
• サーバーサイドのコードをクライアントに露出させないようにできる
• パフォーマンスは微妙

-> quizだけこれをやる？

DBアクセスの実装を隠蔽したいならpostの実装もapi routes経由でやったほうがいいのでは？