Zenn
🙆

Zodを活用する

2024/02/13に公開
TypeScript
zod
tech

はじめに

普段、React(TypeScript)で開発を実施しています。
Validationや型定義はZodがいいと聞いたので、今回開発を実施していこうと思います。

Zodとは


https://zod.dev/

ZodはTypeScriptで使用するためのスキーマ定義とバリデーションライブラリです。これを利用することで、実行時(runtime)にデータの型安全性を保証し、APIのリクエストやレスポンスなど、外部からの入力データの検証を簡単に行うことができます。

主な特徴

Zod は TypeScript で使用するための強力なスキーマ定義とバリデーションライブラリで、以下のような主な特徴があります。

  • 型安全: Zod を使うことで、TypeScript の型推論をフルに活用し、型安全なコードを書くことができます。これにより、開発者はランタイムエラーを減らしつつ、より安全にコードを書くことが可能になります。

  • 自動型生成: スキーマ定義から TypeScript の型を自動生成できるため、型定義の二重管理を避けることができます。これにより、開発効率が向上し、型定義に関する煩雑さが軽減されます。

  • エラーハンドリング: バリデーションエラーは詳細な情報を含むエラーオブジェクトとして扱われるため、エラーハンドリングが容易になります。これにより、開発者はユーザーに対してより明確なフィードバックを提供することができます。

サンプルコード

index.ts
import { z } from 'zod';

// ユーザーのスキーマを定義
const UserSchema = z.object({
  name: z.string(),
  age: z.number().min(0),
  email: z.string().email(),
});

// この型を使って、TypeScriptの型を導出
type User = z.infer<typeof UserSchema>;

// バリデーションのサンプル
const validateUser = (data: any): User | null => {
  try {
    // スキーマに基づいてデータを検証し、問題がなければデータを返す
    return UserSchema.parse(data);
  } catch (error) {
    if (error instanceof z.ZodError) {
      // エラー情報をログに出力
      console.error(error.errors);
    }
    return null;
  }
};

実行結果

実行データ
const sampleUserData = {
  name: 'Taro Yamada',
  age: 25,
  email: 'taro@example.com',
};

const sampleUserData2 = {
    name: null,
    age: 25,
    email: 'taro@example.com',
  };
const validatedUser = validateUser(sampleUserData);
console.log(validatedUser);
実行結果(正常)
~/develop/react/zod_sample$ ts-node index.ts
{ name: 'Taro Yamada', age: 25, email: 'taro@example.com' }
実行データ
const sampleUserData2 = {
    name: null,
    age: 25,
    email: 'taro@example.com',
  };
const validatedUser = validateUser(sampleUserData2);
console.log(validatedUser2);
実行結果(正常)
~/develop/react/zod_sample$ ts-node index.ts
  {
    code: 'invalid_type',
    expected: 'string',
    received: 'null',
    path: [ 'name' ],
    message: 'Expected string, received null'
  }
]

Discussion