Criando uma GEM e Clonando o Google Translate (parte 1 de 2)

O que vamos aprender?

Criar uma GEM pode ser uma maneira muito eficiente de deixar seu projeto organizado, fácil de ser reutilizado em projetos futuros e possivelmente ajudar a comunidade do Rails divulgando o código da sua Gem (A gente agradece 🙂 ).

Neste tutorial, veremos como criar uma Gem com uso prático e também como utilizá-la dentro de um projeto Rails.

 

Esse Post é a parte 1 de um tutorial de 2 partes.

 

Primeiramente, aprenderemos a criar uma Gem para traduzir frases exatamente como o Google Translate faz e depois, no tutorial 2, criaremos um site similar ao Google Translate e usaremos a nossa Gem para traduzir as frases enviadas pelos usuários.

Prepare-se para criar um projeto bem interessante que pode agregar bastante em sua maneira de entender o Ruby On Rails!

Todo o código da Gem criada está no GitHub, baixe-o se desejar clicando aqui! (Aproveite e siga-nos por lá 🙂 )

Ingredientes (Parte 1)

  • ● Ruby (2.3.1)
  • ● Api da Yandex
  • ● Rest Client (gem)
  • ● Json (gem)
  • ● Rspec (gem)

Objetivos do Tutorial (Parte 1)

  • ● Criar uma Gem
  • ● Criar os Testes para a nossa Gem (Todos os métodos) usando Rspec
  • ● Criar um método para identificar o idioma de uma frase
  • ● Criar um método para saber quais os idiomas a Api da Yandex conhece
  • ● Criar um método para traduzir uma frase para outro idioma que a Api da Yandex conheça

Mãos à Obra!

Gerando e configurando nossa Gem

  1. Primeiramente, você precisará ter o Ruby instalado. Caso não o tenha, aprenda como instalar usando o RVM clicando aqui.
  2. Agora instale o Bundle rodando no console:
  3. Vamos gerar a nossa Gem rodando no console:
  4. Ótimo, nossa Gem foi gerada! Observe na imagem abaixo os diretórios que foram gerados:
    rails gem
  5. Fica como um exercício para você, pesquisar sobre Versionamento de Gems. 🙂
  6. Agora vamos configurar a nossa Gem no arquivo “translate_yandex.gemspec”, essa configuração vai ficar visível para as pessoas que encontrarem a nossa Gem no https://rubygems.org/ quando fizermos o upload.
      • Primeiro você precisa configurar essas linhas:

     

  7. Agora verifique se você encontra essa linha no seu arquivo “translate_yandex.gemspec”:
  8. Caso não exista, insira essa linha e rode:

    Vamos precisar do Rspec para os testes

  9. Para finalizar insira também essa linha:

    e rode:

    Você precisará substituir todos os “TODO” das configurações, senão você não conseguirá rodar o Rspec ou instalar a Gem.

Pegando nossa Api Key

Como visto no início do post, para realizar as traduções usaremos a Api da Yandex. Para podermos usar a Api deles,  precisaremos de uma chave para receber a autorização durante as chamadas da Api.

  1. Primeiro acesse esse link!
    captura-de-tela-de-2016-09-18-22-45-24
  2. Depois de preencher seus dados você deverá entrar nessa tela, basta checar o “User Agreement” e prosseguir:
    captura-de-tela-de-2016-09-18-22-48-54
  3. Certo, agora você já deve estar na página que mostra sua chave, basta copiá-la para um lugar seguro. Logo iremos usá-la.
    captura-de-tela-de-2016-09-18-22-49-10

Pronto, agora com nossa chave nós podemos finalmente criar os testes.

 

Criando os Testes para a nossa Gem (TDD)

Seguindo a prática de TDD, começaremos criando os testes antes do código da Gem propriamente dita. Caso queira saber mais sobre essa prática, clique aqui. (caso queira uma explicação sobre TDD e o Rspec neste blog, deixe nos comentários ou mande no Facebook para batermos um papo clicando aqui).

Na nossa Gem, queremos criar três métodos principais:

  1. Um método capaz de traduzir uma frase do idioma X para o idioma Y.
  2. Um método que retorne todos os idiomas que a API da Yandex conhece.
  3. Um método capaz de dizer em qual idioma uma frase foi escrita.

Com nossos objetivos em mente, vamos começar.

 

Inserindo a nossa Chave da Api

Precisamos passar uma chave válida da API para que o Rspec possa usá-la na hora que formos iniciar nossa classe dentro dele.

Para fazer isso, vá até o arquivo “/spec/spec_helper.rb” e cole essa linha no final com a sua chave da API:

O recomendado é que você crie uma nova chave no site da Yandex apenas para teste e use-a nesse arquivo. (Se você fizer o upload da sua Gem, sua chave será visível para outras pessoas, então se usar sua chave normal outras pessoas terão acesso a ela)

 

Primeiro Teste

  1. Copie o código a baixo e cole no seu arquivo “spec/translate_yandex_spec.rb”:

    Criamos dois testes, o primeiro “Api response == 200” para verificar se a Api retornaria o status de sucesso “200” e o segundo “translatated text match” para verificar se o texto foi traduzido corretamente do português para o inglês. Este teste serve para verificar se estamos chamando a tradução corretamente. Não estamos completamente seguros, porque dependemos do perfeito funcionamento da Api, mas quanto a isso não temos o que fazer.
  2. Agora rode no console:
  3. Pronto, seu retorno deve ter sido um erro similar a este:
    captura-de-tela-de-2016-09-18-22-14-18Falhou porque nós só temos os testes, não temos ainda o código da Gem :).

Segundo Teste

  1. Copie para o arquivo “spec/translate_yandex_spec.rb” dentro do bloco “describe TranslateYandex do” este código:

    Nesse teste, apenas verificamos se a Api não está devolvendo a lista de linguagens que ela suporta vazia ou se o response está vindo ‘nil’. Nós não comparamos com a lista de idiomas porque quando ela sofrer alterações quebrará nossos testes, mas aceitamos contra argumentos sobre isso 🙂
  2. Rode no Console:
  3. Você receberá novamente um erro, agora do teste 1 e do teste 2.

Quando criarmos o código os erros desaparecerão :).

Terceiro Teste

  1. Copie para o arquivo “spec/translate_yandex_spec.rb” dentro do bloco “describe TranslateYandex do” este código:

  2. Dessa vez nós testamos primeiro “Api response == 200”, ou seja, se a Api estava retornando o código de sucesso, e também “detect language match with right language” que verifica se realmente a Api está nos dizendo que o idioma da frase é Português.
  3. Agora rode no console:
  4. Novamente você receberá uma mensagem de erro, agora para todos os testes que fizemos.

Pronto, nossos testes foram criados. Caso queira saber mais sobre o Rspec, dê uma olhada neste link!

Criando o Core da nossa Gem

Pronto, finalmente criaremos o Core da nossa Gem. Apenas relembrando, nosso objetivo é criar os seguintes métodos:

  1. Um método capaz de traduzir uma frase do idioma X para o idioma Y.
  2. Um método que retorne todos os idiomas que a API da Yandex conhece.
  3. Um método capaz de dizer em qual idioma uma frase foi escrita.

Vá até o arquivo “lib/translate_yandex.rb” e cole o seguinte código:

Fizemos alguns comentários no código acima para que você possa entender o que foi feito.
Basicamente estamos com a nossa Gem pronta, agora vamos rodar nossos testes e ver se eles funcionam.

Se tudo deu certo você deve estar vendo algo semelhante a isso:
captura-de-tela-de-2016-09-18-23-56-16

\o/ Uau! você acaba de criar a sua primeira Gem e certamente muitas outras virão. Imagine outras funções que possam ser bem atendidas por uma Gem e usando os conhecimentos que você adquiriu aqui, crie-a.

Caso precise de alguma ajuda, deixe nos comentários ou fale conosco clicando aqui!

Instalando nossa Gem

Para podermos usar a Gem dentro de um projeto Rails, por exemplo, precisaremos instalá-la. Para instalar rode:

Agora rode:

 

\o/ Pronto, sua Gem já está instalada e já pode ser usada dentro de um projeto Rails.

Usando nossa Gem via Console

Vamos testar nossa Gem usando-a via console:

  1. No seu console rode:
  2. Você deve estar vendo uma tela como esta:
    captura-de-tela-de-2016-09-19-00-44-16
  3. Agora rode o seguinte comando:
  4. Vamos criar nosso objeto (substitua com sua api key):
  5. Agora vamos pedir para a Gem traduzir a frase “Parabéns por fazer esse tutorial” para Russo:

captura-de-tela-de-2016-09-19-00-50-16Sucesso, nossa Gem funciona perfeitamente. Caso queira, você pode testar os outros métodos como uma maneira de fixação :).

 

Publicando nossa Gem

Podemos subir a nossa Gem para o Ruby Gems para que outras pessoas possam usá-la e se beneficiar do nosso trabalho, assim como nós nos beneficiamos do trabalho de tantos outros que fizeram Gems como “paperclip”, “capistrano”, “rspec” etc. (Seja legal com o mundo e compartilhe :)).

Publicar a Gem será uma missão para você fazer sozinho, para que você possa fixar mais o conteúdo.
Mas é claro, aqui está uma referência para você saber como fazer!

Se você precisar de ajuda fale comigo :).

Parte 2 (“Clonando” o Google Translate)

Na segunda parte desse tutorial, aprenderemos a criar um site semelhante ao Google Translate e como usar a Gem que criamos dentro do projeto para identificar o idioma da frase digitada. Veremos também como mostrar a lista de idiomas que podemos traduzir e efetivamente traduzir as frases que o usuário entrar na interface gráfica que criaremos.



12 formas de vencer o bloqueio criativo e escrever textos memoráveis (e 6 dicas extras)

Não perca nenhum conteúdo

Receba nosso resumo semanal com os novos posts, cursos, talks e vagas \o/



Você está gostando do que estamos produzindo? Deixe nos comentários para que possamos saber. Se puder, compartilhe esse conteúdo, pois isso ajuda bastante a incentivar novos conteúdos. 🙂

Obrigado,

Até o próximo tutorial,

Equipe OneBitCode.


Você é novo por aqui?

Primeira vez no OneBitCode? Curtiu esse conteúdo? O OneBitCode tem muito mais para você!

O OneBitCode traz conteúdos de qualidade e em português sobre programação com foco em Ruby on Rails e outras tecnologias como Angular, Ionic, React, desenvolvimento de Chatbots e etc.

Se você deseja aprender mais, de uma forma natural e dentro de uma comunidade ativa, visite nosso Facebook e nosso Twitter, veja os screencasts e talks no Youtube, alguns acontecimentos no Instagram, ouça os Podcasts e faça parte de nossa Newsletter.

Além disso, também estamos com alguns e-Books muito interessantes para quem deseja se aprimorar como programador e também como freelancer (os e-Books são gratuitos!):

Espero que curta nossos conteúdos e sempre que precisar de ajuda com os tutoriais, fala com a gente! Seja por Facebook ou e-mail, estamos aqui para você 🙂

Bem-vindo à família OneBitCode \o/

julho 19, 2018
Feito com s2 por OneBitCode
%d blogueiros gostam disto: