Transcript from the "Converting a Project to TypeScript" Lesson
[00:00:00]
>> So we're going to put this small project to bed and it's time to refocus or to focus on the slack app. So, now that we know that we've learned about how I typically do linting and API documentation and build and testing. You may now look at this, the main workshop project, and you'll see a lot of the same things.
[00:00:28] So the point of taking you through this exercise was, you should now, be able to understand where to look for certain things and what you see here is effectively the. The react part of the app added in extending on this same concept of what we went through. So, I hope you take as a given that our starting point here is just different and very uninteresting ways from what we've built so far, so you can think of it sort of as a continuation of our layering up.
[00:01:05] So, what I'm gonna talk about now is our process for converting from JavaScript to TypeScript. And if you took the previous course, the TypeScript three essentials V2, you may remember that we had a three step process for this conversion effort. And the idea here is you do not wanna have a long running branch where you've converted a bunch of things to TypeScript, but everyone else is still committing code to the repository.
[00:01:44] That's is a recipe for just an awful merge conflict situation, you're gonna spend half your time keeping upstream stuff in sync and pulling your commits and you do not want that. What you want is to sort of make focused efforts, lend those in master or main and you want them for new code to be in TypeScript if possible, right?
[00:02:09] You wanna kinda make progress and then get back into your default branch. So, some guidance around what not to do, these are from my previous course, I just wanna put those back in your mind. Don't attempt functional changes at the same time, make sure your test coverage is good.
[00:02:28] That is how you're going to make sure that as this conversion happens, you're not unintentionally changing as you make the types happy, you're not changing the nature of the code and causing breakage. Don't forget about adding tests for your types, we're gonna talk about how to do that shortly and don't get too excited about publishing type information for consumers.
[00:02:54] So, if this is a library, your last step is publishing declaration files, don't get too excited about that and do it too early because it's just gonna be full of anys. And you're effectively gonna be giving consumers suggestions about how to use your API that are just way too loose and broad, you don't want that, they don't either.
[00:03:21] So, step one, we're gonna compile in loose mode, we're gonna make sure our tests work and the goal here is we just want to get everything in TS files. And we wanna just have the compiler back off as much as it can and then we're gonna end with the test passing again, we're gonna merge it in.
[00:03:41] Step two, we want to go from allowing implicit anys to requiring that anys be explicit. So, in order to make that work, we're gonna have to download some type information, install reacts types, for example, I think those are already in. In places where things are a bit more complicated, we're not gonna wait until the types are perfect.
[00:04:05] We're just gonna say, explicit any, right, it's fine, cuz the goal is get your test passing again get that merged in and you've ratcheted up the compilers strictness a little bit because anys is must be explicit now. And then finally you're gonna wanna enable strict mode and my even more strict stuff.
[00:04:28] Even more strict mode that we talked about earlier like no unused locals, no unused parameters, etc. The need for explicit function return types that would come with this this level as well. Now, I made a mistake in my previous course, so I have to issue a correction here and it only reinforces what I've told you today.
[00:04:52] Apparently, when I recorded this last year, I did not have a very solid idea of exactly what strict true meant. Which is okay because in the class I saw no hands go up, nobody else knew either. So, it turns out these other options I didn't need to set them to true cuz strict was already gonna set them to true, at least by today's version of TypeScript.