Stop Wasting Time and Effort: Automate String Types with These TypeScript Tricks

[@eqprog]

This is the best typescript-related channel.

[@Typed-Rocks]

Thank you so much 🙏. Really appreciate it. 🤘😁

[@ivanbryukhov]

This is genius! Man, you're great! You always bring up something extraordinary! Keep it up!

[@Typed-Rocks]

Thanks for the kind words. I will try my best 🤘

[@markcampbell2491]

On a par with Matt Pocock, quality content

[@Typed-Rocks]

Thank you. This is a huge honour to hear 🙏

[@frstylol]

Okay, you teach me something new about typescript every single time.

[@Typed-Rocks]

Thank you, really glad to hear 🙏👍

[@TheSP337]

Amazing work! I often find myself come to your videos to do something neat and advanced. I would love to see if you have any TS tips for React components, hooks, props - anything.

[@Typed-Rocks]

I‘m more of an Angular guy but I will look into it. 😁👍

[@Md_sadiq_Md]

Disclaimer: It's unlikely u get this type of example in real life is highly unlikely

[@Typed-Rocks]

It was found in the node util package type declaration file so this looks like a „real world“ example 😁. And I think types like these, which are copied, exist quite often to be honest.

[@Md_sadiq_Md]

@Typed-Rocks Uhh kinds agree Might look like I had seen it very few times

[@Caldaron]

swiss matt pocock ftw!

[@Typed-Rocks]

Thanks 😁

[@deatho0ne587]

Guessing each of colors has a CSS thing somewhere, so you would also still have to add `orange` roughly 4 times in CSS or maybe 1 time with some SCSS.

[@Typed-Rocks]

This is only used once as a type for the styleText in the utils. So in there you only need it once. But of course if you need it somewhere else, you would have to derive from it.

[@eqprog]

That’s what SASS (etc) is for.

[@deatho0ne587]

@@eqprog Which is why I clearly mentioned SCSS.

[@CyanureNeko]

Is things like this that makes me love TS more and more every day, just found about it recently and used it to force the user to send limit the user input to use in some object sizes, use variables only (-- or var(--...)), while I couldn't do something as strict as this video is still such a good example

[@Typed-Rocks]

Great idea👍

[@dave6012]

I was hoping you were going to do modifiers as well in a clever way, but I guess that’s an exercise left to the viewer 😄

[@Typed-Rocks]

Exactly 😜.

[@virtualfi]

Great video, love the channel. For discussion sake here is an argument why NOT change it and leave it in more original form. Understanding original version takes me literally 0 seconds. I see what is going on. For second version I need to stop foe some time, analyze it, "Oh... nice clever i get it now, clever!" that is real con. If you need to stop to look at simple stuff you attention is driven away from essentials. In real life scenario especially on bigger project where a team of ppl is involved I would stick to simpler version as a rule of thumb.

[@gilbes1139]

So the type named Bright contains no bright colors. uhh...

[@Typed-Rocks]

Naming things is the hardest part in programming 😜

[@ValorHeart]

Nice!

[@Typed-Rocks]

Thanks! Really appreciate it🙏

[@wvovaw3052]

And keep in mind that the Typescript Language Server may go brr if your template type is too complex

[@Typed-Rocks]

TypeScript will stop at a maximum recursive depth of 1000 so this is a safety net 😁. Of course you can make the ts server make sweat a bit, but it is really capable