この本ではFirebaseとTypeScriptとNext.jsを使ってリアルタイムチャットアプリを作ります。

// optional custom error message z.string().nonempty({ message: "Can't be empty" }); オブジェクトのkeyをmessageにしてvalueを好きな値にすればいけるんですね🥰 デフォルトのエラーメッセージ zodのエラーメッセージはすべて英語で定義されています Required(必須)などはどこでカスタマイズ(日本語化)するのだろう🤔 公式のエラーメッセージカスタマイズを読と・・・ import { z } from "zod"; const customErrorMap: z.ZodErrorMap = (issue, ctx) => { if (issue.code === z.ZodIssueCode.invalid_type) { if (issue.expected === "string")

この記事はNext.js 12.xのLayouts機能です。 Next.js 13.xのLayoutsについては公式を参照してください https://beta.nextjs.org/docs/routing/pages-and-layouts Next.jsのLayoutについてTypeScriptの記事を探してもあまり見つからなかったので Layoutsとは🤔 ページ間で共通のコンポーネントを定義する機能 HeaderやFooterなどはほぼ全ページ同じレイアウトを使うけど、ページコンポーネントに直接書くとコンポーネントの状態（入力値など）が保持できないのでページコンポーネントの外に書くことでレイアウトの状態も保持できる🤝 検証に使ったリポジトリ Next.jsのLayoutsを使うと何が嬉しいのか 一部共通ではないページが有る場合もページ単位でLayoutを変えられるので対応可能