T-CREATOR

型安全なバリデーションを実現するためのZodついて紹介

型安全なバリデーションを実現するためのZodついて紹介

TypeScript環境での開発において、型安全なバリデーションは非常に重要です。
そこで注目を集めているのが、Zodというライブラリです。 今回はZodについて解説いたします。

Zodとは?

Zodは、TypeScriptの型と一貫性のあるスキーマ定義が可能な、宣言的かつ強力なバリデーションツールです。
フォームやAPIレスポンスの検証、設定ファイルの検証など、さまざまなシーンで活用できます。


型定義とバリデーションを同時に叶えるZodの魅力

ZodはTypeScriptの型定義とバリデーションを同時に行えるため、次のような利点があります。

特徴説明
型とスキーマの一貫性z.inferを使ってZodスキーマから型を自動生成
ランタイムバリデーションJavaScript実行時にデータを検証し、バグを早期発見
組み合わせの柔軟性スキーマの合成(オブジェクト、配列、Union、Refine)で複雑な構造にも対応

インストール手順(yarn)

Zodはシンプルに以下のコマンドで導入可能です。

bashyarn add zod

TypeScriptにすでに対応しているため、型定義ファイルなどを別途追加する必要はありません。


基本的な使い方と具体例

1. スキーマ定義とバリデーション

tsimport { z } from "zod";

const userSchema = z.object({
  name: z.string(),
  age: z.number().int().positive(),
  email: z.string().email(),
});

このuserSchemaは、以下のようなオブジェクトを検証できます。

tsconst result = userSchema.safeParse({
  name: "太郎",
  age: 25,
  email: "taro@example.com",
});

if (result.success) {
  console.log("OK", result.data);
} else {
  console.error("Validation Error", result.error.format());
}

safeParseを使うと、失敗時にも安全にエラー内容を確認できるのがポイントです。

2. スキーマから型を生成する

tstype User = z.infer<typeof userSchema>;

これにより、Zodの定義がそのままTypeScriptの型として使えるようになります。

3. ネストされたオブジェクトの例

tsconst postSchema = z.object({
  title: z.string().min(1),
  body: z.string().min(10),
  author: userSchema,
});

複雑な構造も直感的に定義でき、型の再利用も可能です。


フォームとの連携(React Hook Form)

Zodは@hookform/resolvers/zodを用いることで、React Hook Formとシームレスに統合できます。

bashyarn add @hookform/resolvers
tsimport { useForm } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";

const {
  register,
  handleSubmit,
  formState: { errors },
} = useForm<User>({
  resolver: zodResolver(userSchema),
});

このように設定することで、バリデーションとフォーム制御が非常にスムーズに行えます。


より複雑なパターン(Union・カスタムバリデーション)

Zodでは次のような柔軟なスキーマ構築も可能です。

tsconst paymentSchema = z.union([
  z.object({ type: z.literal("credit"), cardNumber: z.string().length(16) }),
  z.object({ type: z.literal("paypal"), email: z.string().email() }),
]);

また、独自条件を追加するにはrefinesuperRefineが使えます。

tsconst passwordSchema = z
  .string()
  .min(8)
  .refine((val) => /[A-Z]/.test(val), {
    message: "大文字を含めてください",
  });

まとめ

Zodは次のような開発者におすすめです:

  • TypeScriptの型とバリデーションを一元管理したい
  • 実行時にしっかりと安全性を確保したい
  • フォーム入力やAPI受け取り時の型崩れを防ぎたい

今後のプロジェクトにZodを導入すれば、バグの発見が早くなり、メンテナンス性の高いコードが実現できます。

導入コストが低く、恩恵が非常に大きいライブラリですので、ぜひ一度活用してみてください。

記事Article

もっと見る