[[TypeScriptはJavaScriptのスーパーセット]]です。そのため、[[TypeScript]]を理解するには[[JavaScript]]から学習をはじめるのが長い目で見ると効率的です。まず本クエストで[[JavaScript]]の実行環境を構築しましょう。
## Lesson
[[ランタイム]]には[[Deno]]を使います。[[TypeScript]]も[[JavaScript]]もそのまま実行でき、[[パッケージマネージャー]]、[[リンター]]、[[フォーマッター]]がバンドルされているため学習用途にも最適です。
<div class="link-card-v2">
<div class="link-card-v2-site">
<img class="link-card-v2-site-icon" src="https://cdn.svgporn.com/logos/deno.svg" />
<span class="link-card-v2-site-name">Deno</span>
</div>
<div class="link-card-v2-title">
Deno, the next-generation JavaScript runtime
</div>
<div class="link-card-v2-content">
Deno features improved security, performance, and developer experience compared to its predecessor. It's a great ...
</div>
<img class="link-card-v2-image" src="https://cdn.svgporn.com/logos/deno.svg" />
<a href="https://deno.com/"></a>
</div>
トップページのコマンドからインストールしましょう。もし、[[mise]]を使っている場合は以下のコマンドでもインストールできます。
```console
mise use -g deno
```
インストールが終わったら起動します。
```console
$ deno
Deno 2.1.5
exit using ctrl+d, ctrl+c, or close()
REPL is running with all permissions allowed.
To specify permissions, run `deno repl` with allow flags.
```
[[REPL]]として利用できます。変数を定義して足してみましょう。
```console
> const a = 10
undefined
> const b = 20
undefined
> a + b
30
```
`close()` またはショートカットキーで終了します。起動直後の実行ログに記載されています。
> ```console
> Deno 2.1.5
> exit using ctrl+d, ctrl+c, or close()
> ```
最後にソースコードを書いて実行してみましょう。`main.js` を作成します。
`main.js`
```js
const a = 10
const b = 20
console.log(a + b)
```
`deno` コマンドで実行します。
```console
$ deno run main.js
30
```
`deno run` コマンドは省略できます。
```console
$ deno main.js
30
```
## Mission 1
#🙂NORMAL
`main.js` に変更を加えたとき、毎回 `deno main.js` を実行しなくても自動で再実行されるようなコマンドを実行してください。
%%
解答例
```console
deno run --watch main.js
# または
deno --watch main.js
```
%%
> [!hint]- Hint 1
> `deno run -h` で表示された内容を見てみましょう。
---
*NEXT* >> [[📗TDQ-002 JavaScriptの開発環境構築]]