- #99
- #98
- #97
- #96
- #95
- #94
- #93
- #92
- #91
- #90
- #89
- #88
- #87
- #86
- #85
- #84
- #83
- #82
- #81
- #80
- #79
- #78
- #77
- #76
- #75
- #74
- #73
- #72
- #71
- #70
- #69
- #68
- #67
- #66
- #65
- #64
- #63
- #62
- #61
- #60
- #59
- #58
- #57
- #56
- #55
- #54
- #53
- #52
- #51
- #50
- #49
- #48
- #47
- #46
- #45
- #44
- #43
- #42
- #41
- #40
- #39
- #38
- #37
- #36
- #35
- #34
- #33
- #32
- #31
- #30
- #29
- #28
- #27
- #26
- #25
- #24
- #23
- #22
- #21
- #20
- #19
- #18
- #17
- #16
- #15
- #14
- #13
- #12
- #11
- #10
- #9
- #8
How can we validate the correctness of client-side data?
Typically, data validation is done using JSDoc or TypeScript for type annotations. Although TypeScript helps us check the “types before execution,” there is still a possibility of runtime errors due to data not matching expectations after being compiled to JavaScript, usually stemming from external data (forms, URLs, LocalStorage, API responses).
At this point, it is recommended to use Zod for client-side data validation. Whether in Astro, tRPC, React Hook Form, or VeeValidate, Zod is utilized behind the scenes. It is a simple yet powerful library worth understanding. Recently, I had a strong experience rewriting a webpage that needed to determine its content through URL Query, and Zod made it easy and elegant to complete the validation logic.
- #7
- #6
- #5
- #4
- #3
- #2
- #1