Set-up: Express com TypeScript
Tags: webdev, beginners, typescript, braziliandevs
Published: 2022-05-11 19:47:32

## Tabela de Conteúdos

- [TypeScript](#typescript)
- [Requisitos](#requisitos)
- [Scripts](#scripts)
- [Resumo](#resumo)
- [Links Úteis](#links-úteis)

---

## TypeScript

### Referências
- [Introdução ao TypeScript](https://dev.to/gabrielhsilvestre/introducao-ao-typescript-4oc3)
- [Tipagem Estática e Generics](https://dev.to/gabrielhsilvestre/typescript-tipagem-estatica-e-generics-3f01)

### Instalação
Por se tratar do desenvolvimento de uma API com Express e TS, devemos instalar o TypeScript como dependência do projeto, ou globalmente.

``` bash
npm i -g typescript  # instalação global na máquina
npm i -D typescript  # instalação como dependência de desenvolvimento
```

<br />

<small>[Voltar ao topo](#tabela-de-conteúdos)</small>

---

## Requisitos

### @types/node

O primeiro requisito que precisamos para começar a desenvolver aplicações Express com TypeScript é a tipagem do Node.js, essa que, por padrão, não é integrada a ferramenta.

``` bash
npm i -D @types/node
```

### Express + @types

O segundo requisito é o Express em si juntamente com sua tipagem, que assim como a do Node.js não vem junto do pacote principal, sendo necessário instalá-la manualmente.

``` bash
npm i express
npm i -D @types/express
```

### ts-node-dev

Essa é uma ferramente para desenvolvimento que realiza a compilação e inicialização do servidor a cada alteração realizada nos arquivos, aumentando a produtividade. Seu funcionamento é similar ao `nodemon`, porém além de reiniciar o servidor automaticamente, também compila os arquivos.

``` bash
npm i -D ts-node-dev  # é uma dependência opcional, porém facilita MUITO o desenvolvimento
```

<br />

<small>[Voltar ao topo](#tabela-de-conteúdos)</small>

---

## Scripts

### O que são?

São comandos definidos por nós para a execução de determinada ação, a inicialização de um servidor de desenvolvimento, ou a execução de testes, por exemplo.

### Scripts recomendados

Ao desenvolver uma aplicação Express com TS, podemos definir alguns scripts para facilitar o desenvolvimento.

#### dev

O script `"dev"` é comumente responsável por iniciar um servidor de desenvolvimento, sendo que normalmente esse servidor possui _hot reload_, ou seja, sempre que alterarmos nosso código, o servidor será reiniciado automaticamente para refletir tal mudança.

``` json
// package.json

{
  "dev": "ts-node-dev --inspect --transpile-only --ignore node_modules --respawn src/server.ts",
}
```

#### test

O script `test`, como o nome da a entender, é responsável pela execução dos testes da aplicação, sendo que o comando utilizado nesse script irá alterar dependendo da ferramenta utilizada, no exemplo abaixo o `mocha` é o framework de testes.

``` json
// package.json

{
  "test": "mocha ./tests/**/*$NAME*.test.js --exit"
}
```

Caso prefira escrever os testes em TypeScript também, o seguinte script pode ser utilizado:

``` json
// package.json

{
  "test": "mocha -r ts-node/register/transpile-only __tests__/**/*.spec.ts",
}
```

#### start

O script `start` por padrão contém todos os comandos necessários para iniciar a aplicação em ambiente de produção.

``` json
// package.json

{
  "start": "tsc && node dist/server.js"  // irá compilar e depois inicializar o servidor a partir do arquivo compilado
}
```

#### build

E por fim o script `build` é responsável por _"construir"_ nossa aplicação, ele deve receber comandos responsáveis por tal ação. No caso, como estamos focando em uma aplicação Express simples com TS, o nosso processo de _build_ será somente compilar o código, mas em aplicações mais complexas, que utilizem webpack por exemplo, os comandos seriam outros.

``` json
// package.json

{
  "build": "tsc"
}
```

<br />

<small>[Voltar ao topo](#tabela-de-conteúdos)</small>

---

## Resumo

### Instalação de dependências

``` bash
npm i express
```

``` bash
npm i -D typescript @types/node @types/express ts-node-dev
```

``` bash
npm i -D mocha chai chai-http sinon  # dependências opcionais* para testes
```

### Definição de scripts

``` json
{
  "scripts": {
    "start": "npm run build && node dist/server.js",
    "dev": "ts-node-dev --inspect --transpile-only --ignore node_modules --respawn src/server.ts",
    "test": "mocha ./tests/**/*$NAME*.test.js --exit",
    "build": "tsc"
  }
}
```

<br />

<small>[Voltar ao topo](#tabela-de-conteúdos)</small>

---

## Links Úteis

- [Express Docs - v4 reference](http://expressjs.com/en/4x/api.html)
- [DevHints - Express Cheat Sheet](https://devhints.io/express)
- [OverAPI - Express Cheat Sheet](https://overapi.com/express)
- [LogRocket - How to set up TypeScript with Node.js and Express](https://blog.logrocket.com/how-to-set-up-node-typescript-express/)
- [Medium (Amir Mustafa) - Node.js and Express.js with TypeScript](https://amirmustafaofficial.medium.com/node-js-and-express-js-with-typescript-d4ea7e61096)

<br />

<small>[Voltar ao topo](#tabela-de-conteúdos)</small>