zodを使用して堅牢なバリデーションチェックを実装する

[kei615ykhm]

現在のコードにzodライブラリによる堅牢なバリデーションチェックを実装し、型安全なコードにリファクタリングを行う。

現状

• CRUD機能のうち、メモの新規作成と削除機能のみが実装されている。
• バリデーションチェックが不十分で不正なデータが混入する可能性がある。

今後の予定

1. src/schemas ディレクトリの作成

   • src/schemas/memoSchema.ts: メモのスキーマを定義

2. src/types ディレクトリの更新

   • src/types/index.ts: zodスキーマから型を生成

3. src/utils ディレクトリの作成

   • src/utils/zodParser.ts: 汎用的なzodパース関数を実装

4. src/hooks/useManager.ts の更新

   • zodスキーマを使用してバリデーションを実装
   • 新規メモ作成時にバリデーションを適用

5. src/components/memos/MemoForm.tsx の更新

   • フォームの送信時にzodスキーマを使用してバリデーションを実装
   • バリデーションエラーの表示機能を追加

6. src/app/page.tsx の更新

   • 必要に応じて、新しいバリデーション機能に対応するように更新

ディレクトリ構成

src/
├── app/
│   ├── page.tsx
│   └── layout.tsx
├── components/
│   └── memos/
│       ├── MemoList.tsx
│       └── MemoForm.tsx
├── hooks/
│   └── useMemoManager.ts
├── schemas/           // 新しく追加
│   └── memoSchema.ts  // 新しく追加
├── types/
│   └── index.ts
└── utils/             // 新しく追加
    └── zodParser.ts   // 新しく追加

TODOリスト

• [x] src/schemas/ ディレクトリを作成し、メモのスキーマを定義

  • memoSchema.ts ファイルを作成

• [x] src/types/ ディレクトリを更新し、zodスキーマから型を生成

  • index.ts ファイルを更新

• [x] src/utils/ ディレクトリを作成し、汎用的なzodパース関数を実装

  • zodParser.ts ファイルを作成

• [x] src/hooks/useMemoManager.ts を更新し、zodスキーマを使用してバリデーションを実装

  • 新規メモ作成時にバリデーションを適用

• [ ] src/components/memos/MemoForm.tsx を更新し、フォームの送信時にバリデーションを実装

  • バリデーションエラーの表示機能を追加

• [ ] src/app/page.tsx を更新し、新しいバリデーション機能に対応

[kei615ykhm]

変更点

1. src/hooks/useManager.tsの更新を行う際に、バリデーションチェックの詳細な動作確認を行うためにローカルストレージへの保存機能を追加しました。
2. src/schemas/memoSchema.tsの内容と重複するため、src/types/index.tsを削除し、各ファイルのインポートパスを書き換えました。

[kei615ykhm]

22 による大改修で情報が古くなってしまったため、こちらのIssueはクローズします。