3 ms·

Agree wholeheartedly. Writing TypeScript is better than JavaScript, but the lack of runtime protection is fairly problematic. However, there are libraries suc

Agree wholeheartedly. Writing TypeScript is better than JavaScript, but the lack of runtime protection is fairly problematic. However, there are libraries such as https://zod.dev https://zod.dev, and you can adopt patterns for your interfaces and there's already a large community that does this.

Degorath 11mo ago
Could you please elaborate on "patterns for your interfaces"?
- ownagefool 11mo ago
  Sure. You tend to think about the edges of your application. 1. Router Tanstack Router: Supports runtime validation libraries such as z0d. So I have routes such as example.com/viewer/$uuid/$number, it should 400 if those aren't actually validate uuid and numbers. React Router: Supports Types, but every type is a string because, well, they technically are, but this isn't useful in practice in my opinion. There are 3rd party libs such as: https://github.com/fenok/react-router-typesafe-routes https://github.com/fenok/react-router-typesafe-routes 2. API Lets say you're making your API public to clients you can't trust to send the correct data ( which probably also includes your own client ). https://www.npmjs.com/package/express-openapi-validator https://www.npmjs.com/package/express-openapi-validator This library advertises validating both your input and your output 3. State https://github.com/pmndrs/zustand/discussions/1722 https://github.com/pmndrs/zustand/discussions/1722 4. Database https://www.npmjs.com/package/prisma-zod-generator https://www.npmjs.com/package/prisma-zod-generator 5. Forms https://medium.com/@toukir.ahamed.pigeon/react-hook-form-with-zod-validation-a-complete-guide-with-typescript-aacbcb370a8b https://medium.com/@toukir.ahamed.pigeon/react-hook-form-wit... 6. ENV https://jfranciscosousa.com/blog/validating-environment-variables-with-zod/ https://jfranciscosousa.com/blog/validating-environment-vari... Obviously checks on the agent are primarily a DX/UX thing, whilst checks on the server step are also security controls.
CharlieDigital 11mo ago
Zod is quite unpleasant to use, IME, an has some edge cases where you lose code comments. From experience, we end up with a mix of both Zod and types and sometimes types that need to be converted to Zod. It's all quite verbose and janky. I quite like the approach of Typia (uses build-time inline of JavaScript), but it's not compatible with all build chains and questions abound on its viability post Go refactor.
- hermanradtke 11mo ago
  > we end up with a mix of both Zod and types and sometimes types that need to be converted to Zod In my code, everything is a Zod schema and we infer interfaces or types from the schemas. Is there a place where this breaks down?
  - CharlieDigital 11mo ago
    Not that I know of aside from code comments (which I like), but I much prefer writing TypeScript to Zod

Degorath 11mo ago

Could you please elaborate on "patterns for your interfaces"?

ownagefool 11mo ago
Sure. You tend to think about the edges of your application. 1. Router Tanstack Router: Supports runtime validation libraries such as z0d. So I have routes such as example.com/viewer/$uuid/$number, it should 400 if those aren't actually validate uuid and numbers. React Router: Supports Types, but every type is a string because, well, they technically are, but this isn't useful in practice in my opinion. There are 3rd party libs such as: https://github.com/fenok/react-router-typesafe-routes https://github.com/fenok/react-router-typesafe-routes 2. API Lets say you're making your API public to clients you can't trust to send the correct data ( which probably also includes your own client ). https://www.npmjs.com/package/express-openapi-validator https://www.npmjs.com/package/express-openapi-validator This library advertises validating both your input and your output 3. State https://github.com/pmndrs/zustand/discussions/1722 https://github.com/pmndrs/zustand/discussions/1722 4. Database https://www.npmjs.com/package/prisma-zod-generator https://www.npmjs.com/package/prisma-zod-generator 5. Forms https://medium.com/@toukir.ahamed.pigeon/react-hook-form-with-zod-validation-a-complete-guide-with-typescript-aacbcb370a8b https://medium.com/@toukir.ahamed.pigeon/react-hook-form-wit... 6. ENV https://jfranciscosousa.com/blog/validating-environment-variables-with-zod/ https://jfranciscosousa.com/blog/validating-environment-vari... Obviously checks on the agent are primarily a DX/UX thing, whilst checks on the server step are also security controls.

CharlieDigital 11mo ago

Zod is quite unpleasant to use, IME, an has some edge cases where you lose code comments. From experience, we end up with a mix of both Zod and types and sometimes types that need to be converted to Zod. It's all quite verbose and janky. I quite like the approach of Typia (uses build-time inline of JavaScript), but it's not compatible with all build chains and questions abound on its viability post Go refactor.

hermanradtke 11mo ago
> we end up with a mix of both Zod and types and sometimes types that need to be converted to Zod In my code, everything is a Zod schema and we infer interfaces or types from the schemas. Is there a place where this breaks down?
- CharlieDigital 11mo ago
  Not that I know of aside from code comments (which I like), but I much prefer writing TypeScript to Zod