Vue.js muito além de uma biblioteca JavaScript

As demandas para um desenvolvedor FrontEnd estão cada vez mais desafiadoras, interfaces cada vez mais interativas, amigáveis, responsivas são exigidas como requisitos funcionais. Nesse cenário, buscamos a cada dia encontrar meios de entregar o melhor valor em um prazo cada vez menor, visando manter a sanidade, manutenibilidade e escalabilidade do projeto.

Num tempo não muito distante… Os projetos de interfaces web (HTML, CSS, JavaScript) eram até de certo modo simples de se desenvolver, porém quase impossível de se manter, códigos macarrônicos, mudar coisas de lugar num layout era um parto de jacaré…

Uma sensível evolução deste ambiente foi a introdução de um conceito chamado WebComponents, que conheci a cerca de 1 ano e meio atrás, mas somente após conhecer o Vue.js vi que a sua implementação é a mais simples e limpa, além de tudo JavaScript puro. A ideia é isolar pequenas porções de código e agrupá-los em componentes isolados e reaproveitáveis.

Single File Component no modo vue se ser:

vuejs.org
Por isso, além de uma biblioteca JavaScript ela induz deliberadamente e felizmente técnicas de boas práticas em projetos FrontEnd.

A ideia inicial do vue.js era ser uma lib que providenciasse o two-way-databind (vinculo entre JavaScript e Html) baseados em componentes. Para quem trabalhou com o finado Asp.Net Webforms (que deus o tenha), lembrará dos webcontrols (.ascx), é a mesma ideia só que pra FrontEnd, porém a expectativa no mundo do desenvolvimento, principalmente o mobile, é a adoção dos chamados Progressive Web Apps, com a chegada da Versão 2 do vue ele é tratado mais como Framework Progressivo, que você pode montar como se fosse LEGO.

Existe a maneira mais simples de se trabalhar com vue.js, importa a lib através de um CDN por exemplo:

https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.26/vue.min.js

Ou de uma maneira mais, digamos, PRÓ: usando um gerador inicial para o projeto, o vue-cli (https://github.com/vuejs/vue-cli). Esse carinha cria toda uma estrutura inicial e de quebra gera templates como webpack e browserfy. Esta abordagem embute o vue.js nos modulos do Node.js (node_modules)

A medida que o projeto cresce pode ter a necessidade de utilizar uma arquitetura mais parruda pra troca de dados entre componentes, aí pode ser interessante entrar em cena o conceito de Flux com implementações como o Vuex (Tema para um próximo post).

Conclusão:

Gosto de pesquisar coisas novas no mundo do desenvolvimento sem ser xiita com essa ou aquela ferramenta, gosto de estudar conceitos porque acredito que com conceitos firmados a implementação flui de maneira natural. Dessa maneira sempre irei defender implementações que prezam pela simplicidade aliado a agilidade acima de tudo.

Algumas referências sobre a comunidade:

Telegram (https://telegram.me/vuejsbrasil)

Vuejs Brasil (https://www.facebook.com/groups/vuejsbr/)

Slack (http://slack.vuejs-brasil.com.br/)

MeetupSP: http://www.meetup.com/pt-BR/VueJS-SP/

Join the Vue Community!