Hi Jack, I just wanted to take a moment to express my appreciation for the amazing content you create on your KZbin channel. Your videos are not only informative and insightful but also engaging and entertaining. What I love most about your channel is your ability to break down complex topics into easily understandable concepts. Your attention to detail and charismatic presentation style make your videos both accessible and informative for a broad audience. It's clear that you have a real passion for technology and programming, and your enthusiasm is infectious. Every time I watch one of your videos, I come away feeling inspired and excited to learn more. Thank you for all the hard work you put into your channel. You are truly one of the best KZbinrs out there, and I'm grateful to have the opportunity to learn from you. Keep up the great work!
@jherr Жыл бұрын
Wow! Thank you so much!
@hemanthkotagiri88653 жыл бұрын
This is the most underrated channel in tech. Thank you so much for your videos!
@ianrackson57493 жыл бұрын
Thanks, Jack! You are an amazing teacher - making me fall more in love with TS with each new video :)
@ianrackson57493 жыл бұрын
@Jack Herrington just got your new book and saw my comment on the reviews page! Absolutely honored. What an incredible way to begin reading!
@GhanashyamSateesh3 жыл бұрын
I recently saw you on CodingTech channel's Solid.js intro... Damn! This channel is one of those hidden gems on KZbin. I will do my best to spread the word... I do have a request for a solid.js course please!
@codezero60233 жыл бұрын
We have a custom entity framework configured with Json schema. It does validation, state management, and events. There are 2 kinds of validation: run time type checking and dirty validation - violated rules are kept in a validation state property of the entity.
@jasonsebring39832 жыл бұрын
You are my new favorite coder to learn from as I keep watching these and find them valuable every time.
@jherr2 жыл бұрын
Thank you!
@davidtoska77913 жыл бұрын
Looking forward to seeing your take on this!
@somewonderfulguy5 ай бұрын
Today we can add Valibot to the list of schema validation. It is new and not that popular as its counterparts but build with tree shaking in mind what gives drastically smaller bundle size. I'm relatively new to the topic so for now I can say that schemas could be used for form validations and now you gave the idea that it could be used for component library that potentially might be used in JS project. Thanks!
@foureight84 Жыл бұрын
I love channels that are like this. Straight to the core points. Thanks for the this, Jack.
@denilsoncosta98373 жыл бұрын
I really liked this video, this is a daily issue. You went beyond zod and show yup and joi use causes. Thank for the video.
@CathalMacDonnacha Жыл бұрын
Great explanation, just what I was looking for.
@AliAlmahdi3 жыл бұрын
Thank your for the awesome videos. I used to use yup, since I’ve switched NestJS, class-validator and class-transformer are way easier and faster using decorators.
@amiralikulov93002 жыл бұрын
Wow. Jack. You just filled the gap of knowledge that I had! Thank you!
@rockNbrain Жыл бұрын
nice Job Jack, I`m starting a side projec using next 13.4 + TS + Tailwind... and definitely I`m gonna use zod as well in theses situations!! tkss
@jherr Жыл бұрын
That's becoming a popular pattern. Theo has the zact library out there that adds Zod to 13.4 server actions.
@rockNbrain Жыл бұрын
@jherr tks Jack ...Holly Molly .... Theo can't stop shipping new things ! You guys are such an inspiration 💛
@flygonfiasco9751 Жыл бұрын
This was a great video, clear and concise! Thank you!
@Iandavidandrino Жыл бұрын
That json to types conversion was mad !!
@ogreeni Жыл бұрын
Fantastic video Jack! Which of these three libraries do you use the most? I know Zod got pretty popular recently.
@calvincotton19983 жыл бұрын
Learned Formik for work so I'm a real big fan of Yup!
@ShingoSAP2 жыл бұрын
Thank you, excelent content. Very useful ! 👍
@raresraulea54553 жыл бұрын
Hi, Jack! Watching your KZbin videos inspired me to use TypeScript decorators with Closures for creating a caching mechanism to avoid redundant API calls. Could you please make a video about cache invalidation for the mentioned approach? Thanks for all the quality videos!
@jherr3 жыл бұрын
Cache invalidation within a closure; fascinating topic.
@raresraulea54553 жыл бұрын
Returning an array of functions [getter, setter, resetter], working with that closures inner state in the manner you showed us in the TS tuples video would do the cache reset trick, I think. It gets more interesting when we work with TS decorators (defining a @Cache(options?:CacheOptions) decorator that can be applied to any method) and want to dynamically reset the "cache" inside the Closure. A video with your approach would be of much interest. Thanks!!!
@justfly19843 жыл бұрын
That really reminds me PropTypes for React. I remember vividly the moment then I have found that you can't prop-type check for null, cos creator did not wanted to provide this functionality, so I've switched to typescript and never look back again!
@miklosnemeth85663 жыл бұрын
Yeah, in our first React project we used Flow and Prop-Types, then we quickly switched over to TypeScript, which is the most powerful still elegant language I ever worked with. When we had an experimental project with Flutter/Dart we didn't understand why the hell Google hadn't picked TypeScript for Flutter? Anyhow. Take care.
@sunny72683 жыл бұрын
Hi jack what extension you use to convert json to ts interface?
Thanks for awesome video 👍. might want to check superstruct, it is 70% smaller (3.3 kb) compare to zod (10.8 kb) ☺️
@jherr3 жыл бұрын
Oooooo! Nice! I might do another video on validation tooling and if I do I will check this out!
@deeplybrown Жыл бұрын
Great intro to runtime typechecking. I would love to know more in-depth information on _how_ these runtime libraries work, though 🤔
@yassinebouchoucha3 жыл бұрын
Thanks for this Tech-monitoring and benchmark video, a great time saving as always !
@DudumanBogdanVlad2 жыл бұрын
Nice job! Thanks for the material. Do you have a video with your setup like Terminal, VS Code extensions used daily? Thanks again for sharing, started watching your videos and find out every time something new.
@dhiadjobbi6526 Жыл бұрын
Damn dude, This video is sooo amazing, you deserve a like and a subscribe. Thank you
@mananwebandall12033 жыл бұрын
Awesome one and nicely explained
@DedicatedManagers3 жыл бұрын
Can these tools be used to check the shape of incoming data in a javascript application without typescript?
@jherr3 жыл бұрын
Yeah, no problem.
@mluevanos2 жыл бұрын
I prefer to add default fallback values, so any of my array methods would still work. Also forces me to incorporate the default state (or empty state), and state with data UI.
@boot-strapper3 жыл бұрын
I am shocked at how many people think typescript does runtime typechecking.... I have had to correct at least 20 professionals in the field on this point. Terrifying really.
@jherr3 жыл бұрын
There is definitely a lot of misconception around that. I think folks need to use TypeScript Playground a little bit to see just how little the tsc compiler does to the JavaScript.
@hashzones Жыл бұрын
Nice engaging and insightful video
@juanandresmezzera93042 жыл бұрын
Jack, started watching your videos about a week ago and can't stop. Excelent content! Noticed you haven't covered performance aspects of the different runtime validation libraries. How heavy do you think those checks are?
@jherr2 жыл бұрын
Interesting question. I'm sure it's just a function of data set size. I doubt that there are tremendous speed differences between the libraries, but hey, you never know, it could be the case.
@alexnezhynsky97073 жыл бұрын
Zod is great but I don't understand how you did this 07:52. Is that an extension?
@jherr3 жыл бұрын
That's just VS Code. And the only thing I've added beyond that baked in TypeScript support is the "TypeScript Essentials" package of plugins. The keystrokes are Cmd+K then Cmd+I, which does "Debug: Show Hover". And that command might be bound to some other keys for you.
@alexnezhynsky97073 жыл бұрын
Oh, I see, it's a shortcut for hovering. I thought you found a way to preview computed types in vscode 😔. Sometimes when I hover I just get the name of the type/interface
@nickschmitt85943 жыл бұрын
This is so educational. Thanks :-)
@mortezatourani77723 жыл бұрын
In my opinion checking data received by the lib just to give a hint in dev is really nice but not in production
@petrasoftresearch1301 Жыл бұрын
I agree. It just adds more clutter to your code and confusion for new devs being onboarded. Nice idea, but not worth all the extra effort. Just use ? And your code works and doesn’t wast near as much cpu, build time, and actual coding.
@manishkumar12133 жыл бұрын
In my opinion, we shall use the data validation when we are getting data from 3rd party APIs most of the time. Do you think we should add data validation for APIs built in-house?
@jherr3 жыл бұрын
Yes. Two reasons. First, as companies or teams grow the frontend and backend teams split and often deploy on a different cadence so you can run into API version mismatch issues. And secondly, this kind of validation is pretty cheap time wise but can result in much better error messages to the client. As opposed to just getting a 400, now you are getting detail on what exactly was bad about the request, and that speeds development.
@1235niki3 жыл бұрын
Thanks Jack.
@devrusso Жыл бұрын
Where is this convert JSON clipboard to typescript interfaces from? Is it native to vscode or an extension? At around 2:02
@rjmunt3 жыл бұрын
Nice! I've been using class-transformer with decorators in the frontend to conform my types to my form data (backend doesn't handle it). I guess like zod safeParse. I wouldn't recommend class-transformer on the frontend only because it's hard to get the decorators working. import { plainToClass } from "class-transformer"; import { IsNumber } from "class-validator"; import "reflect-metadata"; export class LovelyObject { @IsNumber() //@ts-ignore public shouldBeANumber: number; } const converted = plainToClass( LovelyObject, { shouldBeANumber: "234" }, { enableImplicitConversion: true } ); How would you transform form data in the front end to booleans, numbers etc by a class definition in typescript @Jack ?
@jherr3 жыл бұрын
I'm not familiar with class-transformer or what it's doing here.
@rjmunt3 жыл бұрын
@@jherr I'll continue the thread in your discord. Hard to look at unhighlighted code 😹
@soobhhann67463 жыл бұрын
tanks for your nice tutorials
@davidtoska77913 жыл бұрын
io-ts could also be added to the list of validation library's.
@jherr3 жыл бұрын
I'll check that out!
@davidtoska77913 жыл бұрын
The typedefinitions in zod is inspired by the API of io-ts i read somewhere when I was checking out which library to use.
@jherr3 жыл бұрын
@@davidtoska7791 They come out really clean!
@Norfeldt3 жыл бұрын
😜😂 the problem with io-ts is that is not a three letter library 😂😂
@davidtoska77913 жыл бұрын
@@Norfeldt hehe... Good point..:)
@RemotHuman Жыл бұрын
Why do you have to infer the type from the zod schema, why can't you infer the zod schema from a type? And why isn't this built in to typescript? (I'm not saying every time, I'm just saying they should add a isType() function which will compile into something like zod). The way it is now zod has basically reimplemented typescript types in another syntax and ts developers now have to learn both (not that it seems that hard but still)
@kornelss2 жыл бұрын
Hi jack, sorry OOT question, what theme does your zsh used?
@jherr2 жыл бұрын
robbyrussell?
@justfly19843 жыл бұрын
How do you remove that extra code in production build?
@jherr3 жыл бұрын
process.env.NODE_ENV check would remove if from the bundle if that's the way you want to go. Honestly, I would use this type of code sparingly and at the edges of your system where you accept the external input. Once it's validated then subsequent calls should not re-validate the input.
@miklosnemeth85663 жыл бұрын
@@jherr I fully agree, I'd never ever remove data validation on system boundaries. Within the system a meticulously elaborated static compile time type system is perfectly enough, but on the boundaries, no way I'd allow my team to remove the safety belts. In our project currently we have three subcontractors, as SA, I told them that I don't want to see null pointer exceptions, that would be an enormous shame on that team.
@alii43342 жыл бұрын
can we replace schema JSON validators such as AVJ schema validator with Zod?
@jherr2 жыл бұрын
You could I suppose, but AVJ runs a lot faster.
@CyLvCompetetiv3 жыл бұрын
you could also just use classes instead of interfaces and do Assertions in the constructor (like being talked about in the tactical Domain Driven Design patterns)
@miklosnemeth85663 жыл бұрын
I think the key point here was that when you have the declarative schema definitions, these tools provided you both static/compile time as well as automatic runtime data validations with meaningful messages. Brutally great tools. They are must for business applications.
@Jrrs20072 жыл бұрын
Io-ts npm package does runtime checking I believe?
@alejomakevids3 жыл бұрын
Thank you man.
@jherr3 жыл бұрын
Thank you for the comment! Love you user name. :)
@Iandavidandrino Жыл бұрын
Legend
@HisokaXKuroro12 жыл бұрын
That's why in my opinion other languages with runtime type checking should be used on the backend rather than TS/JS
@Balance-83 жыл бұрын
Could you do a video on nx workspaces and your opinion on it?
@jherr3 жыл бұрын
kzbin.info/www/bejne/jYDJfWinZ62tpKs and kzbin.info/www/bejne/eKjCpaCNesaUf7c
@Balance-83 жыл бұрын
@@jherr Thanks! You are the best at replying, I really appreciate it
@himankshu5 ай бұрын
hey whats that theme? so cool
@mandalorian99 Жыл бұрын
kneel before Zod just killed me :D
@airkami4 ай бұрын
No one may ever see this, but if anyone can tell me if there it is still necessary to use the nullable ? when using zod, that would be very helpful to know.
@jherr4 ай бұрын
Can you give a time reference in the video?
@GhanashyamSateesh3 жыл бұрын
Its a bit surprising to me that TypeScript doesn't offer this on its own... A validate function / operator is practically common sense... MS!! Do it!
@jherr3 жыл бұрын
The only language that I know of that had support this kind of thing built in was Ada with it's preconditions and postconditions. But even then, you actually had to validate the input yourself. You were just given the opportunity to. Strongly typed languages like C/C++, Java, C#, all expect you to interpret the input properly. For example, if you are reading a file as binary and storing as integers you are just telling the compiler to trust you that the file actually has data formatted as integers in it. It's the same thing here. The compiler is trusting you that you understand the whole data chain and can guarantee that the data is structured as you say it is. IMHO, it's too much to expect the compiler to write this kind of code for you. There are too many options with it. These validation libraries are not small, even when you pair them down to just the kind of checks that TypeScript enforces at compile time.
@GhanashyamSateesh3 жыл бұрын
@@jherr my argument here is I think only typescript guys can provide a clean implementation for validating interfaces... All other libraries must create their own techniques to make schemas and then that can be translated to TS but in what we really want it some way to get a validator from our TS types... And yes I'm aware TS by principle is compile time only and is designed to not add any runtime overhead from its features... But as the Lang matures, I think runtime functions can be added... Atleast as extensions...
@jherr3 жыл бұрын
@@GhanashyamSateesh Some what to add compiler-agnostic extensions would be very cool.
@victorlongon3 жыл бұрын
This are good options., But i feels like poor man's Graphql? I see the point though.
@jherr3 жыл бұрын
I see your point, but not everything is going to go through GraphQL, and this provides some options for non-GraphQL based data validations. And pretty intense validations at that, not just types, but ranges, regexes, type conversions, etc. You could use this mechanism to declaratively implement the Adapter pattern from the GoF Design Patterns book.
@victorlongon3 жыл бұрын
@@jherr yeap! I totally get it, and i see even a use case for me at work. We don't use Graphql (i have in other projects) and we have the types and interfaces in the client code, everything looks good, but when you get data from the CMS, well, it does not always look like what we want 🤣. My approach is to create a Interface that matches the data and wrap it with Optional and then use a lot of optional chaining. It works but it is kind of a hassle. In this case something light weight as zod to have a schema validation could be an option. I will have a look into it. I wonder how much size would that add to the bundle though.
@Jacek2048 Жыл бұрын
No modern languages have runtime typechecking? WTF?
@jherr Жыл бұрын
I don’t know about a categorical “none” but the languages I know type check at compile time.
@phantomapprentice67497 ай бұрын
Or just use C#
@eguoli3 жыл бұрын
你家在树林里面。。。
@jherr3 жыл бұрын
是的。我们喜欢这里。
@thatboyneedstherapy3 жыл бұрын
Around the 8:45 mark, what exactly did you do to surround your selection with quotation marks?
@jherr3 жыл бұрын
I literally just hit double quotes with that text selected. Hopefully that works for you.