Тёмный
Typed Rocks
Typed Rocks
Typed Rocks
Подписаться
Everything fancy one can do in TypeScript can be found here
TypeScript 5.6: The Top 10 Features
15:53
Месяц назад
Комментарии
@sarmadajmal3602
@sarmadajmal3602 3 дня назад
Console Ninja?
@Typed-Rocks
@Typed-Rocks 3 дня назад
Its nice but it does not support Bun or Deno and only console logs and not expressions, for loops etc
@ibnkhaleedone
@ibnkhaleedone 5 дней назад
Quokka?
@Typed-Rocks
@Typed-Rocks 5 дней назад
It does not support Bun or Deno and has many to-pay features which are free here. But of course it‘s awesome
@BorisBrodski
@BorisBrodski 5 дней назад
Very cool and promising! I will definitely try it👍
@Typed-Rocks
@Typed-Rocks 5 дней назад
Looking forward to hear what you think about it. :)
@geekthegeek730
@geekthegeek730 5 дней назад
this is cool man! I wish there was a better icon for this on the sidebar
@Typed-Rocks
@Typed-Rocks 5 дней назад
Yes I know, doesnt look that nice. Will update it really soon 😁
@RealNaisuCinema
@RealNaisuCinema 5 дней назад
What if your codebase is millions of lines of code? Is it still going to be faster to run this?
@Typed-Rocks
@Typed-Rocks 5 дней назад
It only runs the code needed from this file. But of course this is mainly for testing stuff.
@shashydass4114
@shashydass4114 5 дней назад
Looks incredible! I pay for Quokk abut will definitely be giving this a try. OK so I tried it now and it is incredible! The 'show order' feature is so useful. And top level async await?! Magic! I also write Clojure code and one thing that CLojure has is a fantastic REPL. This extension really closes the gap and makes programming in Typescript very much more enjoyable. Thank you!
@MrJettann
@MrJettann 5 дней назад
Man, it's amazing! Definitely will use it!
@Typed-Rocks
@Typed-Rocks 5 дней назад
Thank you 🙏
@sonik121
@sonik121 5 дней назад
This is really cool. Any chance of it somehow helping with react component development to see what renders/fetches/data are triggering in which order?
@Typed-Rocks
@Typed-Rocks 5 дней назад
I would have to check, but I think currently it would be hard to achieve
@TheSysmat
@TheSysmat 5 дней назад
How fast is it
@Typed-Rocks
@Typed-Rocks 5 дней назад
It should be almost instant. As soon as you save or run it. It‘s as fast as If you run node from the commandline
@bryson2662
@bryson2662 6 дней назад
This is cool as hell. Is there a neovim version?
@Typed-Rocks
@Typed-Rocks 5 дней назад
Currently not. But I was thinking of looking into it 😁
@irishbruse
@irishbruse 6 дней назад
Does this work with tsx, Quokka does the same thing as this extension and works with tsx(react not the cli lol) but I find quokka bloated so would love to replace it with this
@Typed-Rocks
@Typed-Rocks 6 дней назад
@@irishbruse I would have to check. I‘m not really sure. But you can give it a try 👍. If not just message me and I will try to support it. Quokka is nice but many features are Pro which cost money. That was the main incentive why Ive created that. (Imports of code, runtime support etc)
@jimmy.im-kp
@jimmy.im-kp 5 дней назад
not work tsx, you can try console ninja
@irishbruse
@irishbruse 5 дней назад
​@@Typed-Rocks good to know would love to see tsx added would be handy to debug react utility functions, its the only reason I use quokka.
@praktycznewskazowki6733
@praktycznewskazowki6733 6 дней назад
It is available in webstorm?
@Typed-Rocks
@Typed-Rocks 6 дней назад
@@praktycznewskazowki6733 there is a version available but its not that intuitive to setup. But I will see what I can do in the next days. You can download it and try it out. Its also called Typescript Worksheet there
@wertig6925
@wertig6925 6 дней назад
keep up the nice work!
@Typed-Rocks
@Typed-Rocks 6 дней назад
Thank you 😊
@mamad-dev
@mamad-dev 9 дней назад
jesus, even ai cant generate this
@Typed-Rocks
@Typed-Rocks 9 дней назад
We should be glad. That means it can‘t create such unreadable code :P
@mamad-dev
@mamad-dev 9 дней назад
@@Typed-Rocks im actually impressed by your abilities in writing types in typescript, good job man
@Typed-Rocks
@Typed-Rocks 9 дней назад
@@mamad-dev thanks man, really appreciate it
@juanferrer5885
@juanferrer5885 11 дней назад
type snakeCase< T extends string, Acumulator extends string = "" > = T extends `${infer First}${infer Rest}` ? First extends Capitalize<First> ? snakeCase<Rest, `${Acumulator}_${Lowercase<First>}`> : snakeCase<Rest, `${Acumulator}${First}`> : Acumulator; type camelCase<T extends string> = T extends `${infer Before}_${infer After}` ? camelCase<`${Before}${Capitalize<After>}`> : T;
@notkamui9749
@notkamui9749 11 дней назад
This won't accept unary prefix operators (such as -, as in -1), which is fine. However, what's not fine is that it will also accept such expression: 3 3 + 2
@Typed-Rocks
@Typed-Rocks 11 дней назад
Right, we would need to check for spaces between numbers. I will update my github later today
@weeb3277
@weeb3277 11 дней назад
this gives me an error: -2+2
@Typed-Rocks
@Typed-Rocks 11 дней назад
I will fix the code on GitHub 🙏
@a.i.8480
@a.i.8480 12 дней назад
I'm impressed. Next crazy thing is to create a type to validate a whole TypeScript syntax. Let's make a full circle!
@Typed-Rocks
@Typed-Rocks 12 дней назад
That would be next level 😁
@balaclava351
@balaclava351 12 дней назад
I feel like I've just leveled up my TypeScript skills. You're a great teacher. Thanks!
@Typed-Rocks
@Typed-Rocks 12 дней назад
Many thanks. That is really kind of you. Glad you like my presentation style :)
@juanferrer5885
@juanferrer5885 12 дней назад
Your content is awesome. Thank you!
@Typed-Rocks
@Typed-Rocks 12 дней назад
Thank you 🙏
@Noam-Bahar
@Noam-Bahar 13 дней назад
Looks incredible!!! Currently I'm working on a project that already has Yup implemented. I don't need to install another validation library. Are there an openapi generators for other validation libraries, specifically Yup?
@Typed-Rocks
@Typed-Rocks 13 дней назад
Sadly I don‘t know. The only thing I found is a small lib on github called openapi-yup-generator which is quite old
@AK-vx4dy
@AK-vx4dy 13 дней назад
I see one problem.... if i'm not wrong, error message will be as "clear" just like C++ template errors...maybe not as bad but still...
@Typed-Rocks
@Typed-Rocks 13 дней назад
100%, I would not want that in production code
@AK-vx4dy
@AK-vx4dy 13 дней назад
Seeing all this magic i really don't understand this moaning of libraries authors that they have a problem with TypeScript and types... clearly just skill issue 🤣
@Typed-Rocks
@Typed-Rocks 13 дней назад
Or maybe they want to keep their sanity 😁
@AK-vx4dy
@AK-vx4dy 13 дней назад
Are you sure this is still TypeScript ? Maybe Prolog or Haskell or Verilog ? ;) I will stay in safe machine code / assembly space.
@Typed-Rocks
@Typed-Rocks 13 дней назад
Maybe we can program a Haskell compiler in types? 🥹
@Typed-Rocks
@Typed-Rocks 13 дней назад
Just found an issue with the code. We need to use „false“ instead of „never“ in the „CorrectStart“ type because never extends all types. Thanks for pointing that out. Also we need to add the "(" in the AllowedStarts. Checkout my github repository for the newest code and feel free to send a pull request when you find other errors: github.com/typed-rocks/typescript/blob/main/calculator.ts The
@tngerik14
@tngerik14 13 дней назад
Mindblowing stuff again :) I noticed an issue: although operators weren't set as allowed starts (although minus should be as a sign of a number) the expression '/5+3' is valid but it clewarly shouldn't be the case. My solution was this: type CorrectStart<T extends string> = T extends ... ? First<Remaining> ... ? true : never : false // was 'never' before The last word was the only change. I don't know why this works but it does
@tngerik14
@tngerik14 13 дней назад
it is hard for me to wrap my head around the decision, when to return a boolean or the type itself/never
@Typed-Rocks
@Typed-Rocks 13 дней назад
You are right. We should not use „never“ because it extends everything. Just both never in CorrectStart with false. Thank you for pointing that out 🙏
@tngerik14
@tngerik14 13 дней назад
@@Typed-Rocks but both never to false leads to expressions starting with "((" to be invalid
@Typed-Rocks
@Typed-Rocks 13 дней назад
@@tngerik14 Yes, absolutely, I've updated the code on github. We need to also allow a "(" at the values of AllowedStarts: github.com/typed-rocks/typescript/blob/main/calculator.ts
@IlkkaHarmanen
@IlkkaHarmanen 13 дней назад
"Hope you learned something useful today". Not sure about the useful bit, but otherwise I did learn something 🤣
@geeksven
@geeksven 13 дней назад
You need help xD But awesome job :)
@Typed-Rocks
@Typed-Rocks 13 дней назад
All is lost at this point :D. But glad you liked it.
@AK-vx4dy
@AK-vx4dy 13 дней назад
Yes... like Big Mike said "Just stop it. Get some help."
@snatvb
@snatvb 13 дней назад
how did you check what is the result of type? it's amazing!
@Typed-Rocks
@Typed-Rocks 13 дней назад
You mean the //^? Its a plugin for IntelliJ called „WiTT“ I‘ve created. You can download it from The Jetbrains Marketplace for free.
@praktycznewskazowki6733
@praktycznewskazowki6733 13 дней назад
It's so difficult, but so powerful, great!
@abdul-hameedmaree881
@abdul-hameedmaree881 13 дней назад
finally, someone did a good programming video that is not useless or clickbait. Awesome work 🎉
@Typed-Rocks
@Typed-Rocks 13 дней назад
Thank you. I try my best to fulfill whats on the thumbnail 😁
@RutsuKun
@RutsuKun 13 дней назад
Are we already entering an era in which we will take longer to write types than final code?
@Typed-Rocks
@Typed-Rocks 13 дней назад
It‘s happening as we speak 🤘
@mightyhelper8336
@mightyhelper8336 13 дней назад
You basically have a mini compiler frontend. Now you gotta make it actually compute... Or make a piece of code that generates this based on a generic language grammar. This way, if you manage to get the typescript syntax working, you can run typescript from a string, at compile time... Thinking about this a bit more, if you add some sort of interface to that ts interpreter, you could produce some actual types at compile time as output of your inline ts code. But wait, what if you run this ts compile inside of itself...
@Typed-Rocks
@Typed-Rocks 13 дней назад
The possibilities are endless 😁
@MrJettann
@MrJettann 13 дней назад
That was nuts! Extremely unusable, but extremely enjoyable! Let's follow it by something real life usable!:)
@Typed-Rocks
@Typed-Rocks 13 дней назад
I will. Thanks 🙏
@muchis
@muchis 13 дней назад
my head 🤯
@Typed-Rocks
@Typed-Rocks 13 дней назад
So was mine 😁
@TianYuanEX
@TianYuanEX 13 дней назад
This is actually peak, great job dude!
@Typed-Rocks
@Typed-Rocks 13 дней назад
Thank you, appreciate it 😁
@IbrahimAbdallah-tr4wq
@IbrahimAbdallah-tr4wq 16 дней назад
Love your content, practical and straightforward to the point, keep up the good work 👏
@Typed-Rocks
@Typed-Rocks 16 дней назад
Thank you. Really kind of you 🙏
@jordyperez9969
@jordyperez9969 16 дней назад
Do you have a video that talks about conditional properties, for example that if in a function I send a specific prop that another one is automatically required, and if it was not sent then the other prop is kept as optional or can even be done with more props
@Typed-Rocks
@Typed-Rocks 16 дней назад
I don‘t have one currently but let me think about making one 🙏
@jordyperez9969
@jordyperez9969 16 дней назад
@@Typed-Rocks I'll be waiting for the video man. Thanks
@blackbeardDevs
@blackbeardDevs 17 дней назад
The more I watch your videos the more I realize I don’t even know any typescript
@Typed-Rocks
@Typed-Rocks 17 дней назад
You absolutely know TypeScript, but maybe only use it like normal people ;)
@designerjehovah4453
@designerjehovah4453 17 дней назад
good to know. I wonder though, is this better than using trpc? Excluding the fact that I may be part of a team that is already using OpenAPI, I want to understand when I would use this instead of trpc
@Typed-Rocks
@Typed-Rocks 17 дней назад
It always depends but if you have other languages for the backend, you will be quite restricted
@DarioCooks
@DarioCooks 19 дней назад
You should be hired my Microsoft to fix typescript 🎉
@Typed-Rocks
@Typed-Rocks 19 дней назад
Thanks man 😁, really appreciate that you like it
@llhu90ll
@llhu90ll 19 дней назад
Thank you for sharing. It looks very handy, and for the db is there something like this?
@Typed-Rocks
@Typed-Rocks 19 дней назад
I don‘t know, actually, I will look into it 👍
@TianYuanEX
@TianYuanEX 20 дней назад
I remember looking into this really cool tool some time ago, but this is only useful if the backend devs bother to write a good openapi doc
@Typed-Rocks
@Typed-Rocks 20 дней назад
Or if they also generate their code from it 😁
@deatho0ne587
@deatho0ne587 20 дней назад
Just do `const obj ={a: 1, b: [234, 567], c:{d: {e: 890}}} as const;`, now that does not work with Date types but is 100% easier. Now the video is more about taking away things like setters from existed objects, which is useful.
@Typed-Rocks
@Typed-Rocks 20 дней назад
Yes, absolutely. When you have to do it once. But I really like the ability to have it more generic. But it as always depends :)
@loO5r
@loO5r 19 дней назад
Sadly this does not work anymore as soon as you add a type to your variable, e.g. `const obj: FooType = {a: 1, b:[234, 567] } as const;`
@deatho0ne587
@deatho0ne587 19 дней назад
Yeah, that is true.
@ThiagoVieira91
@ThiagoVieira91 21 день назад
Wow your channel was one of the best RU-vid recommendations. Astonishing content.
@Typed-Rocks
@Typed-Rocks 20 дней назад
Thank you very much. Really appreciate that. Keeps me going :)
@Caldaron
@Caldaron 21 день назад
whats the extension you use that shows the data next to the code in 3:36?
@Typed-Rocks
@Typed-Rocks 21 день назад
@@Caldaron It‘s called TypeScript Worksheet and you can download it on Jetbrains Marketplace or VSCode Marketplace. If you need any help setting it up, let me know :)
@rikrose
@rikrose 19 дней назад
@@Typed-Rocks A follow-up question - the error displayed at 5:54 - which plugin is doing that for you?
@LePhenixGD
@LePhenixGD 21 день назад
This is super practical ! Man TS is so powerful !!!
@Typed-Rocks
@Typed-Rocks 21 день назад
@@LePhenixGD Thank you 🙏 appreciate it
@MrJettann
@MrJettann 25 дней назад
Can you show us, how to use openapi to generate rtk query types and endpoints based on swagger? Would be so amazing
@Typed-Rocks
@Typed-Rocks 25 дней назад
I will look into it 👍
@cockpitconnect
@cockpitconnect 25 дней назад
TS-Rest is also interesting. It uses Zod to create API contracts and is compatible with frameworks like NestJS, React and VueJS
@Typed-Rocks
@Typed-Rocks 25 дней назад
Absolute! If you can create the API yourself then it would also be a nice choice. I like the language agnostic approach :)