Fun with advanced TypeScript

Поділитися
Вставка

КОМЕНТАРІ • 209

  • @MrDimension0
    @MrDimension0 3 роки тому +219

    Guys, no need to wear those masks. I am sure your machines are protected by a proper antivirus

    • @BigBahss
      @BigBahss 3 роки тому +4

      That's what I thought at first but it became clear that they're sitting across from each other, so.

    • @thongle3612
      @thongle3612 3 роки тому +1

      also it considers everyone go with mask when outside

    • @Krusador42
      @Krusador42 3 роки тому

      @@thongle3612
      And that is just sick, you are brainwashed

    • @juqez6202
      @juqez6202 3 роки тому

      They are in the same room

    • @relaxingnaturevideos1203
      @relaxingnaturevideos1203 2 роки тому

      @@BigBahss so what? The mask mesh, that when you scale up the virus to one meter size leaves a few kilometer wide gaps to pass through, will protect them from a deadly infection with a killer virus, for which most people need a lab test to know they have it because they literally have no symptoms?

  • @francescociulla
    @francescociulla 3 роки тому +22

    I really love this video format! Congrats both!

  • @matheusspable
    @matheusspable 3 роки тому +7

    It's amazing to see people have fun, with something I struggle to do in my everyday life. Power to you guys.

  • @ammireddy484
    @ammireddy484 3 роки тому +5

    Typescript hidden capabilities are amazing. It's totally unique to typescript.

  • @inephekt
    @inephekt 3 роки тому +9

    This is inspiring! I hope you guys keep creating these advanced TS videos.

  • @esirei
    @esirei 3 роки тому +6

    I still remember when you weren't using typescript, now you're so good at it.

  • @nenino265
    @nenino265 3 роки тому +17

    If possible, could you give us some articles or websites where we can learn more about these advance types? Thanks.

    • @SogMosee
      @SogMosee 3 роки тому

      Go to the typescript discord

    • @Funhouse4420
      @Funhouse4420 2 роки тому

      Search for “typescript type challenge”

  • @JohnFarrellDev
    @JohnFarrellDev 3 роки тому +77

    That was amazing, where are these communities I can learn about Advanced TypeScript?

    • @dmcdcm
      @dmcdcm 3 роки тому

      Same!

    • @JohnFarrellDev
      @JohnFarrellDev 3 роки тому

      @@dmcdcm Check out his video from yesterday called "TypeScript Challenges"

    • @SogMosee
      @SogMosee 3 роки тому

      Go to the typescript discord

    • @stopPlannedObsolescence
      @stopPlannedObsolescence 3 роки тому

      @@SogMosee where :v

    • @SogMosee
      @SogMosee 3 роки тому

      @@stopPlannedObsolescence Here is where all the creators of react and redux congregrate, and where you can find the best typescript info in the typescript room: discord.gg/eJDKVjYB. And here is the actually typescript community, but I think is less good and less active than the react one: discord.gg/quBBKPu8

  • @rkrupinski
    @rkrupinski 3 роки тому +1

    const a = [1,2,3,4,5] as const
    type IndexOf = {
    [K in keyof T]: T[K] extends T[number] ? K : never
    }[number]
    type Test = IndexOf // "0" | "1" | "2" | "3" | "4"

  • @anaselmrabet7728
    @anaselmrabet7728 3 роки тому +1

    will : what is the type of b ?
    Jonny : is it 1 ?
    will : WUT ?

  • @hieudaongoc9767
    @hieudaongoc9767 3 роки тому +17

    This guy deserves more views

  • @user-hk3ej4hk7m
    @user-hk3ej4hk7m 3 роки тому +3

    It reminds me of the cpp templating system. It's incredible what you can do at compile time.

    • @PedroHenrique-qh3bl
      @PedroHenrique-qh3bl 2 роки тому

      Yess, the name of this is metaprogramming .. In the c++ metaprogramming it's more powerfull but c++ you dont able to do concatanation i guess 🤔

  • @pezo1919
    @pezo1919 3 роки тому

    I'd be happy to see a course on Advanced typescript from you. I am not kidding. [Dependent types] are the future for sure, you could reach masses! Please do it! :)

  • @droid806
    @droid806 3 роки тому +1

    It's all fancy and laughter until you have to debug this sh.t

  • @arcticheroh
    @arcticheroh 3 роки тому +27

    This should've probably been stated for everyone else but they're in the same room and were required to wear masks. Hope this helps anyone who was having headaches from trying to figure out why they'd wear masks inside and on an online chat.

    • @Cognitoman
      @Cognitoman 3 роки тому +1

      Lol

    • @mblackritter
      @mblackritter 2 роки тому

      Anyway: Idiotslavemasks?! *INSANE!* ✊🏻 🙀 🇩🇪❤🇷🇺

  • @mohammadgharouni64
    @mohammadgharouni64 3 роки тому +1

    very good video. looking forward to see future episodes

  • @DrJimmyBob
    @DrJimmyBob 3 роки тому +1

    Subbed. This is so cool. I think you blew my mind a few times there 🧠🎆

  • @runo9
    @runo9 3 роки тому +1

    Very interesting video. For the people that like to tinker
    const a = [1, 2, 3, 4, 5] as const
    const indexOfA: Exclude = "1";
    This almost seems to work to but somehow the array entries are converted to strings 🤨

  • @baibhabmondal1740
    @baibhabmondal1740 3 роки тому +9

    And I thought I knew TS

  • @florimmaxhuni4718
    @florimmaxhuni4718 3 роки тому

    I think you will love also F# if you like typescript because they have some concept of type system.

  • @pbuderaski
    @pbuderaski 2 роки тому

    That's very interesting you can do things like that with ts! It's is also incredibly unreadable and confusing! ;O

  • @omarojmb
    @omarojmb 3 роки тому

    Absolutely great video

  • @eluagoni
    @eluagoni 3 роки тому

    This is pretty cool, can't lie.

  • @thisweekinreact
    @thisweekinreact 3 роки тому +2

    In FP if you want to iterate over a and b arrays at the same time it's common to use a zip operator, I guess it would make that strict rule happy 😉
    BTW was wondering if "typeof b[number]" wouldn't be simpler than a recursion? In this case that seems overkill
    You can nest eslint configs in subfolders, but not sure it's possible with TS

    • @kylekhoury8497
      @kylekhoury8497 3 роки тому

      That would give the values of b and not the indices

  • @lifeok6188
    @lifeok6188 3 роки тому +1

    Fantastic job mate 👌

  • @TDefton
    @TDefton 3 роки тому

    Typescript is amazing 😍

  • @hugodsa89
    @hugodsa89 3 роки тому +1

    More typescript videos please 🙏🏻

  • @sirdrzamich
    @sirdrzamich 3 роки тому

    Amazing video, learned a ton from that, thanks! Having one question though: am I right thinking true that `extends` keyword in generics behaves more or less like `===`?

  • @novakevin
    @novakevin 3 роки тому +1

    FYI the volume is really quiet in this video

  • @pedeeli177
    @pedeeli177 3 роки тому +2

    i have to write IndexOf

    • @DavidAguileraMoncusi
      @DavidAguileraMoncusi 3 роки тому +1

      That's because of your linter and probably this rule: github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/array-type.md
      I bet that they'd get the same error had they kept eslint enabled.

    • @pedeeli177
      @pedeeli177 3 роки тому +1

      @@DavidAguileraMoncusi thanks

  • @inaccessiblecardinal9352
    @inaccessiblecardinal9352 3 роки тому +2

    Typescript is Turing complete (I believe), so you should have all the basic program control functionality available to you. Pretty sweet, but, like the Goldblum character says in Jurassic Park: you could, but you didn't bother to ask if you should. I try to not get over my skis with this degree of cleverness. But...in a couple of years, who knows?

  • @catspubg9066
    @catspubg9066 3 роки тому

    it will be nice if make every week episode like this as tricky in the typescript

    • @wcandillon
      @wcandillon  3 роки тому

      yes it's definitely coming :)

  • @basarat
    @basarat 3 роки тому +1

    Nice video 🌹

  • @kresimircosic3753
    @kresimircosic3753 3 роки тому

    This is so awesome.

  • @rtbchef
    @rtbchef 3 роки тому +1

    What was the typescript challenges project that you mentioned?

    • @wcandillon
      @wcandillon  3 роки тому

      you are showing it here: ua-cam.com/video/Ds0L0mQE96Y/v-deo.html

  • @sevilxx
    @sevilxx Рік тому

    What is the TS puzzle website he was referring too???

  • @juanjegarcia3957
    @juanjegarcia3957 3 роки тому +1

    it can just be `typeof a[number];`

  • @charithagoonewardena3095
    @charithagoonewardena3095 2 роки тому

    Before watching: I know enough about TypeScript, let's see whats new...
    After watching: I don't know anything about TypeScript.

  • @BrasilEmFatos
    @BrasilEmFatos 3 роки тому +4

    I came faster than Bolt here

  • @jeremyashcraft2053
    @jeremyashcraft2053 3 роки тому +3

    How dare you not wear two masks

  • @ShivamKumar-ty7zf
    @ShivamKumar-ty7zf Рік тому

    does anyone know the name of the website for typescript puzzles he was talking about at 8:03

  • @aleks6331
    @aleks6331 3 роки тому

    which typescript option I need to enable to support inline type setting, for example "const a = [1,2,3] as const;" ?
    I am always getting unexpected token error.

    • @thomasersosi4595
      @thomasersosi4595 3 роки тому

      afaik none. What TS version do you use?

    • @aleks6331
      @aleks6331 3 роки тому

      @@thomasersosi4595 Typescript 4.0.3 with "react-scripts' 4.0.1.
      Must be something with my config, as new CRA app is accepting this. :/

  • @farfazzi
    @farfazzi 3 роки тому

    how come i get type instantiation is excessively deep and possibly infinite error? both on 4.1 and 3.9... thanks

  • @alunoazul
    @alunoazul 3 роки тому +1

    You are here to read the comments about them wearing masks. Admit it.

  • @nderezic
    @nderezic 2 роки тому +1

    Soon we will be having opensource codebases written in TS which look like black magic. How are we supposed to be able to understand any of that? Isn't that an antipattern?

    • @wcandillon
      @wcandillon  2 роки тому +1

      yes it's an anti pattern and what we showed in this video shouldn't be used. We do hope that tuple support improves in the future.

  • @josuevalencia3712
    @josuevalencia3712 2 роки тому

    WHAT IS THE ROADMAP FOR DIGGING INTO TYPESCRIPT!! ???

  • @kris10an64
    @kris10an64 3 роки тому

    How are the editor animations (cursor position change, select text animation) so smooth? An extension?

  • @mephistotel87
    @mephistotel87 3 роки тому

    Hello, William! Can you share your way to fast typing and navigation in VS Code?
    Tried multiple times, but without success. I think think this video will be highly useful.

    • @wcandillon
      @wcandillon  3 роки тому

      does this video help ua-cam.com/video/5ByuWilIMRg/v-deo.html ?

    • @mephistotel87
      @mephistotel87 3 роки тому

      @@wcandillon I've seen this video, but I meant more about direct keystrokes typing. How you navigate between code and functions. I see you code and navigate very fast. Do you use Vim mode or whatever? Custom keybindings?

  • @brianevans4
    @brianevans4 3 роки тому +3

    very nice video. learnt so much. i just struggle to hear you with the mask. would be 10x better unmasked imo

  • @yadusolparterre
    @yadusolparterre 2 роки тому

    It's really hard to follow when all you use is a, b, c, Foo, bar.
    It would be easier to use animals, fruits or something closer to real life

  • @hell0kitje
    @hell0kitje 3 роки тому +1

    What is name of this color syntax?

  • @aprilmintacpineda2713
    @aprilmintacpineda2713 3 роки тому

    TypeScript is basically coding for autocomplete, so TypeScript could have been a programming language for autocomplete.

  • @zlackbiro
    @zlackbiro 3 роки тому

    I JavaScript, you just need to code and is keeping to work. Now i dont even need to test my code. I see outputs in my head.

  • @MukulJainx
    @MukulJainx 2 роки тому

    Can anyone help with the link of puzzle site? thanks!

  • @JainNamit
    @JainNamit 3 роки тому

    There was issue in sound many times, I was not getting what you have said few times

    • @wcandillon
      @wcandillon  3 роки тому +1

      Sorry that was because of the masks, we should et this solved soon.

    • @JainNamit
      @JainNamit 3 роки тому

      @@wcandillon Never Mind! Actually the issue was, I didn't understand the name of operator that was the exclamation mark in the end of variable. But I googled and got to know about it after few attempts. Non-Null Assertion Operator.

  • @nsuid7499
    @nsuid7499 2 роки тому

    Does anybody know which website is he talking about at 8:03

  • @cat-.-
    @cat-.- 3 роки тому +1

    This is so cool but so janky at the same time lol

  • @danielpedersen1688
    @danielpedersen1688 3 роки тому

    Can someone please tell me what theme and font they're using here? I would like to know so I can use it in my own editor, thanks!!! and how do they get the arrow to look like that?

    • @wcandillon
      @wcandillon  3 роки тому

      I was using Jonny's laptop so I'm not sure which theme is using, will ask

    • @danielpedersen1688
      @danielpedersen1688 3 роки тому

      @@wcandillon Alright thanks for checking, looking forward to hear back.

  • @cruelplatypus67
    @cruelplatypus67 3 роки тому

    What theme are you using for vscode?

  • @Alperic27
    @Alperic27 3 роки тому

    Due ... forget the CH kbd... been typing blind for 10 years (set you kbd to us-en regardless of what the keys say 😉)

  • @hosseinshourabi398
    @hosseinshourabi398 3 роки тому

    Perfect!

  • @saulomiqueias4267
    @saulomiqueias4267 3 роки тому +2

    what is the vs code theme?

  • @Leoo204
    @Leoo204 3 роки тому +1

    what theme are you using ???

    • @zlatkoiliev8927
      @zlatkoiliev8927 3 роки тому

      I found it, its called GitHub Theme, and there is Light and Dark version, he is using Dark obviously :D

  • @neiker234
    @neiker234 3 роки тому

    11:44 why it can be 1? should be `2 | 3 | 4 | 5 | undefined`, right?

    • @VictorNascimentoo
      @VictorNascimentoo 3 роки тому

      Because the hosts comment was misleading. When you do i+1 there you are making TS widen that type back to number.

  • @haakonness
    @haakonness 3 роки тому

    Consider my mind blown!

  • @Blast-Forward
    @Blast-Forward 2 роки тому

    This insane. I have to admit that I still don't understand.
    Does it actually have any practical relevance?

    • @wcandillon
      @wcandillon  2 роки тому

      At the moment no but hopefully in the future.

  • @kevinkkirimii
    @kevinkkirimii 3 роки тому

    Ah there's a level of strictness that's not fun.

  • @xBrainZy
    @xBrainZy 3 роки тому

    What's the difference between TS and JS?
    Is TS another framework of JS?

    • @srijanpaul
      @srijanpaul 3 роки тому

      It's a programming language that adds static typing to JS (like java/C++).
      Basically you write code in a language that's similar to JS, and your code is converted to JS by the TS Compiler.

  • @zlatkoiliev8927
    @zlatkoiliev8927 3 роки тому

    What is the colour theme you are using please?

    • @omgmyworld
      @omgmyworld 3 роки тому

      I think it's "GitHub Dark"

  • @cladverts
    @cladverts 3 роки тому +1

    ok. where can you use this knowledge in business?

    • @giovani5586
      @giovani5586 3 роки тому +1

      I wouldn't say it's KISS compliant, so, you wouldn't...

  • @duongg8861
    @duongg8861 3 роки тому

    Can I have your vscode theme settings?

  • @ibraheemghaffar8713
    @ibraheemghaffar8713 3 роки тому

    that's a nice theme. What is it?

  • @SuperOazy
    @SuperOazy 3 роки тому

    C#, Java and TypeScript started to be so complex due to 'types'.. I think it is the time to invent another way to type checking and tooling.

  • @TheMatthegamer
    @TheMatthegamer 3 роки тому +2

    How do u get the effect that the indicator in VSCode is animated and moving around with a transition? Is that an extension?

    • @rand0mtv660
      @rand0mtv660 3 роки тому +2

      Just open VSCode settings UI and search for "cursor". You should find all options you want there.

  • @rajeevsinxh
    @rajeevsinxh 3 роки тому

    what vscode theme r u using?

  • @tmbarral664
    @tmbarral664 3 роки тому

    Powerful, yes, but far from being easily grasp, sadly. This is like C++ templates. Not clear and easy enough to use so at the end, it won't be used that much. Let's hope they will work on that a bit more.

  • @christianlauridsen4637
    @christianlauridsen4637 2 роки тому

    Who are you gonna infect through UA-cam?

  • @iamavolk
    @iamavolk 3 роки тому +1

    Safety is top priority, right? Next time wear two each. I feel a bit more safe that way.

  • @黃光禹
    @黃光禹 3 роки тому +3

    witchcraft! 🤯

  • @g_marquitos
    @g_marquitos 3 роки тому

    Nice video!!! I have a question, why I can't use array descontruction in this case stackoverflow.com/questions/59175342/typescript-type-assertion-for-union-of-tuples-how-to-assert-only-one-member
    I can't find a nice solution for this

  • @duongtran642
    @duongtran642 3 роки тому +1

    Uh you guys wear mask indoor?

  • @hemantnigam4559
    @hemantnigam4559 3 роки тому

    Which theme are you using?

    • @zlatkoiliev8927
      @zlatkoiliev8927 3 роки тому

      I found it, its called GitHub Theme, and there is Light and Dark version, he is using Dark obviously :D

  • @DGDG0000000
    @DGDG0000000 3 роки тому

    what i can observe to really make sens is to compare how much it is useless to loose time for a type restriction in a non strict typed language at the end time than to wear mask in his room alone to chat online.
    it is crasy as "procrastination" the way you loose yourself in a non-sens own so virtual fucked world.

  • @goldengiorno6890
    @goldengiorno6890 3 роки тому

    Too much fun for me

  • @jasurb3k
    @jasurb3k Рік тому

    what is this VS theme?

  • @jmr218
    @jmr218 3 роки тому

    "Fun" haha
    Thanks for the video

  • @filemonek123
    @filemonek123 Рік тому

    ultimately - whats the point?

  • @eliseumds
    @eliseumds 3 роки тому

    Just don't do those things haha Still cool though, conditional types can be quite useful, specially with React.

  • @jonesaa2746
    @jonesaa2746 3 роки тому +3

    quality went down because of the mask. sounds all muffed like a muffin.. maybe a face shield?

  • @GCoda
    @GCoda 3 роки тому

    Hegel FTW

  • @lavisharma3210
    @lavisharma3210 3 роки тому

    What font do u use in vs code ?

  • @dav948
    @dav948 3 роки тому

    Gosh I miss Scala - none of these shenanigans needed for typed code you can actually rely on.

  • @trentonk1188
    @trentonk1188 3 роки тому +2

    If you record this without a mask people might actually be able to watch it.

    • @Krusador42
      @Krusador42 3 роки тому

      If only the mask wearing was ridiculous, but unfortunately it's more than that. They are also worse to understand this way.

  • @TheMzbac
    @TheMzbac 2 роки тому

    🤯

  • @pyroghost11
    @pyroghost11 3 роки тому +2

    more videos like this please, more typescript, more pair coding and discussion and take those bloody masks off...

  • @mainendra
    @mainendra 3 роки тому

    🤯🤯

  • @KunglawAdy
    @KunglawAdy 3 роки тому

    woooowww i didnt know you can disable eslint by doing that. thanks

  • @lipskorn1
    @lipskorn1 3 роки тому +2

    Awesome content guys, and thanks for using masks, I fell safer

    • @neomonkeyking
      @neomonkeyking 3 роки тому +1

      lmao felt safer ... if that's an honest assessment, you must be a silicon valley "engineer" who voted for Pelosi again.

    • @Krusador42
      @Krusador42 3 роки тому

      @@neomonkeyking Maybe it was meant ironically. Hopefully.

  • @jamestucker4800
    @jamestucker4800 Рік тому +1

    Why are these guys both wearing facemasks? Do they really think it transmits over the internet?

  • @marcjus4392
    @marcjus4392 3 роки тому

    Are you french? Cause i am