Apredendo construção de apis com node e TypeScript

Michael Moranis - Nov 2 - - Dev Community

Configuração de typescript com node js para rodar o servidor ou mostrar algo na tela.

Passo 1. Para inicializar o projeto e instalar dependencias.

npm init -y 
Enter fullscreen mode Exit fullscreen mode

para criar um arquivo package.json.

  1. instalação do typescript e os tipos para node js.
npm install typescript @types/node --save-dev
Enter fullscreen mode Exit fullscreen mode

Passo 2. Criar arquivo de configuração tsconfig.json

1. Esse arquivo vai servir para configurações principais do do node js.

rode o comando:

npx tsc --init 
Enter fullscreen mode Exit fullscreen mode

3. configurações principais do node js com ts no arquivo tsconfig.json .

{
  "compilerOptions": {

    "target": "es2016",                                  
    "skipLibCheck": true,
    "module": "CommonJS",
    "outDir": "./dist",
    "strict": false,
    "esModuleInterop": false,
  },
  "include": ["src"],
  "exclude": ["node_modules"]
}
Enter fullscreen mode Exit fullscreen mode

4. configuração de scripts para compilação e execução no package.json.

"scripts": {
  "build": "tsc",
  "start": "node dist/index.js",
  "dev": "ts-node-dev --respawn --transpile-only src/index.ts"
}
Enter fullscreen mode Exit fullscreen mode

Usar ts-node-dev para rodar codigo em desenvolvimento recompilando automaticamente ao detectar alterações.

Instalação do ts-node-dev.

npm install ts-node-dev --save-dev
Enter fullscreen mode Exit fullscreen mode

Pequeno exemplo de um servidor apenas usando node js sem libs externas.


import { createServer } from 'node:http'

const server = createServer((request, response) => {
    console.log("hello")

    response.write('michael esta no servidor')
   return  response.end()
})


server.listen(3333)
Enter fullscreen mode Exit fullscreen mode

Utilização de frameworks para desenvolvimento de Apis em especial o uso do Fastify

Instalação do Fastify no projeto.

  1. Rode o comando:
npm install fastify 
Enter fullscreen mode Exit fullscreen mode
  1. O uso do Fastify vai facilitar o desenvolvimento da api porque simplifica a escrita do codigo e facilita o redirecionamento das rotas no projeto.

Exemplo em urls

Urls com metodo post, delete, get e put as mais usadas.

// POST localhost:3333/videos
// DELETE localhost:3333/videos/1 no caso de ter um id especifico para itens usa-se o especificador dele

Exemplo de uso do fastify para criação de rotas ou endpoints

import { fastify } from 'fastify'

const server = fastify()

server.get('/', () => {
    return "hello"
})

server.listen({
    port: 3333
})
Enter fullscreen mode Exit fullscreen mode

Principais operações feitas usando apis é o famoso CRUD (create, read, update, delete)

No crud refletido no codigo será o uso dos metodos http POST PUT DELETE GET

Para fins de estudos vou utilizar primeiramente um banco de dados em memória, usando uma estrutura de dados.

  1. Crio um novo arquivo chamado database-memory.ts e crio minha classe que será meu banco de dados em memória.
import { randomUUID } from "node:crypto"

export class DataBaseMemory {
    #videos = new Map()

    list() {
        return this.#videos.values()
    }

    create(video) {
        const videoId = randomUUID()

        this.#videos.set(videoId, video)
    }

    update(id, video) {        
        this.#videos.set(id, video)
    }

    delete(id) {
        this.#videos.delete(id)
    }
}
Enter fullscreen mode Exit fullscreen mode
  1. Na utilização do metodo post para enviar dados para ser armazenado ou modificado com metodos do tipo PUT deve enviar dados no corpo da requisição por meio do uso de request.body veja exemplo:
import { fastify } from 'fastify'
import { DataBaseMemory } from '../database/databaseMemory'

const server = fastify()

const database = new DataBaseMemory()

server.post('/persona', (request, reply) => {
    const {title, description, age } = request.body

    database.create({
        title,
        description,
        age
    })

    console.log(database.list())

    return reply.status(201).send()
})
Enter fullscreen mode Exit fullscreen mode

API completa com todas as rotas configuradas e funcionando no banco de dados em memória.

import { fastify } from 'fastify'
import { DataBaseMemory } from '../database/databaseMemory'

const server = fastify()

const database = new DataBaseMemory()

server.post('/persona', (request, reply) => {
    const {title, description, age } = request.body

    database.create({
        title,
        description,
        age
    })

    console.log(database.list())

    return reply.status(201).send()
})

server.get('/persona', () => {
    const persona = database.list()

    console.log(persona)
    return persona
})

server.put('/persona/:id', (request, reply) => {
    const {title, description, age } = request.body
    const personaId = request.params.id

   database.update(personaId, {
        title,
        description,
        age
    })

    return reply.status(204).send()
})

server.delete('/persona/:id', (request, reply) => {
    const personaId = request.params.id
    database.delete(personaId)
    return reply.status(200).send()
})


server.listen({
    port: 3333
})
Enter fullscreen mode Exit fullscreen mode
. . .