Skip to content

Commit 0d8b26f

Browse files
AugustinMauroyaduh95bmuenzenmeyer
authored and
joeeames
committed
content(learn): update resources about typescript (nodejs#6951)
* content(learn): update ressources about typescript * adding important note * content(learn): update from feedback Co-Authored-By: Antoine du Hamel <[email protected]> * content(learn): remove global install of tsc * fix fails from github copilot fix fails from github copilot * fix: remove old stuff from navigation * update * update * Update from feedback Co-Authored-By: Brian Muenzenmeyer <[email protected]> --------- Co-authored-by: Antoine du Hamel <[email protected]> Co-authored-by: Brian Muenzenmeyer <[email protected]>
1 parent aebf171 commit 0d8b26f

File tree

9 files changed

+294
-195
lines changed

9 files changed

+294
-195
lines changed

‎apps/site/navigation.json

+21-4
Original file line numberDiff line numberDiff line change
@@ -167,10 +167,6 @@
167167
"link": "/learn/getting-started/nodejs-the-difference-between-development-and-production",
168168
"label": "components.navigation.learn.gettingStarted.links.nodejsTheDifferenceBetweenDevelopmentAndProduction"
169169
},
170-
"nodejsWithTypescript": {
171-
"link": "/learn/getting-started/nodejs-with-typescript",
172-
"label": "components.navigation.learn.gettingStarted.links.nodejsWithTypescript"
173-
},
174170
"nodejsWithWebassembly": {
175171
"link": "/learn/getting-started/nodejs-with-webassembly",
176172
"label": "components.navigation.learn.gettingStarted.links.nodejsWithWebassembly"
@@ -189,6 +185,27 @@
189185
}
190186
}
191187
},
188+
"typescript": {
189+
"label": "components.navigation.learn.typescript.links.typescript",
190+
"items": {
191+
"introduction": {
192+
"link": "/learn/typescript/introduction",
193+
"label": "components.navigation.learn.typescript.links.introduction"
194+
},
195+
"transpile": {
196+
"link": "/learn/typescript/transpile",
197+
"label": "components.navigation.learn.typescript.links.transpile"
198+
},
199+
"run": {
200+
"link": "/learn/typescript/run",
201+
"label": "components.navigation.learn.typescript.links.run"
202+
},
203+
"runNatively": {
204+
"link": "/learn/typescript/run-natively",
205+
"label": "components.navigation.learn.typescript.links.runNatively"
206+
}
207+
}
208+
},
192209
"asynchronousWork": {
193210
"label": "components.navigation.learn.asynchronousWork.links.asynchronousWork",
194211
"items": {

‎apps/site/pages/en/learn/getting-started/nodejs-with-typescript.md

-185
This file was deleted.

‎apps/site/pages/en/learn/typescript/introduction.md

+50
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
---
2+
title: Introduction to TypeScript
3+
layout: learn
4+
authors: sbielenica, ovflowd, vaishnav-mk, AugustinMauroy
5+
---
6+
7+
# Introduction to TypeScript
8+
9+
## What is TypeScript
10+
11+
**[TypeScript](https://www.typescriptlang.org)** is an open-source language maintained and developed by Microsoft.
12+
13+
Basically, TypeScript adds additional syntax to JavaScript to support a tighter integration with your editor. Catch errors early in your editor or in your CI/CD pipeline, and write more maintainable code.
14+
15+
We can talk about other TypeScript benefits later, let's see some examples now!
16+
17+
## First TypeScript code
18+
19+
Take a look at this code snippet and then we can unpack it together:
20+
21+
<!--
22+
Maintainers note: this code is duplicated in the next article, please keep them in sync
23+
-->
24+
25+
```ts
26+
type User = {
27+
name: string;
28+
age: number;
29+
};
30+
31+
function isAdult(user: User): boolean {
32+
return user.age >= 18;
33+
}
34+
35+
const justine = {
36+
name: 'Justine',
37+
age: 23,
38+
} satisfies User;
39+
40+
const isJustineAnAdult = isAdult(justine);
41+
```
42+
43+
The first part (with the `type` keyword) is responsible for declaring our custom object type representing users. Later we utilize this newly created type to create function `isAdult` that accepts one argument of type `User` and returns `boolean`. After this, we create `justine`, our example data that can be used for calling the previously defined function. Finally, we create a new variable with information on whether `justine` is an adult.
44+
45+
There are additional things about this example that you should know. Firstly, if we do not comply with the declared types, TypeScript will inform us that something is wrong and prevent misuse. Secondly, not everything must be typed explicitly—TypeScript infers types for us. For example, the variable `isJustineAnAdult` is of type `boolean` even if we didn't type it explicitly, and `justine` would be a valid argument for our function even though we didn't declare this variable as of `User` type.
46+
47+
## How to run TypeScript code
48+
49+
Okay, so we have some TypeScript code. Now how do we run it?
50+
There are few possible ways to run TypeScript code, we will cover all of them in the next articles.

‎apps/site/pages/en/learn/typescript/run-natively.md

+38
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
---
2+
title: Running TypeScript Natively
3+
layout: learn
4+
authors: AugustinMauroy
5+
---
6+
7+
> **⚠️WARNING⚠️:** All content in this article uses Node.js experimental features. Please make sure you are using a version of Node.js that supports the features mentioned in this article. And remember that experimental features can change in future versions of Node.js.
8+
9+
# Running TypeScript Natively
10+
11+
In the previous articles, we learned how to run TypeScript code using transpilation and with a runner. In this article, we will learn how to run TypeScript code using Node.js itself.
12+
13+
## Running TypeScript code with Node.js
14+
15+
Since V22.6.0, Node.js has experimental support for some TypeScript syntax. You can write code that's valid TypeScript directly in Node.js without the need to transpile it first.
16+
17+
So how do you run TypeScript code with Node.js?
18+
19+
```bash
20+
node --experimental-strip-types example.ts
21+
```
22+
23+
The `--experimental-strip-types` flag tells Node.js to strip the type annotations from the TypeScript code before running it.
24+
25+
And that's it! You can now run TypeScript code directly in Node.js without the need to transpile it first, and use TypeScript to catch type-related errors.
26+
Future versions of Node.js will include support for TypeScript without the need for a command line flag.
27+
28+
## Limitations
29+
30+
At the time of writing, the experimental support for TypeScript in Node.js has some limitations. To allow TypeScript to run in node.js, our collaborators have chosen to only strip types from the code.
31+
32+
You can get more information on the [API docs](https://nodejs.org/docs/latest/api/typescript.html#unsupported-typescript-features)
33+
34+
## Important notes
35+
36+
Thanks to all the contributors who have made this feature possible. We hope that this feature will be stable and available in the LTS version of Node.js soon.
37+
38+
We can understand that this feature is experimental and has some limitations; if that doesn't suit your use-case, please use something else, or contribute a fix. Bug reports are also welcome, please keep in mind the project is run by volunteers, without warranty of any kind, so please be patient if you can't contribute the fix yourself.

‎apps/site/pages/en/learn/typescript/run.md

+49
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
---
2+
title: Running TypeScript with a runner
3+
layout: learn
4+
authors: AugustinMauroy
5+
---
6+
7+
# Running TypeScript with a runner
8+
9+
In the previous article, we learned how to run TypeScript code using transpilation. In this article, we will learn how to run TypeScript code using a runner.
10+
11+
## Running TypeScript code with `ts-node`
12+
13+
[ts-node](https://typestrong.org/ts-node/) is a TypeScript execution environment for Node.js. It allows you to run TypeScript code directly in Node.js without the need to compile it first. Note, however, that it does not type check your code. So we recommend to type check your code first with `tsc` and then run it with `ts-node` before shipping it.
14+
15+
To use `ts-node`, you need to install it first:
16+
17+
```bash
18+
npm i -D ts-node
19+
```
20+
21+
Then you can run your TypeScript code like this:
22+
23+
```bash
24+
npx ts-node example.ts
25+
```
26+
27+
## Running TypeScript code with `tsx`
28+
29+
[tsx](https://tsx.is/) is another TypeScript execution environment for Node.js. It allows you to run TypeScript code directly in Node.js without the need to compile it first. Note, however, that it does not type check your code. So we recommend to type check your code first with `tsc` and then run it with `tsx` before shipping it.
30+
31+
To use `tsx`, you need to install it first:
32+
33+
```bash
34+
npm i -D tsx
35+
```
36+
37+
Then you can run your TypeScript code like this:
38+
39+
```bash
40+
npx tsx example.ts
41+
```
42+
43+
### Registering `tsx` via `node`
44+
45+
If you want to use `tsx` via `node`, you can register `tsx` via `--import`:
46+
47+
```bash
48+
node --import=tsx example.ts
49+
```

0 commit comments

Comments
 (0)