Já precisou testar seu código front-end ou aquele novo framework MVVM e interagir com uma API? Já teve que configurar um servidor em Node.js ou escrever um monte de código para simular uma API.

Salvar os dados em um arquivo local ou ainda configurar um MongoDB só para realizar alguns testes ou modelar uma API e interagir com os verbos HTTP: 1. GET 2. POST 3. PUT 4. DELETE 5. OPTIONS

Felizmente, temos uma alternativa para isso. Com pouquíssimas linhas de código podemos simular um API Restful e interagir com ela (não só com o método GET, mas todos os outros) sem configurar um banco de dados.

Vamos ver como isso é possível neste primeiro artigo sobre o assunto.

Instalando as ferramentas necessárias

Abra seu Terminal/Shell e digite:

npm install -g json-server

Agora instale a extenção do Chrome para testes de HTTP/REST/Client neste link. Neste momento, já temos o necessário para esta primeira parte; então, mãos a obra.

Iniciando o projeto API de testes

Crie uma nova pasta onde preferir e abra seu Terminal/Shell nela. Agora, crie um arquivo chamado db.json e insira o seguinte código:

{
  "band": [
    {
      "name": "Metallica",
      "description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
      "active": true,
      "id": 0
    }
  ]
}

Este código vai funcionar como uma espécie de Model – algo similar ao que faríamos utilizando o mongoose.

Iniciando o servidor

Agora, vamos iniciar o servidor e ver o resultado. Abra seu Terminal/Shell e digite:

json-server db.json

Abra seu navegador e acesse a URL localhost:3000/band.

Você vai ver o resultado abaixo:

Esta formatação do browser é devido ao jsonview, uma extenção do Chrome para facilitar e visualização de arquivos JSON.

Adicionando registros

Para adicionar registros em nosso arquivo, você pode utilizar qualquer REST/Client, mas neste exemplo vamos utilizar o que instalamos logo acima.

Então, abra o dhc-resthttp-api-client e vamos inserir os seguintes dados, conforme a imagem:

Note que adicionei um campo para imagem.

Você pode notar que, após clicar no botão Send, logo abaixo já tem o resultado da requisição:

Agora é só alterar o verbo para GET e enviar novamente para ver o resultado:

Ou ir direto no browser e acessar: localhost:3000/band.

Consultando registros

Além de toda essa facilidade, podemos consultar registros individualmente e alterá-los.

No exemplo anterior, podemos ver dois registros, um com imagem e outro sem. Então vamos adicionar uma imagem ao registro 0.

Altere o verbo para PUT e passe o id no final do endpoint: localhost:3000/band/0. Adicione o campo picture e o link para imagem: http://placehold.it/350×150.

Clique em Send.

Logo após o envio você já pode conferir o resultado no console logo abaixo.

No próximo artigo mostro como inserir mais dados de uma forma diferente.