JavaScript FullStack - Como criar um Chatbot no Telegram em NodeJS

Published in

CollabCode

9 min readApr 12, 2017

Por favor, se você estiver lendo esse post e ele estiver com os prints desatualizados ou qualquer coisa não funcionar me avisa por comentário ou pode me adicionar nas redes socias para me avisar, você me achará por @MarcoBrunoBR

Não sei o porquê, mas nos últimos meses resolvi me divertir criando uns chatbots. Essa diversão acabou que se transforma em um projeto no GetNinjas que o Otavio Valadares e eu começamos a desenvolver no HackDay GetNinjas, evento que acontece na última sexta-feira do mês, nesse dia nós podemos escolher no que vamos trabalhar. Ah! O projeto que estamos desenvolvendo é um chatbot para ajudar no atendimento de clientes.

Para mostrar a experiência que estamos tendo no desenvolvimento de um chatbot, farei uma série de posts de um segundo chatbot que vou desenvolver paralelamente ao bot do GetNinjas, esse segundo chatbot se chamará EventosTechBot. Chega de enrolar! Vamos entender qual será o nosso projeto e onde queremos chegar nesse primeiro post.

O código desse post está disponível no GitHub: https://github.com/MarcoBrunoBR/eventos-tech-bot/tree/1e4eb0645d6bbb769659b5ac385d0bb38a89e33f

EventosTechBot - nosso chatbot para eventos de tecnologia

Recentemente, a Fernanda Bernardo fez um site bem simples e funcional para funcionar como uma agenda dos eventos de tecnologia. Pedi a ela se poderia criar um chatbot no Telegram em NodeJS que utilizaria os dados do site dela e, para minha surpresa, ela topou. Então, aqui estamos nós. Inicialmente, teremos 3 funcionalidades:

Listar todos os eventos incluindo: data; descrição e link para o site.
Listar os três próximos eventos incluindo: data; descrição e link para o site.
Listar eventos de uma categoria (FrontEnd, BackEnd, Mobile, Agile e DevOps) incluindo: data; descrição e link para o site.

Neste post nós só faremos a primeira funcionalidade, no próximo post criaremos a duas funcionalidades sendo consumidas de um API Rest com dados reais. :-)

Como criamos um chatbot no Telegram?

Para nomear nosso chatbot e criar os comandos de cada uma das nossas funcionalidades, precisaremos trocar uma ideia com o chatbot do Telegram chamado @BotFather.

1 - Procure por um chatbot chamado BotFather

Entre no seu Telegram e procure pelo BotFather, como ilustrado no gif abaixo:

2 - Vamos dar nome e nickname para o nosso chatbot

O BotFather é responsável por criar todos os chatbots do Telegram, ele é um bot baseado em regras, portanto, é limitado a alguns comandos. O primeiro comando que precisamos aprender é o de como criar um chatbot. Para fazer isto, basta mandar a mensagem para ele /newbot, conforme é ilustrado no gif abaixo:

Você só não vai conseguir criar um bot com o nome de EventosTechBot. :-)
Das instruções pra baixo, toda vez que eu me referir ao EventosTechBot, você deverá trocar para o nome do chatbot que você está criando.

3 - Criando o comando para nossa primeira funcionalidade

Nossa primeira funcionalidade será listar todos os eventos que irão acontecer. Nessa primeira versão nosso chatbot (EventosTechBot) será da mesma categoria do BotFather, um bot baseados em regras. Por isso, vamos pedir para o BotFather ensinar dois comandos para o nosso o EventosTechBot. Para fazermos isso, basta passarmos o comando /setcommand e realizar os passos ilustrados no gif abaixo:

Definindo comando para o chatbot no Telegram

4- Conversando com o nosso próprio chatbot

Procure o EventosTechBot e envie o comando (/allevents) que acabamos de cadastrar. Infelizmente, nosso chatbot ainda não sabe responder a mensagem, está no momento de abandonarmos um pouco o BotFather e partimos para o nosso código em JavaScript em cima da plataforma do NodeJS. Ah! Antes de sairmos escrevendo o código é importante entender o que acontece com as mensagens que acabamos de enviar para o nosso chatbot, seja ela comandos ou apenas mensagens de texto.

Toda mensagem que enviamos para um chatbot do Telegram fica aguardando uma resposta por 24 horas, ou seja, para conseguirmos respondê-la precisamos ir até o Telegram, coletar as mensagens que estão aguardando resposta e respondê-las. Esse será o código que vamos desenvolver em JavaScript utilizando o NodeJS como plataforma.

Como escrever o chatbot em JavaScript

Chegou o momento. Para começar o nosso projeto, vamos criar uma pasta no desktop (Área de Trabalho) com o nome de eventos-tech-bot. Dentro dessa pasta teremos um pasta chamada src.

Com essa estrutura básica criada, abra o terminal e acesse a pasta que acabamos de criar no desktop com o comando abaixo:

~$ cd Desktop/eventos-tech-bot

Obs.: lembre-se de trocar onde estiver EventosTechBot para o nome do seu bot.

Agora vamos começar um projeto em JavaScript utilizando o NodeJS como plataforma. Em NodeJS temos um arquivo que é responsável por guardar as informações básicas do nosso projeto, como:

Name (nome);
Version (versão);
Description (descrição);
Entry point (arquivo por onde o projeto se inicia);
Test command (script para executa os teste);
Git repository (repositório do git);
Keywords (palavra chaves, utilizadas para buscar o projeto);
Author (autor do projeto);
License (licença).

Acabamos de ver que temos uma boa quantidade de informações para serem guardadas inicialmente, o arquivo responsável por essas informações e algumas outras que vamos aprender é o package.json. Felizmente, para criarmos esses arquivos teremos o auxílio do npm (Node Package Manager). Esse cara é responsável por guardar um quantidade gigante de projetos escritos em JavaScript e uns comandos legais para nos ajudar. Por exemplo, para criar o package.json, só precisamos executar o comando abaixo que ele perguntará cada uma das 9 informações do nosso projeto:

Desktop/eventos-tech-bot$ npm init

Obs.: O comando acima será executado também dentro do terminal.

Após você responder os 9 itens terá uma package.json similar a este:

{
  "name": "eventos-tech-bot",
  "version": "1.0.0",
  "description": "",
  "main": "app.js",
  "dependencies": {
    "telegram-node-bot": "^4.0.5"
  },
  "devDependencies": {},
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/MarcoBrunoBR/eventos-tech-bot.git"
  },
  "keywords": [
    "chatbot"
  ],
  "author": "Marco Bruno",
  "license": "MPL-2.0",
  "bugs": {
    "url": "https://github.com/MarcoBrunoBR/eventos-tech-bot/issues"
  },
  "homepage": "https://github.com/MarcoBrunoBR/eventos-tech-bot#readme"
}

Dentro da pasta src ficará todo o código do nosso projeto. Criei um arquivo dentro dela com o nome de app.js. Dentro desse arquivo faremos uma linha simples com objetivo de aparecer no terminal um Olá!

package.json e app.js criados dentro do projeto

console.log('Olá!')

Para executarmos o arquivo app.js utilizando o NodeJS como plataforma, basta voltarmos no terminal e executar os seguintes comandos:

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

Se tudo estiver certo até aqui, você receberá a seguinte saída no terminal após o comando node app.js:

Desktop/eventos-tech-bot/src$ node app.js
Olá!

Show! Agora temos uma base para o nosso projeto do chatbot. No próximo passo precisamos aprender a pegar o comando /allEvents e enviar uma resposta. Para termos esse tipo de comunicação com o Telegram, vamos utilizar uma lib chamada telegram-node-bot. Ela é uma interface para facilitar a utilização da API do Telegram.

Respondendo o comando /allevents

Já que decidimos utilizar a lib telegram-node-bot, vamos a instalar como dependência do nosso projeto. Para fazermos isso, basta rodar o comando abaixo no terminal:

Desktop/eventos-tech-bot$ npm install --save telegram-node-bot

Agora temos a pasta node_modules com nossas dependências

Depois de rodar o comando, é necessário aguardar alguns poucos minutos. Esses minutos podem variar dependendo da sua internet ;-)
Assim que finalizarmos a instalação, vamos começar a trabalhar no código que vai ser responsável por responder o comando /allevents.

Se você não estiver familiarizado com JavaScript ou o ES6, recomendo dar uma olhada no curso da Alura de ES6 feito pelo Flávio Almeida.

Precisamos abrir o arquivo app.js e chamar a lib que acabamos de instalar:

const Telegram = require('telegram-node-bot')

Já que estamos começando a escrever nosso código, é interessante utilizarmos o 'use strict'. Dessa forma evitamos criar variáveis ou funções como o mesmo nome, ou criar uma variável sem o var, let ou const:

'use strict'const Telegram = require('telegram-node-bot')

A lib telegram-node-bot tem uma classe dentro dela que precisaremos utilizar nos controller que vamos criar, o nome dessa classe é TelegramBaseController:

'use strict'const Telegram = require('telegram-node-bot')
const TelegramBaseController = Telegram.TelegramBaseController

Para conseguirmos pegar os comandos que o nosso usuário digitar no Telegram, precisaremos de outra classe da nossa lib chamada TextCommand:

'use strict'const Telegram = require('telegram-node-bot')
const TelegramBaseController = Telegram.TelegramBaseController
const TextCommand = Telegram.TextCommand

Agora que temos todas as classes da lib que vamos utilizar, chegou o momento de criar uma referência para o nosso chatbot utilizando o token que foi passado no momento que criamos o nosso chatbot:

'use strict'const Telegram = require('telegram-node-bot')
const TelegramBaseController = Telegram.TelegramBaseController
const TextCommand = Telegram.TextCommand
const chatbot = new Telegram.Telegram('SEU_TOKEN')

Troque essestring SEU_TOKEN pelo token do chatbot que você criou.

Nosso próximo passo será criar o controller do nosso chatbot. Ah! Esse controller deverá estender o TelegramBaseController.

'use strict'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 {
  allEventsAction(scope) {
    let msg = `QConSP - 24-25-26/04/2017 - qconsp.com\nFrontInSampa - 01/07/2017 - frontinsampa.com.br`scope.sendMessage(msg)
  }get routes() {
    return {
      'allEvents': 'allEventsAction'
    }
  }
}

O método allEventsAction é responsável por enviar a mensagem para o nosso chatbot. Nesse método nós temos o parâmetro scope que foi injetado para nós por conta de estendermos a classe TelegramBaseController.
Temos também o get routes. Esse é o cara responsável por expor o método allEventsAction para o nosso chatbot, ou seja, ajuda nosso chatbot a executar do lado de fora da controller o método allEventsAction. Para isto, precisaremos chamar a chave que foi atribuída a ela, que é o allEvents. Bora fazer a comunicação do nosso chatbot com a nossa controller:

'use strict'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 {
  allEventsAction(scope) {
    let msg = `QConSP - 24-25-26/04/2017 - qconsp.com\nFrontInSampa - 01/07/2017 - frontinsampa.com.br`scope.sendMessage(msg)
  }get routes() {
    return {
      'allEvents': 'allEventsAction'
    }
  }
}chatbot.router
       .when(
         new TextCommand('/allevents', 'allEvents'), new EventsController()
       )

Nessas última linhas que acabamos de adicionar, temos as rotas do nosso chatbot. Cada rota tem a responsabilidade de responder a um comando chamando um método que foi exposto na nossa EventController. É por isso que no when utilizamos o TextCommand, que é responsável por achar os comandos que o usuário digita e log, na sequência, invoca o allEvents, isso se o comando que o usuário digitou for /allevents.

Agora estamos com o nosso chatbot pronto para ser testado. Só precisamos rodar o nosso app.js com NodeJS:

Desktop/eventos-tech-bot/src$ node app.js

Para vermos se tudo está funcionando certinho, abra o seu Telegram, procure o seu chatbot. No meu caso, vou procurar o EventosTechBot. Dentro do seu chatbot, execute o comando /allevents. Você terá algo parecido com:

EventosTechBot funcionando com a primeira funcionalidade

Hum! Esse avatar que você está vendo, eu adicionei conversando com o BotFather, executando o comando /setuserpic. Quem fez a arte foi o Fabinho Gushiken, que trabalha como designer na Caelum e Alura. Muitos dos ícones e logos que estão aparecendo nos dois sites são feitos por ele.

É isso aí, conseguimos fazer um chatbot no Telegram com JavaScript. No próximo post vamos implementar as duas funcionalidades que ficaram faltando. O detalhe é que elas terão dados reais fornecidos por uma API Rest. Pensando melhor, talvez seja necessário fazer um próximo post sobre como criar um API Rest com JavaScript. E só depois um falando sobre as duas funcionalidades que estão faltando.

Até o próximo post que será o lado da API Rest que terá os dados reais dos eventos. Se ficou qualquer dúvida ou estiver precisando de ajuda em umas paradas de JavaScript, por favor, coloque no comentário ou me procure nas redes sociais da vida. Em todas elas estou como @MarcoBrunoBR, inclusive no próprio Telegram. :-)