Zod란?

Zod

TypeScript와 JavaScript를 위한 스키마 선언 및 검증 라이브러리

데이터 유효성 검증 라이브러리를 사용하면 객체의 구조를 간단한 문법으로 정의할 수 있고 데이터 유효성 검증의 복잡성을 관리할 수 있다.

Zod 라이브러리를 썼을 때의 장점

• 직관적인 API: 선언적인 방식으로 스키마를 정의할 수 있음
• 타입 안전성: TypeScript와의 강력한 통합을 제공
• 유연성: 다양한 검증 규칙과 커스텀 메시지를 지원

기본 사용법

import { z } from 'zod';

const userSchema = z.object({
  firstName: z.string().min(1, "First name is required"),
  lastName: z.string().min(1, "Last name is required"),
});

try {
  userSchema.parse({ firstName: "John", lastName: "" });
} catch (e) {
  console.error(e.errors);
}

firstName: z.string().min(1, "First name is required") => React Hook Form과 Zod를 함께 사용하면, 커스텀 에러 메시지를 쉽게 처리할 수 있다.

• schema.parse() : 오류가 발생하는 경우 오류 메시지와 함께 throw 함수를 호출해 서버가 중단됨.
• schema.safeParse() : 유효성 검사에 실패해도 오류를 던지지 않음.

React Hook Form + Zod

Zod와 함께 React Hook Form를 사용하면 폼 검증을 더욱 견고하게 할 수 있다.
두 라이브러리를 함께 사용하려면 패키지를 설치해야한다.

yarn add @hookform/resolvers