Integração contínua com Travis e Heroku

Fala galera, beleza?

Você ainda roda, de forma manual, bons e velhos scripts para por sua aplicação em produção? É chato ter que alterar os arquivos de configuração toda vez que precisa modificar o ambiente? Que tal descomplicar e deixar tudo isso automatizado de verdade? Tá parecendo venda de produto pirata né? Hehehe… Mas é só um post sobre integração contínua!

Vamos falar um pouco sobre como fazer integração contínua por meio do Travis-CI e realizando o deploy no Heroku. Como exemplo, vamos utilizar um sisteminha de Tarefas feito com Spring Boot e a camada de visão com AngularJS. Em um futuro não muito distante, falarei um pouco sobre as maravilhas do Spring Boot, mas, hoje, vamos focar nessa danada de integração contínua.

 

Integração Contínua

O que é? O que come? Para que serve? Veja no novo post do Gabriel Feitosa =)

Muita gente ainda se pergunta no que a integração contínua pode auxiliar no processo de entrega, mesmo se ainda trabalhar com a velha forma cascata  (sim, infelizmente ainda hoje tem muita gente entregando software assim).

Geralmente, associamos a integração contínua somente as metodologias ágeis. Afinal, foi por causa da necessidade de disponibilizar os softwares de maneira rápida, contínua e com qualidade, que se tornou indispensável integrar o que é produzido ao que é entregue.

Uma pergunta para responder em nossas cabeças: quando fazemos um bom trabalho, gostamos de ter um feedback/elogio do nosso chefe, ou não? Pois é, o nosso software também é sentimental. A integração contínua é a maneira mais prática de dar um feedback instantâneo para nosso sistema e, sem ser egoístas, para nós mesmos.

Funciona assim, faço meu código, depois dou o commit no repositório, o processo de build é iniciado, os testes são executados e, se houver falhas, elas serão expostas. Simples, rápido e sem dor. Opa, vão ficar sabendo que comitei sem rodar os testes, isso não é legal!!! Mas é CLARO que é legal meu amigo, já imaginou se você envia esse seu código para homologação e na hora do usuário testar ele não funciona ou se vai direto para produção? Seria muito pior, não?

Para nosso exemplo, vamos usar um repositório no Github. O Travis-CI irá escutar este repositório e sempre que houver mudança executará o processo de build e fará o deploy no Heroku.

Leia Mais

AngularJS

AngularJS: Diretiva para controle de acesso

Fala galera!

Semana passada, recebi um e-mail perguntando se eu tinha algum exemplo, com AngularJS, para controlar as permissões de acesso do usuário aos botões da aplicação. Pensei: porquê não juntar a fome com a vontade de comer e blogar a respeito? Então vamos nessa!

 

Diretiva

Antes de colocar a mão na massa, é importante saber que o melhor lugar para se manipular o DOM é dentro de uma directive. Isso se deve ao comportamento do Angular HTML Compiler. Pode parecer meio estranho falar sobre compilar, mas é graças ao HTML Compiler que podemos anexar comportamento a qualquer elemento HTML ou adicionar atributos.

Uma dica importante refere-se a normalização dos nomes das diretivas. O AngularJS geralmente utiliza camelCase para normalizá-las (exemplo: ngRepeat e ngModel). Porém, temos que lembrar que o HTML não é case sensitive. Por esse motivo, usamos letras minúsculas e mais um traço separando as palavras (ng-repeat e ng-model) para utilizar as diretivas no DOM .

O nome da nossa diretiva de acesso será “permissaoAcesso. Ela terá a restrição de ser utilizada unicamente como atributo em um elemento do DOM. E é aqui que pode surgir a dúvida: “mas Gabriel, tem como restringir como a diretiva vai ser utilizada?”

A resposta é sim. As diretivas possuem a opção de restringir como serão usadas. Essa opção é a restrict  e ela obedece os seguintes parâmetros:

  • A: só pode ser utilizada como atributo.
  • E: só pode ser utilizada como elemento.
  • C: só pode ser utilizada como classe (class) css.
  • M: só pode ser utilizada como comentário.

 

Mas e se eu quiser usar como elemento e atributo, como faço? Aí é só mesclar com as letras que você desejar, por exemplo ‘AECM’, que libera o uso da diretiva em todas as opções mencionadas acima.

Por default, a opção restrict será ‘AE’. Ou seja, poderá ser utilizada como elemento e atributo.

Leia Mais

localtunnel

localtunnel: Disponibilizando acesso a uma aplicação local

E aí galera, beleza?

Se você, assim como eu (sem gracinhas, viu?), já passou por perrengues para disponibilizar uma aplicação local na web, este post pode ser muito útil.

Antigamente, para acessar uma aplicação rodando na minha própria máquina, a primeira configuração que fazia era cutucar o roteador ou o modem da velox (vixxxxx!!!) e tentar liberar as portas para a máquina.

Naquele tempo, eu não sabia nem o que era configuração de portas, a sorte eram os buscadores do Yahoo, Altavista, Cadê? e depois o Google (tem gente que não vai nem saber o que é Altavista e Cadê?).

Também Já quebrei muito a cabeça com o no-ip para tentar acessar meus “códigos” da faculdade (não dá para chamar de aplicação, porque o desenvolvimento era orientado à gambiarra).

Pois bem, os seus e os meus problemas acabaram! Há alguns anos tenho utilizado com bastante facilidade módulos que me auxiliam nessa questão e hoje quero compartilhar com vocês o localtunnel.

O localtunnel é uma app bem simples de ser utilizada. Não é necessário configurar “nada” no seu firewall e nem no DNS. Acreditem, não é mágica! =)

Instalação

Para instalar o localtunnel é necessário ter, antes, o node.js. A instalação é feita através do npm:

Leia Mais

AngularJS

AngularJS: Diferenças entre $apply, $timeout, $evalAsync e $digest

Fala galera, beleza?

Após alguns meses sem nenhuma novidade por aqui, estou tentando retornar a rotina de publicações… A ausência foi por um bom motivo: estive desenvolvendo, e ainda estou, um projeto social chamado Doe Caridade. Mas em breve eu volto a falar sobre ele, pois pretendo abrir o código fonte.

O post de hoje é sobre as diferenças entre o $apply, $timeout, $evalasync e $digest. Para entendermos um pouco mais como o AngularJS funciona é importante conhecê-las e saber como e quando usá-las.

$apply()

Algumas vezes é necessário executar operações fora do escopo do AngularJS. No post sobre Socket.io e AngularJS: Comunicação em tempo real, por exemplo, falei sobre a execução do $apply para poder atualizar o escopo do AngularJS todas as vezes que o frontend recebia dados do backend através do socket.io.

Leia Mais

AngularJS

AngularJS: Validação de formulário

Fala galera!

O post de hoje vai ser bem simples e direto: validar formulário com o AngularJS. Vamos ver passo a passo como é fácil e como esse framework é potente também na validação? Simbora…

O código abaixo será a base do formulário das validações. Como podemos ver, ele é apenas um simples formulário para validar um saque em um caixa.

Algumas considerações relevantes do nosso formulário:

Leia Mais

%d blogueiros gostam disto: