quarta-feira, 17 de junho de 2020

API Rest usando TypeScript

Olá pessoal, estou reativando o meu blog para falarmos sobre tecnologia e desenvolvimento, muitos assuntos foram obtidos durante esse tempo, e decidi que seria a melhor hora para voltar a falar sobre o que eu estudo/aprendo.

Neste post de retorno, gostaria de falar sobre Javascript, mas específico usando ele no back-end para criação de uma API REST.
Nesses meses e semanas de quarentena, decidi escolher uma stack de desenvolvimento para me aprofundar e desenvolver alguns projetos, venho estudado alguns tutoriais, vídeos aulas, e na primeira semana de junho, participei do evento gratuito da Rocketseat chamado: Next Level Week (NLW), que foi proposto um desafio de criar uma aplicação em uma semana, usando TypeScript, Knex e SQLite para a criação da API, e o sistema no Front-End e Mobile.

Neste projeto, o intuito inicial, foi a criação de um marketplace para coleta de resíduos, onde o usuário poderá cadastrar pontos de coleta e informar quais os tipos de resíduos que o ponto recebe.

Tendo ciência sobre o projeto, podemos iniciar com o gerenciador de pacotes:

NPM:

npm init            ou

YARN:

yarn init -y


Após o rodar o comando no terminal será criado o arquivo package.json
Recomendável realizar a instalação do TypeScript, podendo usar o comando:

yarn add -D typescript


Após a instalação do Typescript, podemos adicionar o Express (servidor)

yarn add express


Após as primeiras instalações, podemos estruturar as pastas do projeto, criando a pasta:

/src


Podemos criar o arquivo server.ts, como estamos trabalhando com TypeScript a extensão do arquivo é “.ts

Após a criação, iremos importar o Express:

import express from 'express';

const app = express();  -> Criação do app

app.use(express.json()); -> Esta linha serve para que o express entenda a

que as requisições em formato JSON.


Para utilizarmos as funções do Express, junto com o TypeScript, podemos instalar o pacote das tipagens, assim quando digitamos por exemplo “app.”, o VSCode (ou outra IDE de desenvolvimento), conseguirá identificar quais são as funções disponíveis do express().

Para instalar o pacote de tipagens usando:

NPM:

npm i @types/express            ou

YARN:

yarn add @types/express -D


Após instalar, já podemos ver a função listen, que escutará a porta “3333”, conforme código abaixo:

app.listen(3333); -> Execução do app na porta 3333

Após definido a porta de comunicação do servidor, já podemos criar as nossas rotas da aplicação

Rotas: Quando acessamos algum endereço por exemplo: localhost:3333/users, essa url seria uma rota, no exemplo abaixo a rota seria apenas "/", mais conhecido como rota raiz.


app.get('/', (request,response=> {

    
    /* Ação quando o usuário acessar a rota definida no primeiro 
    parâmetro, após o verbo HTTP GET. */
    
    return response.json( {message: "Olá Mundo"});
});

Caso precisamos que a API retorne todos os usuários, podemos fazer uma rota semelhante a essa:

Para atender a rota:  localhost:3333/users

app.get('/users', (request,response=> {
    
    /* Irei criar um objeto JSON apenas para exemplificar, 
    mas no cenário real, esse objeto seria retornado através 
    de uma pesquisa no banco. */
    
    return response.json( {
        'Gabriel',
        'Fernando',
        'José',
        'Joaquim'
    });
});

Caso precisamos que a API cadastre um usuário, podemos fazer uma rota semelhante a essa:

app.post('/users', (request,response=> {
    
    /* Quando acesso request.body, ele retornará os dados (corpo) 
    da requisição, que nesse caso seria o usuário informado 
    para ser cadastrado. */

    const {nomesobrenome,idadecidade= request.body; 

    /* Tendo esses dados em um objeto, podemos definir como salvar
    esses dados em algum banco e até realizarmos as validações, 
    após esse processo, podemos retornar o usuário salvo. */

    const usuarioCadastrado = {nome,sobrenome,idade,cidade};
    
    return response.json (usuarioCadastrado);
});

Existem mais conceitos que foram usados e que irei citar em novas publicações como o Knex e SQLite e etc., e também pretendo complementar esse projeto com novas funcionalidades. 
O código completo da API já está no meu github.

Sigam-me nas redes sociais: