Node.js agora suporta TypeScript nativamente (feat Marco Ippolito - lider da iniciativa no Node.js)

TypeScript running natively on Node. js. Yes, this is part of one of the dreams that many had and the stop is now functional.

Having TypeScript support is already the most requested feature by the community and this request has finally been met. In this video I will show you how this support is working in version 23 of Node. js, which was recently released.

Oh, and having TypeScript running natively in Node. js is something so incredible that I brought the leader of the initiative to today's video to talk about the reasons why this has finally come out, what the expectations are for the future and what 's already in the pipeline. oven.

For this video I create a relatively complex project to show you that the stop is really working using one of the most powerful TypeScript features that exists to date. So, leave a like on the video, tell me in the comments what you want to learn here on the channel and let's get to the video. And I'm part of the Node.

js project. Today I'm no longer as active as I used to be , but I work on the native testing engine team and I had the great honor of creating a feature from scratch and seeing it being promoted to a stable stage in the project. I can now put it on the board in the room, huh bro.

And for me it's incredible to see the speed and quality that Node. js is advancing. For those of you who are floating around and didn't know that Node.

js now supports TypeScript, don't worry, in this video I'll give you all the details. In essence, the decision was: Let's not rely on TypeScript configuration files , Let's not run type checks or have transpilation steps , like the TypeScript flow normally works. In fact, we're going to use a technique called strip types.

In other words, when executing your project, Node. js removes TypeScript types by transforming them into JavaScript. Ahhh Eric, if you're not doing validations or checks, how is that a positive thing?

The main idea is to help you have a better experience in JavaScript projects. And your editor will do these checks. Today, VSCode in JavaScript doesn't understand very well what you are calling in individual modules.

And it gets lost in showing which functions to call. It often shows as if a variable function did not exist and takes a lot of trial and error. It's common to code a function, import it into another file and only notice after running the project that the name of the function has an extra word and gives those famous words "undefined is not a function" What about performance?

How will it affect the project? Node. js chose to follow the same strategy and even library used in Deno, the SWC or in English Speed ​​Web Compiler, which was created to take TypeScript or JavaScript with the latest functions and generate code that works in older browsers.

So, performance will not be a problem, as it is a form validated by the market of runtimes out there. The leader of the initiative is called Marco Ippolito, an amazing guy who I've had the pleasure of meeting at various events around the world. He is Italian and has been working on the Node.

js project for a long time and he is the person I interviewed to let you know more about this amazing feature . He created a roadmap of what the project could be in the future and was the person responsible for listening to the community, listening to suggestions on how to make this impactful feature finally get off the ground. This is a new format that I'm bringing here on the channel, huh?

I want to bring more contributors and important people like Marco to come here on the channel and tell us straight from the source what to expect for the future of the platform. I think you're probably curious to hear what Marco has to say, right? So, get there, Marco!

Tell me who you are! Yeah, so my name is Marco Ippolito, and I'm a member of the Node. js Technical Steering Committee.

Lately, I've been working on the native TypeScript integration on Node. js. So if you haven't checked out, this is the time.

Nice, so this is why we are here, right? Because it's been a long time I've been hearing, like we should have TypeScript in Node. js, but we finally got it.

So why does this happen now? And is it the same TypeScript we are using on other platforms? There's some magic behind the scenes happening.

Yeah, so there are multiple factors that contributed to having the TypeScript integration finally landed. First of all is TypeScript becoming extremely popular in the ecosystem. Also a lot of work on the CJI, CSM interoperability, on the Node Core.

So a lot of small factors allowed me to create the PR that integrated TypeScript. It's not the usual TypeScript that you use because we decided to go through a different path from other runtimes, which is strip typing. Which basically means that you take the TypeScript that you know, remove everything, all the types and the output, if it's a valid JavaScript, it will run.

Otherwise it will not work. Yeah, in my opinion, this is amazing because it's trying to improve the developer experience, right? We're gonna improve your IntelliSense on VS Code and we get everything that is pretty good from TypeScript.

However, it's not TypeScript running, right? So what is behind the scenes? Is it any library behind the scenes?

Yeah, so we use SWC, which is a very popular TypeScript transpiler, which is also used by Dino. So it has been battle tested, let's say. But we use it in the form of Wasm.

And we have a slightly different configuration from the standard one. So for example, in the normal strip types mode, you cannot use enums or namespaces, but you don't need to source mobs because we use magic technique, which is called blank spacing, which takes all the TypeScript and replaces it with blank space. So we don't lose the original location and we don't need source map, which makes it faster.

But as a con, if you want to use enums, namespaces, so TypeScript features that require transformation, you need to use the dash dash experimental transform types flag, which enables it, but it also enables source maps. Amazing, amazing. In your opinion, how important is it to have TypeScript in Node.

js? So like, I think this has been one of the most requested features in years. We can also see that from our service, yearly survey.

This is going to improve the developer experience by a lot. And I think it's also going to change the way that we use TypeScript because, for example, in TypeScript 5. 7, the TypeScript team releases a new flag that finally supports TypeScript run times, like Node.

js, Bonn, and Dino, so that you can use the . js extension. And when you compile, it will rewrite it to the .

js extension. How do you think the packaging community is going to be seeing this? Do you think everyone's going to be writing TypeScript from now on, or are they going to keep writing in JavaScript and let userland do whatever they want?

So this has been a bit controversial because we don't want to allow like package maintainers to publish packages fully TypeScript. We still want package maintainers to compile into JavaScript. This is because there are several reasons the first one is that you might have different TypeScript TS config options, so it might be incompatible, but also because of the IDE that needs to perform type checking, it needs to go deep into your node modules, which is not good for performance, and there are a lot of other factors.

So we still want NPM packages to be published in JavaScript, but if you have an application for your company, you can write it in TypeScript and it should work out of the box. Nice, I saw the roadmap that I'm going to put in the video description later, but I saw like, well, typing stripping, it's going to be the one thing to go. So do you think we're going to have like TypeScript configuration files or adding more complexity, or is this the way to go from now on?

So I hope that this is the way to go for runtimes. I also created an NPM package called Amaro, which basically performs the same, it works in the same way that the Node Core does, but I plan to add more features there, yes, config support, so everything, it will be an external loader , so an NPM package that you can download, but it will be maintained by Node Core people. So also that if people want to get involved and start contributing to it, that's a good place to start.

Amazing, this is the whole thing right now, right? It's experimental, so we need people who are watching now to help us understand what we could do better. However, I've seen like a lot of suggestions, a lot of ideas and some things that I've never thought about it.

So it's amazing how the community, it's not like a one-man job, right? It's the whole community listening to them and finally getting it worked. (laughing) Amazing, Marco.

So thank you so much for being part of this. I'm gonna need you, who's watching now, to comment here if we should try doing some podcasts with Marco as well, because imagine how much and how many ideas we can get from here, right? (laughing) Thank you.

All right, so if you have any less words for the audience, what do you think for the future and how are you expecting this whole thing to be in the next few years? Yeah, so please give it a try. We need feedback, so if you want to start experimenting and experimenting with it, please go ahead.

I think this is the right way and hopefully it will be standardized in the future and types will become part of JavaScript. Amazing, so thank you so much and until next time. (laughing) Marco is an incredible person, I've already exchanged a lot of ideas at events with everyone.

And if you want to know first and foremost what will happen with Node. js, I advise you to subscribe to this channel, leave a like, of course, follow Marco on X and other social networks. For the show me decode, I created a project that uses a design pattern called Generic Repository, where you create abstractions, create templates and only reuse the classes to gain all the behavior.

So, let's see it in practice? As usual, I've already created a project here for you, so you can see what I'm going to do. So do the following, look, click, leave the star on the project and go up.

So, hey, you can fork the project or you can simply clone it. Let's go to VS Code in an empty folder. I'm going to close this here.

I'm going to do a git clone and go to the folder for this project. The most incredible thing about this, look, you'll see, there are no dependencies here, you don't need to install anything, right? But it's important to use Node.

js in version 22, at least, right, which is where this guy was started . So I'm going to use NVM Use 22. So if you don't have NVM, man, do some research, because this helps a lot to exchange fun with Node.

js and you see first of all. Use 22 and I will also give the NVM alias default give the NVM alias default 22 so Node. js knows that it is version 22 that I want to use.

Beauty? Npm start. And look how cool, hey, he showed the warning for the project, but he's saying, hey, man, apparently the project is working.

So let's take a look at how this works, how this generic repository works. Here, look, what did I do, right? I created the entities, then the properties that my project will work on.

So look, bro, it's real typescript , right, man. I have the student here too, look, I created it for him and what's the point of all this? I created the first one, a base class.

First I actually created an interface, right? Interface is the contract for how they go work, what they have to implement and their return types and parameters. Beauty?

In basic, what did I do? I created a generic repository, that is, whoever uses this guy here will have to extend this class and pass the data type. So look, look, here I already have the entire implementation.

I don't know what type T is, right? But whoever implements it will work in the same way. Perfect, so if I go to the repository, how do I simply get all this crude for the product, for example?

Look how easy it is, just extend the class and do it. Extend the class, product patience and the business already works, you don't need to go through anything. For a student, same thing.

So what do we generally use it for? We have already created a template, right, also known as a template method for this type of project, we just re-use all the abitration and then you don't need to keep replicating all of this. Well, I did the same for service.

So, I also created an interface in the service and created the base implementation there. Notice, the base only receives the repository and performs a review. It's just passing by, but look, it reminds me of type T, that is, I don't know what type it is.

But when I implement the concrete class, then we can see that it is the project. He's making some mistakes here, but probably something in my VS Code, right, that we saw that the project is working. Well, how do we use these guys?

What do I like to do, right? There is another design pattern called Factory. So Factory is responsible for aligning all dependencies and delivering the ready object.

So at the Product Factory, what do I do? I initialize the repository and the repository is a dependency on service and I only return the service. Same thing for the student.

So I create this instance, all the dependencies I need from a single file and I don't need to keep recreating them. So whoever suddenly needs to register someone in the database , list items, will always use Factor. And there in my Index, what happens?

In my Index, I just initialize, look how cool, look, I called the Factories here, I created my objects there than the entities, I can create a product and look how cool, I already get the Create, I already get the Update and the Delete, without having to implement anything for them. So this is a summary of what the generic repository is for you, but it's to show that using generic types is only in TypeScript, right? JavaScript doesn't have this type of functionality, which is why TypeScript will be really cool for us.

Okay, so how is it working under the panels, right? We can see that he is using these strip types, right? That he basically takes our functions here and he goes remove these words from TypeScript 's type .

If it suddenly needs some transformation, as is the case with namespaces in TypeScript, we have another flag that is for Transform too. Beauty? So what am I going to do?

I'll leave it here in the video description so you can also take a look at other references, so you can see how this is all working, you saw that it's in a trial period, but look how cool it is, without installing any library, I already have it TypeScript working and validating my data. Well, what happens if I suddenly change this name here to Ana 2? Look how cool, he 's going to say, this type doesn't exist.

How does he know that, right? It's TypeScript running in VS Code in this case, so TypeScript understands that they are TS files and it is executing and validating the data. So this will only be an error when viewing.

If I run this project with it the way it is, we will see that the project doesn't break, look, it hasn't broken at all. Why? Why didn't it break at all?

I came here, in Name, here in opdate and changed it to Name 1, look how cool it is, it only gives under file. Normally TypeScript will say, damn, I can't transpile this code because it isn't passing validation. So here validation only happens during the time we are writing the code.

Okay, practice , give a lot of feedback and comment if you want to see. I brought more TypeScript projects here on the channel. It's incredible to notice and monitor changes in projects as large as Node.

js to see that the direction of the project is always aligned with what people want and ask for. If you want to learn more about JavaScript, TypeScript, Node. js, performance, good practices and for free, come to my programming academy.

I left two free super-trainings on Node. js and server applications so you can continue learning and evolving a little more every day. Invite people over and let's specialize in the most popular language in the world.

And for you warriors who made it this far, comment: I'M HERE so I know that you came to this moment in the video. Also tell me what kind of videos you would like to see on the channel. I'm thinking about returning to weekly lives and your opinion is extremely valuable for me to continue all this work.

I also invite you to take a look at the channel's playlists, which have a lot of content that you won't find anywhere else. I hope this video exceeded your expectations. I'm Erick Wendel and I'll see you in the next video.