Matt Pocock, a TypeScript educator and author of Total TypeScript, became an evangelist for the programing language after searching for a solution for a project plagued by API contract issues. When TypeScript brought newfound confidence and increased velocity to the team, Matt never looked back.
Matt highlights the benefits of functional components and the seamless transition from class components to hooks, leading to a happier development environment for everyone involved. From improved error detection to real-time catching of potential issues, TypeScript provides an unmatched level of comfort and productivity for developers, making it a must-have in modern development. For developers like Matt, TypeScript is more than just a tool—it's an indispensable companion. His love for TypeScript inspired him to dedicate his career to teaching other developers how to adopt and leverage the language for optimal efficiency.
In this episode, Matt talks to Robbie and Chuck about his journey with TypeScript, his experience with React hooks, and advice on transitioning a team to Typescript.
- [00:49] - Introduction to Matt Pocock.
- [01:52] - A whiskey review: The Dalmore 12.
- [06:58] - Tech hot takes.
- [19:19] - When Matt started using TypeScript.
- [22:30] - Converting components to TypeScript.
- [29:29] - The biggest mistake people make with TypeScript.
- [33:07] - New features coming to TypeScript.
- [36:36] - Advice for teams hesitant to use TypeScript.
- [42:40] - Matt, Chuck, and Robbie discuss football and gaming.
- [48:32] - Matt's career as a voice coach.
[23:55] - “TypeScript gives you a different way of coding, and a different way is, you feel like you could just get away with anything.” ~ Matt Pocock
[25:21] - “For me, when I’m not using TypeScript, it feels like I’m coding in low power mode.” ~ Matt Pocock
[26:35] - “If someone gets really into TypeScript, they just love it, and they don’t stop loving it.” ~ Matt Pocock
- Matt Pocock
- Matt Pocock Twitter
- Matt Pocock YouTube
- Matt Pocock LinkedIn
- Total TypeScript
- The Dalmore 12
- Tailwind CSS
- Ryan Carinato
- Visual Studio
- TS Error Translator
- Magic: The Gathering
- Diablo II
- Diablo IV
- Football Manager
- FIFA 2023
- Nintendo Switch
- Swindon Town FC
- Arsenal FC
- Liverpool FC
- Tottenham Hotspur
- Paris Saint-Germain
- Manchester United
- Atletico Madrid
- Chelsea FC
- Manchester City FC
- Inter Milan
- FC Barcelona
Connect with our hosts
Subscribe and stay in touch
Top-Tier, Full-Stack Software Consultants
This show is brought to you by Ship Shape. Ship Shape’s software consultants solve complex software and app development problems with top-tier coding expertise, superior service, and speed. In a sea of choices, our senior-level development crew rises above the rest by delivering the best solutions for fintech, cybersecurity, and other fast-growing industries. Check us out at shipshape.io.--- Send in a voice message: https://podcasters.spotify.com/pod/show/whiskey-web-and-whatnot/message
These transcripts were generated by AI and we don't always have time to edit them, so please excuse any errors.
[00:00:05] Robbie: What's going on everybody? Welcome to another Whiskey Web And Whatnot with myself, Robbie, the Wagner, and my co-host, as always, Charles William Carpenter the third With our guest today. Matt Pocock. What's going on, Matt?
[00:00:18] Matt: How you doing guys?
[00:00:19] Robbie: Good.
[00:00:20] Chuck: Superb. Thank you for joining us from afar and making me do this for breakfast.
[00:00:26] Robbie: Yeah.
[00:00:26] Matt: No worries. What time zone are you on right now, Charles?
[00:00:29] Chuck: Uh, it's Pacific. So I'm in Phoenix, Arizona. Uh, we don't do daylight savings, so I'm currently on Pacific Time. It is 9:30 AM
[00:00:39] Matt: Nice.
[00:00:40] Chuck: you know, drink or be gone. Beer is for breakfast, drink or be gone except we're having whiskey.
[00:00:44] Matt: Sounds good.
[00:00:45] Robbie: For folks who may not have heard of you, Matt, can you give a quick intro into who you are and what you do?
[00:00:51] Matt: Sure. So my name's Matt. I am, I guess now a full-time TypeScript educator and have been for about a year or so. So I mostly work essentially on Twitter, you know, posting stuff and building courses and, uh, educating people about TypeScript. I don't work for the TypeScript team or anything like that. I'm just, flying solo, doing, a ton of YouTube stuff and a ton of. Building out courses and learning materials. Before that, I worked at a company called Vercel. Might have heard of them, doing developer advocacy and then before that at a company called Stately, where I was working on a library called X State, which is all about state machines and state charts. And we ran into a lot of TypeScript issues there, which got me into TypeScript. And I started posting about the more weird advanced kind of magical wizardly stuff to do with TypeScript. And it led me here, which is. Not where I was expecting it to go.
[00:01:43] Chuck: Life is an adventure, right?
[00:01:47] Matt: Exactly.
[00:01:48] Chuck: Yeah. All right, so we'll start you off right then. Let's talk about a little whiskey. I know you're a whiskey aficionado, as you were telling us before we started to record today having some of the Dalmore 12 year, , called the Dalmore 12. So age 12, 12 years makes a lot of sense as with all single malts. It'd be weird. The Dalmore 12, 13 year old. Thanks Robbie. Uh, 80 proof. So it's a milder one and uh, that might be a little more appealing to you. Uh, let's see here. A hundred percent malted barley as all single malts are. this one's cool cuz it's aged in a American white oak and all Russo sherry casks, so it might have some sweetness to it or something
[00:02:28] Robbie: Mm-hmm.
[00:02:29] Chuck: without further ado, as they say in the uk.
[00:02:34] Matt: That we all do. Yep. That's how we say it.
[00:02:37] Chuck: Yep.
[00:02:37] Robbie: Yeah, it smells to me a lot like, um, I don't know if you've had that high chew candy I think it's like, uh, some kind of Asian candy and it's, um, I don't know, they have a bunch of fruit flavors, but it's like, it smells kind of tropically candy, like, and it's very similar to those.
[00:02:53] Chuck: That's interesting because I am getting more of like a vanilla bean out of it,
[00:02:58] Robbie: Hmm.
[00:02:59] Chuck: little sugar, little vanilla
[00:03:00] Robbie: did you read the back of the box?
[00:03:02] Chuck: I didn't?
[00:03:03] Robbie: Because it said something about vanilla Be
[00:03:05] Chuck: Oh, okay. Yeah. I'm just That good?
[00:03:08] Robbie: Yeah.
[00:03:08] Matt: I'm so far out of my depth, it's kind of terrifying. You know, I, I actually, I hate this stuff so much that I went around my friend Pete's house who actually does like whiskey and I got to try the whiskey and I said, what should I say? So I thought I would, you know, come on with a bit of
[00:03:27] Chuck: I can't wait for this.
[00:03:28] Matt: I knew. But I forgot. I
[00:03:30] Chuck: Um,
[00:03:30] Matt: forgot. I didn't write it down. He said it was nice, he really liked it and it's, yeah, it's not particularly fiery or a bit of fire,
[00:03:40] Chuck: Yeah, it's it.
[00:03:42] Matt: I did find myself actually as a non whiskey drinker one night just thinking, okay, I feel a bit tired. I feel a bit like, you know, long day I just wanna sit down and I wanna look out at the moon and I wanna have a little drink of whiskey. And I did and I enjoyed it.
[00:03:59] Chuck: Hmm.
[00:04:00] Robbie: Nice.
[00:04:00] Chuck: See, not all whiskey is bad. , but there is plenty of bad out there. Right. And also, uh, it was nice of your friend to offer you some tasting notes, but the reality is, is we're all kind of making this up as we go on, he picked some random agent candy and I picked vanilla beans. They're probably in no way related. Uh, so like, and nobody's wrong. That's kind of the nice aspect of it though. Yeah. I get a little like chocolate. In the finish. I think for me, a light chocolate, a
[00:04:29] Robbie: watching you read the box.
[00:04:31] Chuck: I am, I'm, I'm looking at this thing, but uh, the box is in the trash bag
[00:04:36] Robbie: Oh yeah. Roasted coffee and dark chocolate is the
[00:04:38] Chuck: I am, I work for the Dalmore. Yeah, so Matt, I'm not sure if you're familiar or not, but we do the tentacle scale also. So one to eight tentacles because Octopus has eight tentacles. We're so clever. Uh, one being, uh, never want this again, eight being, this is amazing. Your favorite whiskey of all the ones you hate. And obviously fours in the middle, we. We separate them a little bit by, you know, scotches, bourbon, whatever else. But, uh, we have a drinking problem and, and have tasted a lot. So you certainly can put that up against whatever you want. It's all pretty random anyway. Um, but for, I am gonna say for a scotch, I, I'm not a big scotch drinker. I tend to find them, , Overwhelming with like either smoke or peat or something else. I'm not detecting really, maybe a slight smokiness in this, but like not much of either of those. The sweetness gives it some, roundness for me. And I usually find them too mild at this low of a proof, but I actually think this has a lot of flavor at 80 proof. For a breakfast whiskey, , I'm gonna give this like a six.
[00:05:41] Robbie: Yeah, I think, I think I agree there are a lot of good flavors in here. I think the only downside is it's, we're used to a little more proof in ours usually, so it's, it's a little watery to me. But, , I think all the flavors I'm tasting are very good. I guess that's the sherry casks, maybe giving it some, some good flavor. Um, so yeah, I would say, I'm trying to think. I, I'll just say six two, you've persuaded me.
[00:06:04] Chuck: It was, it was tough twisting your arm from afar, but you know. All right, Matt, what do you think?
[00:06:10] Matt: I think I'm for myself. I would give it, let's say a four, which is if I were to drink a whiskey again, if I ever feel the call of the moonlight and I fancy another little, another little sip, then I would probably reach for this bottle again. I think though Pete, Pete would give it a seven. So I'm gonna go with uh, Pete's recommendation cuz he said this was possibly one of the best whiskeys he's tasted.
[00:06:33] Chuck: Wow. All right. And so we're saying we next time we should invite Pete on, is what you're saying.
[00:06:38] Matt: Yes, essentially.
[00:06:39] Robbie: Yeah. How is he at TypeScript?
[00:06:42] Matt: He's very good at TypeScript,
[00:06:43] Robbie: Oh, okay. Okay.
[00:06:44] Chuck: excellent. Win-win. All right, well you send him our
[00:06:46] Matt: he's said he's here today? Yeah. No.
[00:06:49] Chuck: and here comes Pete to take over the interview. Sorry Matt.
[00:06:52] Robbie: Oh gosh.
[00:06:54] Chuck: Oh boy. We should talk tech things, I suppose at this point then.
[00:06:57] Robbie: Yeah. So we usually start with some, some hot takes, which we'll just go through real quick here. So we usually ask if people use TypeScript at all, but uh, obviously you do. So in TypeScript. Do you like to use inferred types or explicit types?
[00:07:12] Matt: Yeah, this is the big, the big mama of debates, or at least it was a couple of months ago when it exploded all over Twitter. Explicit types versus return types or, or inferred types. For me, inferred types make most sense because they're most likely to be correct, especially when we were working on X date where you had all these types to do with state machines and very complex types being threaded through to, actually, I. Let's say you created a machine and then you pulled it down through a bunch of functions, to actually annotate those types yourself is way more trouble than it's worth because you're just overriding what the system already knows about your stuff. The only way return apps really make sense is if you want to make sure that the function you're creating is. Secure and like used in a bunch of different places. But to be honest, TypeScript is clever enough that it will figure out the correct type based on all of your if statements and switches and all that sort of stuff. So for me, , inferred types are the best, but return types, do sometimes have some use cases.
[00:08:13] Robbie: Follow up question. I don't know if this is getting too into the weeds here, but, uh, so I, I had an inferred type earlier today actually that was like, , three different types of objects, that it could be or null or undefined. And I wanted like the second one,
[00:08:30] Matt: Mm.
[00:08:30] Robbie: how do you, is there a way to grab that? Like, I don't know.
[00:08:35] Matt: So you're, you're talking about like you've got three different shapes coming in, you know, like I know Triangle circle or Square or something and you want to grab Square, let's say out of those, or you've got another undefined. So yeah, there's a bunch of different ways you can do it. Like you could use like a custom type predicate if you want to like build your own type guard like is Square or something. Or you can just say, Corners in, like object or whatever and make sure those are four. And then you come back to your, uh, like you just narrow it down through that. There's a bunch of different ways you can do it. I mean, The first one I'm thinking about is even just a discriminated union where you just have type, square, type circle type, uh, triangle or whatever on each of those members, and then you can just go, go. If object type equals square, then you've got your square and you can access all the other properties. So there's a several different ways to do it.
[00:09:25] Robbie: Okay. That's fair. I'll let you do the next one, Chuck, unless you had a
[00:09:28] Chuck: I was gonna No, no, no. I just love how there's never one for sure answer. It's what I love about programming in general, , is never like this. I'm right.
[00:09:38] Matt: Mm-hmm.
[00:09:38] Chuck: about the Twitter arguments. Everybody thinks they're right. Um, yeah. So speaking of Tailwind or vanilla css, and I looked at your website code so I know what your answer is, but go ahead.
[00:09:49] Matt: Tailwind. Absolutely Tailwind. Yeah.
[00:09:51] Robbie: Yeah, which is the right answer.
[00:09:53] Matt: yeah, I'm just terrified of the cascade, essentially. I know that, , people say, trust the cascade, use the cascade, but I'm scared that the cascade is gonna tsunami all over me and terrify me.
[00:10:03] Chuck: Yeah. Yeah. That's the funny thing. The last thing you tell it is always right.
[00:10:07] Matt: And it's, it's just got so good, like in terms of the developer experience of it. Like I was using it even before, like they had the VS code extension and the VS code extension now gives you auto complete smart auto complete and like tailwind merge or whatever. So you can smartly combine different variants and things. It's just amazing. And css, , I've always had a like, Always had issues with css. As long as I've been a developer, there's always been bugs caused by strange css. And since I adopted Tailwind or since I started using Tailwind three or four years ago, it's just like they've gone away. I don't have to be terrified and it just fits the component level paradigm a lot better than css. I think CSS works really well with HDML and the sense of documents and that you are editing one thing and you go and then edit your css, but with components you just really want your stuff scoped to that components
[00:10:57] Chuck: Mm-hmm.
[00:10:58] Matt: Tailwind is great for that.
[00:10:59] Robbie: yeah. It really gets rid of that problem where you have like a megabyte of CSS and everyone's afraid to delete it. , cuz you can just, I'm not using the html so by default I'm not using these classes. So like, yeah.
[00:11:10] Matt: Exactly.
[00:11:10] Robbie: So get rebase or get merged.
[00:11:13] Matt: Get merge. I've never, I don't think I've ever get rebased, which is terrifying even in itself. I've always been a merge boy. Don't think, I mean, unless it's been like an automated thing on a GitHub repo or something where I've just pressed the green button and done it. I don't feel like I've ever rebased, which is sort of a terrifying thing to admit. But yeah, I've just always been merge.
[00:11:32] Chuck: here's a follow up question. Are you a senior engineer if you've never get rebased?
[00:11:39] Matt: Great question. I guess not, man. I
[00:11:41] Chuck: Hmm. I, I subjectivity all over
[00:11:44] Matt: wonder if Peters get rease. I be, he has.
[00:11:47] Chuck: just wanna talk more about Pete now. What is Pete's favorite, uh, football club.
[00:11:51] Matt: I don't think, I think Pete hates football. I love football by the way. I
[00:11:55] Chuck: oh, we're gonna,
[00:11:56] Robbie: No.
[00:11:57] Matt: that I follow, so.
[00:11:57] Chuck: we're gonna put a pin in that cuz I also love football. Proper football. Not that egg ball game shit.
[00:12:04] Matt: Fabulous
[00:12:05] Chuck: what do you think about signals.
[00:12:07] Matt: I haven't really experimented with them. I saw Ryan Carniato's talk at a conference called Modern Front Ends, which was like a complete crapshoot, but his talk was incredible. Basically talking about how signals are effects. You know, if we think of React, like I'm a React boy, I've used React effect hooks, and if you think about react to use effect and you take that use effect and you use it to update the dom essentially and create bindings, then that's where signals live. I really, really like the idea. I've just never. Found a reason to play with them beyond, , cuz especially I was focused on X State and focused on X state's implementation with React. So X State is a state manager in itself and it uses kind of the traditional redux model of you have some state somewhere and then you subscribe to that state and you select on it essentially. And what's cool about that with stink machines is you get to say, okay, if State dot matches this, then you can show a certain UI. So I would love to see that combined with signals as well, because it's kind of the same stuff as just a different way of doing bindings, but I'm into them. I've just never gotten around to using.
[00:13:15] Chuck: yeah. And maybe in a roundabout way, you have in the same ideology, like said, okay. Yeah. Cause I like the, basic thought. Around like a redux, immutable state machine and subscribing to that and all that kind of thing. Cuz I think hooks are kind of weird and wild. So my follow up would be this then you've been in the React ecosystem for quite some time. So class components or functional components. I mean, are you happier now or were you happier then?
[00:13:42] Matt: I am so much happier now. It's unreal. I put hooks into production, I think like the day they came out actually.
[00:13:51] Robbie: With no documentation.
[00:13:53] Matt: no documentation, no nothing. I saw the talk. I was like, , react for Linda or wherever it was, I was immediately hooked. React Iceland, I think. And. just loved it. Oh, no, I'm not getting the pun. I'm not getting the
[00:14:08] Chuck: you said I was immediately hooked.
[00:14:11] Matt: Oh, damn it. Yeah. That was so instinctive that it just came out. I was, I, I just, I immediately fell in love because I was looking at, at my job, but trying to, we had a bunch of different, like duplicated code and I felt that hooks just solved a ton of our problems immediately. And I put 'em in production like immediately, and they worked so well. And to be honest, I've never looked back. I've never un really understood the criticisms of hooks. Like hooks, you can think of them as kind of like a dsl, like a domain specific language. They're just supposed to work in the React environment and they don't really work if you take them outta the React environments, but they just fit so nicely with the problems that I was trying to solve at the time. So I've always loved them for doing that, and they've bought a big dividend of love from me.
[00:14:56] Robbie: I think most people are happier with functional components and I think. , for me though, it's just like, the problem with hooks is they just, and maybe it's cuz I haven't used them much, it's just that they like, are harder to understand. For me, the mental model feels a little backwards, but, I mean, I know they're, they give you a lot more power is like the big, use case, but
[00:15:16] Chuck: Yeah. Yeah. Like it's great when you don't have to pass down props for levels and, and things like that. Like there's a lot of, cleanup in that range of things. All of a sudden we stopped caring about re-render. That was interesting. Like it used to be like, don't re-render, don't re-render. And that was like the big performance thing. I feel like hooks do cause a lot of re-render, but there's a lower performance hit because of that. So that's kind of fine. Like it, it's nice not having to think about that. The other thing that I thought was weird about them though is that within your life cycle functions of a, of a class component, like those made sense to me because you read them. And they did what they were called, right? And then you had this whole like mental jump though of where in the life cycle of this component do I use, what hook and how do I kind of make it mimic the other thing if I come into it? Clean with functional components obviously would've been like straightforward, but I had to like adjust my mental model of from like, oh, this is how I used to do it. Now I gotta do it that way to make it that old thing, but then maybe I shouldn't be designing it that way at all. And so it was kind of a reboot there. So that was like one of my, my issues around that. But I can see where it certainly could, , solve some memory issues right up, you know, where it did not, you know, that it could, but where it did actually.
[00:16:35] Matt: For sure, like as a follow up to that, like I think the old re-render stuff like that we used to do in like should component updates and things like that, it often led to more maintainability issues than it's solved in terms of performance. I think actually what you gained in performance, you often lost in robustness in those models. I do agree that I think especially when we have these conversations, when we say, you know, lifecycle methods are intuitive, use effect is unintuitive, that's the one we're kind of aiming at there. And use effect is really a totally different mental model. And I think that, That transition was managed in a way that I feel like could have been better I felt like I got it out of the gate because I was having some issues , with the lifecycle methods as they were, so I understood, oh yeah, I'm ready for this new mental model. I'd love it. Let's, let's go for it. Let's like check everything, every re-render. But actually, , I often reached for X date in those situations instead of use effect. Cuz actually state charts, state managers, it's just so much easier to understand what's happening at every point in your life cycle if you've got it in a fricking p n g, you know, like you actually understand the visual output of what your effect are doing and, and all of that orchestration. So I think what use effect did it gave us an amazingly simple. Api. That was an extremely sharp knife. You could cut yourself very easily on it, but it meant that you could make really nice abstractions. If you were good with that knife, then you were good with it, but I feel like should component updates and the old lifecycle methods, they were sharp knives too I dunno, maybe they were blunt knives. I dunno where that analogy falls down, but like, They just led to code. That sort of was harder to update, I think. Whereas a user effect, maybe they're both crap. I dunno, I'm talking myself into a corner there.
[00:18:20] Chuck: Yeah, you're like, uh, not sure. And you're like, I love this. Actually, they're all crap. I think the, the sharp knife where you need to kind of be chef trained and, , have good knife skills and practice to like really hone it and make it great. Like you've got a great robust tool, but the honing in and then like conversely the other ones, Where probably like a full set that you got at a wedding and they're okay and you can do a lot with them. And they're kind of straightforward this night for that, this night for that. But then when you get in a pickle, you don't know what the hell to do and you gotta create something else altogether. Therein started to become all these other state models, I think is, How do I handle this throughout my application and outside of the scope of just my component and stu dumb components versus smart components and these container components and all these things that we started doing that just further convoluted things I can see where like, okay, hooks are just gonna make this a little more straightforward, so let's try that.
[00:19:15] Robbie: yeah. So let's get to what we're actually here for. Um, so, well, not that, not any of that was bad. Just say,
[00:19:22] Chuck: No, I'm just kidding.
[00:19:24] Robbie: um, yeah. So TypeScript is what you're known for. , I'm curious, when did you first encounter TypeScript and did you immediately love it or was it kind of a, a love hate thing for a while?
[00:19:34] Matt: Weirdly the same job where I was, , first got into hooks, was the same job that I first got into TypeScript. Like this was a project that had a lot of things wrong with it. We were a small front end team trying to keep up with a big backend team, and we needed to increase our velocity a lot. the main thing that was happening was the backend team would sort of change the api like, Tons and tons, and they would sometimes add little strange things into the api. So like things would be cased incorrectly or things would be null where you didn't expect 'em to be. And they would change, like the contracts every now and again, we had like a Google doc where they would just paste in some, you know, Jason, and that was our contract, and the front end that we were building was big, you know, like it was a big tasty front end with lots of data fetching with, running that data down into several layers and it just felt like you were walking on ice the whole time. You would just find bugs all over the place. And so what I wanted to do was I wanted to try to find a, I was actually pushing for GraphQL at the time. GraphQL, I thought, would solve a lot of these issues because it meant that we would be actually be able to have a proper contract. But because I couldn't get, I couldn't get these guys to do GraphQL. Instead we went for Typescripts and. I started by just describing the interfaces of the API in TypeScript and said, okay, these are the interfaces. Let's move away from Google Doc. Let's just make them in TypeScript. Let's just use these to describe this. And then I made a proof of concept of actually taking that and putting it in our application, you know, and actually going, okay, when we fetch this data, this interface actually flows down. And the other guys on my team sort of hadn't been exposed to Typescripts so much, and. When they found that, they were like, oh, I see. We're just never gonna shave a bug again, right? Cuz all of our bugs at that point were coming from faulty API responses. So again, we got this dividend of happiness from TypeScript that sort of just kept rolling through the project and it just meant our velocity was just so much higher than it was gonna be before. And of course we hit some strange errors and stuff and we had to level up on that and I was, you know, kind of the TypeScript person and or became that way. Funnily enough, I, I got into the advanced stuff straight away because we had this kind of table components that we used in all sorts of places throughout the, , application for rendering all these different tables. I realized, okay, I could actually change the like render row function in this table component based on the data that's passed in. This was the first component that I touched with TypeScript. So my first component I ever wrote was a generic component, one that actually changed. Its sort of like type information based on the stuff that you passed in. And so again, that just meant, okay, we can actually drop a load of type annotations because we've got this generic component working. So that was how I first got into it. And then, After my next job, I, I joined a company that I think was a React Native app that was fully js, and I converted it all over to TypeScript and it just, it just again, gave me such a big boost and gave me such a huge amount of confidence. Then I went to X Dayton, as I said, got exposed to all this crazy advanced stuff there.
[00:22:47] Matt: So you mean like motivation or you mean like
[00:22:50] Chuck: um, maybe more like say it's an open source project and has three maintainers and some contributors, you know, a half dozen or so. Is that a good project to convert over or do you think it's like more for complex applications or for like an instance, like you described actually where you have issues with the API contract, , you don't have buy-in for contract testing because you would think like an easy solution there, rather than switch your code base over, is to agree on something like PACT where there's contract testing and nothing goes in that breaks the contract without agreeance and sign off. Right. , but you need buy-in from both sides. So yeah, I just don't, I don't know if you're like everything type script all the time. Just keep your guardrails up or do you think there's like a tipping point, I guess?
[00:25:50] Chuck: Yeah, and you feel like maybe you're able to, uh, catch potential issues real time rather than later on, and, there's some edge cases here that weren't captured in testing or whatever else. I had just been explicit through. Declared types or, you know, just made it TypeScript so that it was smart enough through, and it would tell me, oh, , I've made a mistake here, and my edge case is caught earlier, real time. I mean,
[00:27:12] Robbie: Yeah, and I think it's good, , For the whole team. Cuz if you have people that aren't that experienced, they get all that auto complete, they get the guardrails that keep them from doing the wrong things. And like for people that are experienced, if they need to do something quick, come in and fix a thing and they don't wanna do all the types. Like you can do 90% types. And I know it's a bad word, but you can throw an any in if you have to. At least. You did a lot of good things first, right? Like
[00:27:35] Chuck: Right, right.
[00:27:37] Matt: Absolutely. I think actually, you know that meme about the um, about like the mid wit thing where it's like, it's got the, uh, bell curve and it's got like the stupid guy on the left and like the angry guy in the middle. And then the, you know, the zen guy on the right. It's like, on the beginner side. Yeah, just use an any, oh, you can't use any, how dare you possibly use any. And then on the right side it's like, just use any,
[00:27:58] Robbie: Yeah.
[00:28:00] Matt: it's fine. Like you can actually. As long as, let's say you're inside a function, as long as the outside of your function is properly typed, it's kind of fine. If you're just using any inside, it sort of doesn't matter too much and especially if that function is tested anyway. So I think any gets a lot of terror attached to it. But it, it's just another tool, right? You can use it.
[00:28:18] Chuck: Right. Sparingly used. Okay. All over. Maybe not as much, you know?
[00:28:24] Matt: Not so good. Yeah.
[00:28:26] Robbie: It depends on your intentions too though. Like if you're gonna come back to it and fix it, It, it's okay for now, but like if you're never gonna touch it again, then probably spend a little more time not making it any right now.
[00:28:38] Chuck: Right, so you don't have to come back. You know, think about that investment. Yeah. Is it an early iteration? Are you deep in the project? Things like that.
[00:28:46] Matt: Though a lot of open source libraries, you know, they do actually have some as anys, like stapled in there, like, uh, ZO and T R P C React Query. A lot of these libraries you'll find anys in the, in the code base, and that's mostly because they're doing stuff. Where it's so complex that even TypeScript can't quite catch up to it. And so it's just sort of locking TypeScript in a cupboard for that line, you know? Any can be a tool that you use along with other things to make your code more robust. Like a lot of people will feel like, oh, I can't get this function, I can't get this type magic to work. If I use an any, I would suggest say just use an any, right. As long as you know that it's robust and it works, like just do it.
[00:29:25] Chuck: Well, I think this is a good time for this question then, which is, what is the biggest mistake people make with TypeScript?
[00:29:33] Matt: Oh God. I think the biggest one is getting scared of the errors and actually not reading the errors. I think the more you read the errors, the more you understand them, because the errors They use this sort of strange language, which is they use an extremely precise language to describe everything. what that means is like if you're not used to that language, then it can feel totally daunting and terrifying. another thing is that they. You know, like in a stack trace, let's say in a console era, you've got the most relevant piece of information at the top. Then the second most relevant piece of information, you know, where this function was called. Then the function that called that the function that called that function, that called that. Then the environment, it executed in, in a times script era. It's in reverse. So you've actually got the least relevant information at the very top, and then the most relevant information right at the very bottom, which is the actual comparison that failed, let's say. And so a lot of people will just look at the first line and go, I have no concept of what that is. No idea what that's doing. That has no relevance to me. That's a type from a third party library. Why is it saying that to me? But if you actually go all the way down and actually read it in reverse, that is I. Think like that's gonna just give you so much more context cuz you understand, okay, that failed, then you understand, okay, I understand where that type was at that time, and like who the type was with and what was happening there. And it's like you're reading a legal case, and you finally understand like what TypeScript is talking about. So I'd say that's the biggest mistake is just misreading errors because you're not quite sure what TypeScript means.
[00:31:08] Chuck: yeah, that's never happened to me. I don't know. Yeah.
[00:31:11] Robbie: That happens to me a ton like. There's so much information before the thing you care about. It'll be like this huge, like 46 property thing and this other 46 property thing, and like 10 of those. And then it's like, actually this is supposed to be a string, but this could be string or undefined. Oh, cool. Thank you. You could have just told me that like way a long time ago.
[00:31:32] Matt: Yeah,
[00:31:33] Robbie: Yeah,
[00:31:33] Chuck: it is all about like knowing how to read it and knowing that it does like dig down like that and it's not the, yeah. Yeah. It's like the outer most thing that you have to drill into. Yeah, that makes a lot of sense. I totally agree with that. That's probably some of the things I've had the most trouble with is what's the issue? What's the issue? And then someone who knows better is like, well, it's telling you. Can you just, if you just scroll down, then read it. There it is. Have you read it? Can you, are you read? I am not read. I am
[00:32:03] Matt: It's another thing too is it uses this crazy precise language and the language it uses is, is like, it's based on a s t, abstract syntax tree of what's actually happening. And so we use things like identifier or name property, all this sort of stuff. , and that's just not language that you will have come across if you've not looked at a s t or not. Like looked at tons and tons of these errors I do have a vs code extension called TS Error Translator, which actually takes those errors and like translates them into proper English, which is very nice. It's on,
[00:32:33] Chuck: Yeah,
[00:32:34] Matt: it's, oh no, it's actually the total TypeScript extension now. Cause I, I moved it into there. I've got another one. As part of that too, it sort of like looks at complex syntax that you are looking at on screen and gives you like a little blue thing if you've not encountered it before. So if you see like a complex type or you see like a generic or things like this, then it will actually tell you what's going on there and link you to the relevant part of the documentation.
[00:32:56] Chuck: Hmm. I will be installing that after this.
[00:33:00] Robbie: Yeah.
[00:33:00] Chuck: That sounds
[00:33:01] Matt: so cool.
[00:33:03] Robbie: So, yeah, you've uh, been posting a lot recently about some of the newer things coming out in TypeScript, like the using keyword and type argument, placeholders, et cetera. , you wanna just go through a few of those and tell us about the new hotness coming out?
[00:35:33] Chuck: Yeah, that's awesome. And that makes a lot more sense. For some reason, I wasn't able to gr that from the tweet that I saw. I was like, uh, okay, but I don't understand why this helps me more. Right there. Automatic closing of connections or. Yeah, that makes a lot of sense and seems really helpful. Cause I'm forgetful, I'm getting older. I don't know if you've, you're aware of that, but, uh, these, these bags under my eyes aren't just for sleepiness.
[00:35:58] Matt: I definitely feel that I don't like, uh, I don't like getting older. Well, then bad too. I sort of wanted to be older when I was a kid, but now I don't anymore. I wonder where that is.
[00:36:08] Chuck: I, I'm past that middle point where I would've been happy, you know, like late thirties would've been fine for me. That was a great spot. Late thirties was good. Now mid forties. Mm. Me? Yeah. And they're like, oh, why does my back hurt all the time? And stuff like that. Everything pops when I get out of bed, you know?
[00:36:27] Matt: Mm-hmm.
[00:36:27] Chuck: Anyway, um, so yeah, TypeScript, that's the thing we were talking about. any advice for teams who are hesitant to try TypeScript or think it's too much overhead?
[00:36:37] Matt: Again, I'm, I'm too far through the looking glass. Right? Like
[00:36:40] Chuck: Right, but you've had to fight this. You've had to fight this battle before then, so early on,
[00:38:18] Chuck: Yeah, that makes sense. And I imagine most people you encounter these days aren't saying, Hey, help me convince my team. They're coming to you cuz they're ready.
[00:38:27] Matt: Yeah, yeah. They're happy. They're ready to go.
[00:38:29] Chuck: yeah, they've hit some stumbling blocks and they need some expertise to kind of increase momentum. Right?
[00:39:14] Chuck: just try it, Robbie. Just kidding. He does it.
[00:39:16] Robbie: Yeah, I've been the advocate for TypeScript and on our team, so
[00:39:21] Matt: Nice.
[00:39:21] Chuck: yeah. You've been that guy. We're doing this actually, that's his, that is what Robbie goes. He's just shows up with like some giant PR and he is like, you don't wanna waste my time, do you?
[00:39:32] Robbie: Yeah, no, I, I just come in and go, how can I change this? And, uh,
[00:39:38] Matt: Mm-hmm.
[00:39:39] Robbie: But, uh, you know, there's always, I. In an older code base, there's lots of tech debt, so there's always ways to improve. So TypeScript is one of those ways that you can also then feel comfortable, like refactoring a huge component because you're like, okay, I know if I totally break it, TypeScript will yell at me. So
[00:39:55] Matt: You know what it was actually like the moment I fell in love, love, I was attracted to TypeScript straight away, but the, the moment I just fell for TypeScript was my first refactor, the first time that the data shape changed and I just had to change the interface and it just a four hour job turned into a five minute job. Cause it just told me everywhere that needed to be updated. Oh, it was just, it just, felt like cheating, you know? It's just crazy when you can do that, and often actually, that doesn't come up when you are just building something, because often you don't need to refactor that often, or the refactors that you need to do are just small. But as soon as a project hits a certain level of maturity, then you just like, you just slow down and those refactors can just tear your soul apart. Whereas if you're using TypeScript it's just easy.
[00:40:44] Chuck: so speaking of total type script, Oh, this is your question though, Robbie, I think.
[00:40:48] Robbie: What I figured you'd want to go into football.
[00:40:52] Chuck: No, I'll get there. Yeah, I do, I do. But I, I did, I we went to your site. There's some really cool illustrations on there. I really like the, uh, the heading font face. It makes me think of like a, kind of like sci-fi novels in the eighties or something. I don't know. I'm not sure if that's at all related or any kind of inspiration there. , but then you had the. Yeah. Or
[00:41:15] The inspiration for Matt's website design
[00:41:15] Matt: Well, I'm, I'm a huge, magically gathering nerd, like that's and board game nerd actually. Like this is absolutely my bag. And so when I was, so I'm working with a team to do 10 typescripts and like, , the illustrator said, you know, uh, Like I, I said I wanted to do something sort of wizardly, you know, cuz everyone called me like the touch grip wizard or whatever. And I thought that would be good cuz like touch, grip can feel like magic and you can feel like magic, you know? It just worked. And she said, you know, I'm really into Diablo too. Like, I was, that was my favorite game. And I was like, that was my favorite game as well. So we just had a mind meld and like, just absolutely made this gorgeous, gorgeous thing. And like, I've never have given her a single note. I think like everything she's produced is just incredible. And so that feeling of it. She just produced, you know, the illustration that's on like the top of total typescript.com. She produced that like without any notes or without any feedback. And I was like, bloody hell. I actually had a tear in my eye when I saw it. Like, it's incredible. And that just sort of inspired the rest of it and the rest of the illustration. So yeah, it's been amazing working with those guys.
[00:42:15] Robbie: Nice.
[00:42:15] Chuck: really cool. It's a nice design for
[00:42:17] Robbie: Yeah. Yeah, that was kind of my, my thought is I was like, these illustrations are so good. I'm curious if they were made like for this, or if like TypeScript additions were added into it, you know? So that's what I was thinking. But it sounds like they're all accustomed, so they're very, very good. Very good.
[00:42:31] Matt: All custom, all from scratch. Yeah. Michelle Holick is absolute God.
[00:42:36] Robbie: Nice. Now, before we get to football, I do want to ask, have you played Diablo four then?
[00:42:40] Matt: I have not played Diablo four. No, I haven't, haven't been. I've got a steam deck and I'm not sure whether it runs, uh, Diablo four or not. I mean, it probably does,
[00:42:49] Robbie: I think it,
[00:42:50] Matt: I'm also just like, Yeah, pretty well. I'm, I'm just extremely into football manager and football manager's. Basically the only game I play these days. I'm still playing Football Manager 2018 because I've just like gone into my 40th season with, uh, Swindon Town Football Club. We've won, you know, 13 Champions Leagues at this point, and I'm, you know, raising up the next generation. I've just, I love that game so much.
[00:43:11] Chuck: Oh,
[00:43:12] Matt: so yeah, it eats up all my, all my game playing time, unfortunately.
[00:43:15] Chuck: I pretty much just play FIFA, so I understand. Although that doesn't run on a steam deck, which is basically the only reason why I haven't bought a steam deck.
[00:43:22] Matt: Uh, it does.
[00:43:23] Chuck: I thought they were, you had to hack it or something. It does like, oh.
[00:43:26] Matt: Just runs.
[00:43:27] Chuck: Okay.
[00:43:28] Robbie: you're gonna buy one now.
[00:43:30] Chuck: Uh, how can I
[00:43:31] Matt: it runs really well. Actually runs really well.
[00:43:34] Chuck: All right. This is, this is great. Yeah, because, uh, I, I used to play it on Switch, but it's garbage. It's the legacy edition compared to PC edition, and I played for quite some time, oh, what was it? The Google, uh, like mobile streaming thing that they just shut down last year.
[00:43:52] Matt: yeah, yeah, yeah, yeah. I can't remember what it's called either,
[00:43:54] Chuck: Yeah, I can't remember. But it was nice cuz uh, you could do it through like a Chromecast on the TV and the iPad. So it was just like, wherever I'm at, I can play Love that they killed my dreams, so. Okay, good to know that my money is gone. This is great timing for that. And uh, seriously. Yeah, Google's just, I don't know what, they're really bad at business in spite of all the money they make apparently.
[00:44:18] Favorite futbol teams
[00:44:18] Chuck: Okay, so was Swindon Town your team then?
[00:44:21] Matt: Well, I've got three teams, Liverpool was always my team growing up. That's the team, uh, uh, me and my dad supports and, uh, absolutely love them. Oh, and dear, that's not a good face. That's not good face, is it? You know, an Everton fan. Are you a Man United fan?
[00:44:34] Chuck: Man United
[00:44:35] Matt: Uh, I forgot. So I knew
[00:44:36] Chuck: the nineties. Yeah, if
[00:44:37] Matt: if I were to guess what your, uh, since the 90
[00:44:40] Chuck: nineties.
[00:44:41] Matt: fine. but other than that, , my wife's family, , my wife's granddad has supported Arsenal since, , 1944. In a year that apparently they, because the hybrid stadium was being used for World War II stuff, they actually played at Tottenham's Ground or they did a ground share with Tottenham, which is kind of nuts. And so I've been really into Arsenal, actually, which is another man United, another very friendly pair of clubs. Absolutely.
[00:45:08] Chuck: Yeah. I mean, well, this past season, other than, uh, shit, the bed at the end, they, I mean, they're a fun team to watch and give them that, uh, Arteta has exceeded expectations, I think, except for he's talking to PSG now, so that seems kind of dumb. I don't know. Yeah, he won't go. He won't go for the
[00:45:24] Matt: Rumors. Rumors.
[00:45:25] Chuck: Yeah. Yeah. But that's a strange eclectic mix of teams to, especially all kind of within the Premier League too. Um, like Liverpool and Arsenal. I mean, they're not direct rivals by any means, but yeah. Everybody's Man United rival essentially. At least
[00:45:42] Matt: you you sit in, sit in a room with someone who's been supporting them since 1944, and I, I dare you to not fall in love with the club as well. Like it's, it's pretty crazy actually. And it's, it's nice to, they're, they're my second team. Absolutely. Liverpool's still my first team, but
[00:45:57] Chuck: I was lucky. I have a friend who's from, uh, Runcorn and is a United fan and his family were for their, all their lives and they used to have, , season tickets in the family, stands that they had. So it was outstanding room. And so I've had that experience where the whole family has been a, a, a fan for years and years and years. So I don't know if it would've been the forties or so, but it definitely was quite some time. So that. That gets you going. I got into it, it was a little before the US World Cup in 94, and then like watching Eric Cantona, it was just like, this is, this is amazing and beautiful and just, I couldn't not, I couldn't take my eyes away, so,
[00:46:34] Matt: An extraordinary player. I remember it was, I think World Cup 98 was the one that I really got into it. , Michael Owen and, uh, David Beckham and, , the Argentinian player kicking David Beckham in the back of the leg and all that stuff. And, oh, no, no, sorry. David Beckham kicking the other guy. Yeah, it was the other way around.
[00:46:54] Chuck: yeah. Wasn't it the, um, Athletico Madrid coach, what is his name? ,
[00:46:58] Matt: Diego Simione.
[00:46:59] Chuck: yeah, Simione. That's what I thought. Yeah.
[00:47:02] Matt: Kicking our beautiful Beckham. Oh, no, he kicked him. Oh, God. I,
[00:47:06] Chuck: yeah. And got the red card and got his life
[00:47:08] Matt: I'm just rewriting history here in favor of the English, which has never happened before.
[00:47:12] Chuck: yeah, it's
[00:47:12] Robbie: Yep. No, never.
[00:47:16] Chuck: God saved the Queen. Oh, wait,
[00:47:18] Robbie: Yeah.
[00:47:19] Matt: Oh, wait, yeah.
[00:47:20] Chuck: I won't hold all, all of that against you. yeah, it would be worse if it was City. I think I really went through a lot of Chelsea hate for a while, but now, you know, with Pulisic there and everything else, he tried to be like, eh, you know, I
[00:47:32] Matt: Hmm. He's not really there though. He's only one of 44 players I think they've got on their books.
[00:47:36] Chuck: Right, exactly. So hopefully he goes some, I really want him to go to, uh, Inter Italy is the rumor. Milan is talking about it, but I'm an Inter fan also. It was like the first European match I ever went to was at the San Siro Inter versus, uh, Fiorentina. I think it was in oh nine.
[00:47:55] Matt: damn. Okay. You've got some pedigree. I, I like this.
[00:47:59] Chuck: I've been there, I've been to Old Trafford twice, and I've been to, Barcelona too, so,
[00:48:03] Matt: nice. Well, I've been to the county ground at Swindon Town many times and you are very welcome there.
[00:48:08] Chuck: sounds great. I mean, I would go to any live game in Europe just because the energy's amazing, so I, it just, it just, uh, depends on where it's at and whether I would wear my jersey or not, or my kit as they say.
[00:48:24] Matt: your kit. Yeah.
[00:48:25] Chuck: Anyway.
[00:48:26] Matt: Good pronunciation too.
[00:48:27] Chuck: Yeah. Yeah. Uh, so gaming football, uh, Robbie found some fun facts that, uh, used to be a voice coach.
[00:48:35] Matt: Mm, I did for six years. I was a voice and singing teacher. I did a masters in voice and singing. And so, uh, I taught accents. I taught public speaking, I taught Shakespeare. I taught, musical theater and all this stuff sort of stuff. Uh, that was my job for, uh, six years. When I lived, I lived for a bit in London doing work at drama schools and, you know, seeing people at my house and that kind of thing. And it was cool like it because it means that, I can speak, which is I. , not something that all devs can do. So it felt like when I came into Dev, I, you know, I was put in front of clients more. I was like, I was able to hold my own more and discuss technical stuff more. And it feels like that's why I'm doing the job that I'm doing now because I've got this weird Old career, which is still sort of coming out in me, which I, I think is so cool to have those two sides match up. Cuz I became a dev and I thought, oh, maybe I won't do any of that sort of performance stuff again. But now it feels like, you know, we're doing YouTube and doing all of this, uh, course stuff as well. It feels like I get to scratch the teaching itch as well as scratch the dev itch, which is just a lot of scratching.
[00:49:40] Chuck: Sounds itchy. Um, but I do find that when someone tells me something in a British accent, like I believe them, I think they know what they're talking about. It sounds more serious. I actually have my ways voice as, uh, a British woman, like, because I think she knows where she's going.
[00:49:58] Matt: Yeah, I think as well if like if you were able to transmit like. Bold man with glasses like through that as well, with British accent. It's a, it's a powerful cocktail. You know, I could, I'm sure I could just tell you anything You believe it. This, this doesn't work in the UK though, by the way. Cause I just, I just sound posh in the uk like, you know, Americans just hear a posh British accent and they go, they must know what they're talking about. And a British person, here's a posh British accent, and they go, what a bastard. This is an awful, awful human being.
[00:50:29] Chuck: They wanna slag slag you off or
[00:50:32] Matt: Slag me off.
[00:50:33] Chuck: Yeah, yeah. See, I know some of the, I lived in, uh, Leeds for like a month and you know what was cool about that? Like in London, international City, you walk around, you talk like nobody looks at you twice in leads. People would hear my accent and they would be like, it's amazing. Keep talking to me. Just say things like, I, I thought it was crazy, but uh, obviously enjoyed it. Yeah. Has anyone ever told you you, uh, look like the British Anthony Edwards?
[00:51:01] Matt: I have no idea who Anthony Edwards is. Let
[00:51:03] Chuck: So yeah, do that. He was on ER, it's probably like a big thing. He was in revenge of the nerds. Those
[00:51:10] Matt: Anthony Edwards. I'm seeing photos of him old.
[00:51:14] Chuck: Yeah, he's
[00:51:14] Matt: is not
[00:51:15] Chuck: now.
[00:51:16] Matt: Uh, there's also an NBA player called Anthony Edwards, who looks like he's more prominence and uh, I don't resemble him.
[00:51:23] Chuck: No. Okay.
[00:51:25] Matt: Oh, okay. Now I've got it.
[00:51:26] Chuck: you're getting it. Okay, good. I didn't want to completely insult you.
[00:51:31] Robbie: Yeah, I was gonna say, is this a, a compliment or an insult? Chuck.
[00:51:34] Chuck: I, I mean, it's what he looks like, and this is was a famous actor. I mean, I don't think that's like, you know, I didn't say look like sloth from the Goonies.
[00:51:45] Matt: There's a. A player, a chess player called Vessel in Rolof, who people say I look like when I take my glasses off. Or I, I used to play chess and so I used to go to a, um, I went to a club like for the first time and they're like, you look like Vessel in Rolof. And I looked, looked him up and he's just relatively ugly, angular face.
[00:52:05] Chuck: Okay. And you're like, oh, that's not nice. Yeah. See, I think my, my statement is more complimentary, I'm gonna say, and he is a very likable character in all of these things. So he is like, never the bad guy, murderer or something else. So,
[00:52:18] Matt: Is he like a sex machine, I assume.
[00:52:20] Chuck: uh, yeah, absolutely. Um,
[00:52:23] Matt: Great.
[00:52:23] Chuck: sex machine. Yeah. He's like, uh, he's like the bald George Clooney, you know, basically, yeah. Was also on ER. Yeah. I think he was, you
[00:52:31] Robbie: Yeah, I forget he was on ER.
[00:52:33] Chuck: It was such a weird turn for me cuz he was in all these like comedies and stuff for a while. Again, like my first memory would be around Revenge of the Nerds and he was one of the main guys and yada yada, yada. And then all of a sudden he's like, serious doctor on ER.
[00:52:46] Matt: Well, I'll take it.
[00:52:48] Chuck: Yeah. Fun facts.
[00:52:49] Robbie: Yeah. All right. We're coming up on time here. Uh, is there anything we missed or anything you wanna plug before we end?
[00:52:54] Matt: buy my course totaltypescript.com. have a look at all the fun illustrations as well. That's, uh, kinda the most of the reason for going there. I've also got just tons of like free stuff on there as well. So like, there's a, a free beginners tutorial free, , beginnings with React tutorial too, which is kind of, we put the same production values into that as the paid stuff. It's just shorter, so it's great if you are , Feeling like you want to pick up TypeScript, but you just dunno where to start. It's just me, , giving you little tasks to do and then you do the tasks and then I tell you how I would've done them. So it's extremely practical and I, I really hate, like, you know, when you download a video course and it's like 40 hours of content, you know what I mean? It's like, there's no way I'm gonna do that. There's no way I'm going to, like, there's just no way I'm gonna ever spend the time doing that. So actually just. Giving you practical stuff after like a minute of video is my approach and I think it works Great. , and it's free, so go and check it out.
[00:53:46] Chuck: Oh, definitely. And install that vs. Code extension,
[00:53:50] Matt: Oh yeah. Total transcripts,
[00:53:52] Chuck: booya.
[00:53:53] Robbie: Thanks everybody for listening. If you liked it, please subscribe. Leave us some ratings and reviews. We appreciate it, and we'll catch you next time.