JavaScript FullStack - Como criar um API com JavaScript e NodeJS

Marco Bruno
CollabCode
Published in
5 min readMay 9, 2017

Este é o segundo post de uma série que estou fazendo enquanto desenvolvo um chatbot focado em apoiar a divulgação dos eventos de tecnologia.
No primeiro post nós aprendemos a criar um chatbot no Telegram utilizando JavaScript. Neste, nosso foco será em criar um API Rest com o poder de responder uma lista de eventos cadastrados com o nome, data e link. Faremos isso para concluirmos de fato a primeira funcionalidade que começamos no post anterior. Nosso objetivo é separar a camada do chatbot dos dados que estarão no banco e que nossa API consumirá.

Ah! Neste post não faremos o banco de dados, deixaremos essa parte para o próximo post.

Agora que já temos o nosso objetivo, vamos começar o nosso projeto.

O código desse post está no GitHub do CollabCode.

Criando uma API Rest com ExpressJS

Abra o seu terminal e crie uma pasta no seu desktop (área de trabalho) com o nome de eventos-tech-api, dentro desta pasta ficará todo o nosso projeto, portanto precisamos criar um arquivo package.json e uma pasta chamada src:

~$ cd Desktop
~/Desktop$ mkdir eventos-tech-api && cd eventos-tech-api
~/Desktop/eventos-tech-api$ mkdir src
~/Desktop/eventos-tech-api$ npm init

Despois de rodar o comando npm init, você será atacado por 9 perguntas sobre o seu projeto, após repondê-las será gerado um package.json que conterá as informações da nossa API com NodeJS. Nossa estrutura de pasta ficará assim:

No próximo passo criaremos um servidor HTTP com ExpressJS, sendo assim, precisamos adicionar o ExpressJS como dependência:

~/Desktop/eventos-tech-api$ npm install --save express

Por favor, crie um aquivo com o nome de app.js dentro da pasta src. Dentro desse arquivo criaremos o nosso servidor web utilizando o ExpressJS:

const express = require('express')
const app = express()
const port = 3001
const allEvents = [
{
name: 'QConSP',
data: ['24/04/2017', '25/04/2017', '26/04/2017'],
link: 'http://qconsp.com'
},
{
name: 'FrontInSampa',
data: ['01/07/2017'],
link: 'http://www.frontinsampa.com.br'
},
{
name: 'FrontInVale',
data: ['16/07/2017'],
link: 'https://www.eventick.com.br/frontinvale2017'
}
]
app.get('/allevents', (req, res) => res.json(allEvents))app.listen(port, () => {
console.log(`Server running at http://localhost:${port}`)
console.log('To shutdown the server: ctrl + c')
})

Ah! Se você está vendo pela primeira vez como criar um servidor web com ExpressJS, recomendo você dar uma lida no post: Como criar um servidor HTTP com ExpressJS ou se quiser aprender a criar um aplicação do zero com NodeJS, você pode me visitar no curso de NodeJS da Caelum.

Bora subir a nossa API e ver se ela está conseguindo responder a rota /allevents. Para subir nossa aplicação basta rodar o comando abaixo:

~/Desktop/eventos-tech-api$ node src/app.js

Como fazer para o NodeJS reiniciar sozinho quando um arquivo for alterado?

Pera lá. Toda vez que alteramos o código da nossa API, será necessário derrubar o servidor e iniciá-lo. Em vez de ficarmos sofrendo com isso podemos instalar o nodemon que fica verificando se tem alguma alteração nos arquivos do projeto e quando tiver, ele mesmo se encarrega de reiniciar o servidor. Por isso, vamos instalar o nodemon, abra seu terminal e execute o comando abaixo:

~/Desktop/eventos-tech-api$ npm i -g nodemon

Daqui pra frente em vez de escrever install vou utilizar o i que fará a mesma coisa pra gente. O parâmetro -g significa que o nodemon será instalado de forma global, sendo assim podemos usá-lo em qualquer projeto enquanto estivermos codando na nossa máquina. :-)

Com o nodemon instalado podemos derrubar o servidor da nossa API que subimos com o node e utilizarmos o nodemon no lugar:

~/Desktop/eventos-tech-api$ nodemon src/app.js

Se tudo deu certo você terá uma saída similar no seu terminal:

[nodemon] 1.11.0
[nodemon] to restart at any time, enter `rs`
[nodemon] watching: *.*
[nodemon] starting `node src/app.js`
Server running at http://localhost:3002
To shutdown the server: ctrl + c

Agora só precisamos subir o chatbot que desenvolvemos no primeiro post. Se você não leu o primeiro post, pode pegar o código do chatbot nessa URL do GitHub: https://github.com/MarcoBrunoBR/eventos-tech-bot/tree/1e4eb0645d6bbb769659b5ac385d0bb38a89e33f

Considerarei que você deixará o projeto do chatbot também no desktop, se fez isso é só rodar os comandos abaixo em outro termial que o servidor do chatbot estará de pé:

~$ cd ~/Desktop/eventos-tech-bot
~/Desktop/eventos-tech-bot$ nodemon src/app.js

Agora que tanto a nossa API quanto o chatbot estão de pé, precisamos alterar o nosso chatbot para consumir a API que acabamos de desenvolver.

Colocando o nosso ChatBot EventosTechBot para conversar com a nossa API

Para que o nosso chatbot converse com a API que estamos desenvolvendo, vamos instalar uma dependência no nosso projeto chamada request, que tem o poder de realizar requisições para a nossa API e ficar aguardando as respostas delas:

~/Desktop/eventos-tech-bot$ npm i --save request

Dentro da pasta eventos-tech-bot temos um arquivo app.js que está dentro da pasta src, por favor abra este arquivo no seu editor favorito para colocarmos o nosso chatbot para conversar com nossa API. Lembre-se que utilizaremos o módulo chamado request que acabamos de baixar:

'use strict'const request = require('request')
const urlApi = 'http://localhost:3002'
const Telegram = require('telegram-node-bot')
const TelegramBaseController = Telegram.TelegramBaseController
const TextCommand = Telegram.TextCommand
const chatbot = new Telegram.Telegram('SEU_TOKEN')
class EventsController extends TelegramBaseController {
sendMessage(scope, msg) {
scope.sendMessage(msg)
}

allEventsAction(scope) {
let pathApi = '/allevents'
let msg = ''
request.get(`${urlApi}${pathApi}`, (error, response, body) => {
msg += JSON.parse(body).map((event) => `${event.data.toString().replace(/,/g, ' e ')} - ${event.name} - ${event.link}\n`)
this.sendMessage(scope, msg.replace(/,/g, ''))
})
}
get routes() {
return {
'allEvents': 'allEventsAction'
}
}
}
chatbot.router
.when(
new TextCommand('/allevents', 'allEvents'), new EventsController()
)

Como estamos utilizando o nodemon para rodar o nosso servidor, basta você salvar o seu arquivo que servidor será reiniciado e o nosso chatbot estará conversando com aAPI que acabamos de desenvolver. Ah! Todo a parte que está em negrito no código é o que adicionamos, usei um pouco de funcional ali ;-)

Se ficou qualquer dúvida por favor não deixe de perguntar nos comentários ou se preferir pode me adicionar nas redes socias da vida por MarcoBrunoBR.

No próximo post colocaremos o banco de dados na parada, ainda não sei qual é banco que vamos utilizar, pedirei ajuda para o Fernando Willian já que ele sabe essa paradas de banco de dados.

--

--

Marco Bruno
CollabCode

Migrei de palhaço para Dev. Front-End/UX e agora eu trabalho como streamer de código