8 TypeScript Tips To Expand Your Mind (and improve your code)

[@mattpocockuk]

The analytics on this video are crazy - most of you are coming from outside KZbin! So, I'd love to know - how did you find this video?

[@quangminhtran9968]

an admin share the post to Angular community im verry appreciate it !

[@agmmtoo]

Chrome homepage suggestion.

[@jrgenr]

Google app homepage suggestion

[@starsonahill5310]

Google News

[@sleepwiththefishes]

Shared by a colleague

[@ReggieJohnson87]

Wake up honey, a new utility type just dropped!

[@rafael.aloizio1769]

There he 1000 times

[@fkhan]

I woke up

[@joaodias1023]

Hahaha ​@@rafael.aloizio1769o Lá Ele em inglês fica estranho 😂

[@rafael.aloizio1769]

@@joaodias1023 eu tentei pelo menos kkkkkkkkkkk, e eu nem sei como falar, foi direto do reverso kkkk, se tu souber uma tradução melhor... Lança pra gente hehe

[@rahulspoudel]

😂😂

[@ernestofuentes9333]

Congratulations for your baby Matt. Now your life is going get another level. Thanks for de video.

[@Beni9819]

More advanced React/TypeScript channels are so hard to find. This is incredible. Keep it up!

[@SkyyySi]

Congratulations for your new wizard apprentice 😊 Btw I personally like this format, since having a little more context like this is nice over "single sentence + code.png"

[@devdribbles]

100% agree with this! Seeing the NoInfer example helped flesh out the related social media posts I saw earlier.

[@billiamdur]

@5:40, the Scottish(?) accent caught me off guard. 😀

[@ScriptCoded]

Was just about to go here commenting just that 😄

[@theseangle]

That's like a whole different person lol

[@MartinKapal]

Was he impersonating someone specific?

[@DemanaJaire]

You might not know, but Matt has a linguistic channel about English. He hasn't uploaded for years, but I think it's still there.

[@JuanMoisesTorrijos]

Congratulations on the baby. Since 90% of my social media consumption is KZbin, it's a good idea to share your knowledge on other SM platforms here.

[@Azoraqua]

Congratulations with the little one!

[@DarkStoorM_]

*New Wizard has joined the game.*

[@lachezarraychev1391]

Congrats on the baby! Wish you all the best, may the future wizard be healthy and bring you a lot of joy and happiness!

[@CarlosEstebanLopezJaramillo]

The NoInfer tip really saved my bacon, was able to reduce having to pass generics around, so I could cut a PR from 17 files to 12.

[@RNDev666]

love these videos! its kind of difficult finding the sweet spot with ts content, its usually either very basic or very advanced, but this video really hits it. great job!

[@dr-Jonas-Birch]

andy, thank you. yes i moved it to my advanced typescript playlist

[@FurryDanOriginal]

I used to prefer the following, rather than declaring a NoInfer type as it naturally resolves the problem, rather than trying to work around it: declare function createFSM(config: { initial: TDependentState, states: TState[] }): TState; Though, now that NoInfer is officially integrated into the language, I might start using it anyways.

[@KekskruemelReloaded]

Exactly what I wanted to say as well. In this particular scenario, using NoInfer feels like a smell. But I'm sure there are other, more useful use cases for it.

[@sp3ctum]

For some reason this just clicked for me. Had a bit of trouble understanding the other example in the video.

[@sp3ctum]

Ok I read the beta release notes for this feature. Looks like the justification is that TDependentState is created only to work around this limitation. So I guess it's semantically clearer not to declare a new generic type parameter.

[@cjcheshire]

Really cool, very happy for more of these. Especially as you’ve got other priorities to focus on too :)

[@JustinSBarrett]

Definitely like this format! I'm a relatively new subscriber, and also new to TS, so any little nuggets I can find-even those I might not fully understand now-are most welcome.

[@yaiirable]

Reusing content across platforms makes so much sense! Why would you not want to get the most out of the work you are putting in!?

[@JeremyKolassa]

I've always loved your channel, Matt, but I especially love it now that you've had the child. Having the child yourself, and not putting your wife through those nine months, is such a noble sacrifice. We don't see that very often these days. 😜 But seriously, congrats!

[@Glinkis]

Obviously he used nine women to get it down to a single month, just like how companies throw developers on a project to get it out faster. Makes perfect sense.

[@hartmut-a9dt]

I like that Your videos are short. Very cool & helpful!

[@diegodoumecq5144]

Wow, I've had to resort to multiple generics just to solve the inference problem (basically have one generic extend from the other). It worked but I hated that solution and this NoInfer is way more elegant. Bravo!

[@abbaskareem5281]

last tip is GOAT 🔥Thank you sir

[@ronildo]

Matt I really like this format by the way and congrats on your baby 🙏

[@rojka-_-]

Congrats man, best youtuber on typescript.

[@pythagoras281]

type TODO = any, such an elegant way to increase technical debt 😄

[@theseangle]

But at least it's easily locatable debt. Almost like an installment plan rather than a debt

[@krome305]

Congrats Matt! make sure to teach him typescript well :D

[@Caldaron]

love the layouting, you fully vertical on the side, looks great ;-)

[@cn-ml]

I actually didnt know the const type parameters tip. This could have saved me some trouble. I attempted to do this exact thing, but i annotated every function call with doSomething(["hello", "world"] as const) instead of using the parameter.

[@chrisstroud1915]

These were great, I'd definitely love to see more videos like this!

[@martiananomaly]

Congratulations on the kid, Matt 🎉

[@mantovani96]

Love it! I’ve been too busy lately, so I’ve missed some things on other social medias.

[@januszjanus813]

Horizontal view is dope, kudos 😃

[@yoyo26-34]

thks a lot for this video. NoInfer is clearly a game changer. what a powerfull utility type !

[@p10tube]

hello, I definitely want to see more of this :)

[@thisweekinreact]

Great tips as always! The using for mocks is going to be so convenient!

[@markilabot14]

Conngratulations Matt!!!!

[@MichiganTypeScript]

congrats on the baby!

[@ankitputhran]

Congratulations Matt !!!

[@Learnbynet]

3:00 i prefer use `type Any = any` this allow me to track all *any in my app and try to fix if ts allow it, sometime no, ts is not perfect.

[@әкрәм]

wish the best luck for the little one! ^^

[@ColinRichardson]

Nice Video.. Yeah, the example I was showing the the other day is pretty much exactly the same as what you had except backwards.. The array was not the source of truth, but the possible initials were.. :D Just with extra steps since I went through the Vue generic component types also :D It was nice to see NoInfer "just working" with it, with no additional complexity.

[@heavierthanlight7173]

Congrats Matt!

[@me_rinta]

Oh wow, didn’t know about `const T` stuff! Thanks for the tip!

[@zwanz0r]

Congrats dad! 🎉

[@Rebel101]

Amazing tips! Thank you Matt!

[@AbhiShake-pl3cf]

Const in generics and noinfer was so mind blowingly good. I had no idea about those. I had just left what i was doing thinking its not possible coz i didnt know about noinfer. How is the community implementation working exactly?

[@AbhiShake-pl3cf]

My bad. I was thinking of it as 2d array, but its just accessing T and infer delays evaluation

[@piyushaggarwal5207]

ElementRef looks awesome. I will try that.

[@codeChuck]

Finally, the man lives to his name and is applying the right tools for the job :) Congrats on a child! Well done! :D

[@RamonBalthazar]

We're less important than the baby and we understand it! Congrats and good luck with fatherhood!

[@jonathanbeaumont8878]

Congrats!! 🥳

[@Larry21924]

This is sheer brilliance. I had the pleasure of reading something similar, and it was sheer brilliance. "Unlocking the Brain's Full Potential" by Alexander Sterling

[@abdhelal]

Congratulations 🎉 for little wizard 😊

[@kedardinde]

Congratulations Matt

[@DimitarDanailov]

@mattpocockuk thank you very much for the content. Do you think is possible tweets to be added in the description ?

[@timmeehan2365]

That const generic is fire, I had never heard about it before. Always had to add "as const" in the params to achieve that narrow typing :/

[@SR-zi1pw]

Congratulations 🎉

[@biswaranjan6342]

Thanks for this informative video....

[@winglesschicken]

Not sure I understand the semantics NoInfer type. Can anyone explain the syntax please?

[@AmrouBouaziz]

The `NoInfer` is so cool! can you explain how the community solution works. It might be interesting to use the same techniques for another situation

[@dr-Jonas-Birch]

You create an array with one member and then you index into that array's member which returns the original input value. The computation makes it hard for TS to infer. -dr Jonas Birch, new ts wizard

[@AmrouBouaziz]

@@dr-Jonas-Birch that makes sense! Thanks wizard 🪄

[@deatho0ne587]

Like most of these and congrats. Hmm, the type TODO = any; it may be great for library code. But have a doubt in most Prod code it is needed since could just search for any and which should not be in most cases.

[@ronitgurjar5747]

Ohhhh thanks for this!🔥🔥🔥🔥

[@palrevesz8629]

Congrats on the baby ;-)

[@artyomtaranenko2267]

Yesterday I have a problem: why TS (or maybe declare types react) dosen't care about what i pass to useRef for input HTMLInputElement or HTMLDivElement, no any error, but if I try to pass HTMLAnchorElement I got an a error. Someone can explain me, what I do wrong?)

[@rafaveggi]

Congratulations!!

[@dealloc]

When moving from JS to TS when TS was almost fresh out the oven, we'd have an alias type called $TSFixMe for 'any'. That way it also didn't conflict with actual TODO comments :P

[@nofacee94]

You are the best.

[@SleepyPoutine]

How early do you plan on teaching your new little one coding?? 😊 Congrats 🎉

[@_PCode_]

Congrats!

[@alexanderwells51]

So many of these can just be solved with using enums... right? Ok not actual enums, but the enum-like objects u made in a recent video ; )

[@rafadydkiemmacha7543]

The parentheses are not necessary in (typeof roles)[number]. It works just fine with typeof roles[number].

[@adtc]

That "NoInfer" thing... where was it several days ago when I badly needed it?! Now I don't need it anymore, and I don't even remember where I did... lol Edit: I remember now, it was the props of a component, where TS was inferring T from the wrong prop. It's exactly what it was designed for!

[@AK-vx4dy]

Congratulations to mother, child & father :) Looking at my practice, time will be less and less as kid grow, at least for few years.

[@sunitjoshi3573]

Seems “using C#”…great tip anyways. Thanks

[@Dude29]

Post the link in the description to the PR you opened on the JSX repo

[@mattpocockuk]

Done!

[@Dude29]

🙏@@mattpocockuk

[@vrildox-to7ir]

Congrats

[@edgeeffect]

I like how you've got a tip to ignore `any` because you should NEVER use `any`.... and then another tip that makes good use of... erm... `any`. ;)

[@mattpocockuk]

shhhhhh

[@gidmanone]

The Typescript community is slowly but unknowingly creating another (ugly) javascript monster.

[@mattpocockuk]

That's no way to talk about my child

[@gidmanone]

@@mattpocockuk I'm sorry Daddy😃. but I'm sure you agree with me that they building up complexity, solving one problem with another. Looks like we are back in Javascript land (from the other end🥲)

[@rafadydkiemmacha7543]

Instead of using ElementRef, I like to hover mouse over an element to check its type.

[@blizzy78]

can you say "purple burglar alarm"? asking for a friend

[@jaydeepkarena]

Are you reading effective TypeScript?

[@mattpocockuk]

Yes, it's good! New edition coming this year I think.

[@indrazm]

Are you australian ?

[@mattpocockuk]

Are you Scottish? Only Scottish people think I'm Australian.

[@indrazm]

@@mattpocockuk I am indonesian, your accent was very close to my australian friends. lol. Thanks for the video btw. 🤍

[@aliumair6008]

man is hard working, but can he make TS simpler to understand. I believe things are way simpler.

[@libenhailu]

We want more...

[@6644guilherme]

I still cant compreheend infer now theyve made noInfer x.x

[@vitabramov89]

ComponentProps/ComponentPropsWithoutRef but at the same time ElementRef. Why not ComponentRef??? Agh, React....

[@KahyaHasan]

Wow

[@TankorSmash]

5:41 what in the world

[@poki6041]

Alien code XD

[@Killputin777]

you not explaining stuff. only showing

[@mattpocockuk]

What felt confusing? What left you with questions?

[@QwDragon]

Congratulations! I've found this version: type NoInfer = T extends infer U ? U : never; Is it better or worth then type NoInfer = [T][T extends any ? 0 : never]; ? Anyway, ts implemented it as intristic, so I think there were some reasons for that?

[@aramp]

put your insta in the description Matt

[@rushikeshg25]

Congrats Matt!