Vue JS é um framework Javascript open source, lançado em Fevereiro de 2014 por Evan You, Desenvolvedor que atuava em um dos projetos do Google Creative Labs, em 2014

Para quem cria projetos de desenvolvimento, a utilização de bibliotecas e frameworks são essenciais para agilidade e escalabilidade. Hoje vou falar sabre o Vue.js, um framework progressivo JavaScript, seus diferenciais e como ele pode ser utilizado em seus projetos de desenvolvimento.

O que é Vue.js?
O Vue.js é uma estrutura progressiva para Javascript usada para construir interfaces da web e aplicativos SPA. Não apenas para interfaces da web, Vue.js também é usado para desktop e desenvolvimento de aplicativos móveis com estrutura Electron. A extensão HTML e a base JS rapidamente tornaram o Vue uma ferramenta de front-end favorita, evidenciada pela adoção por gigantes como Adobe, Behance, Alibaba, Gitlab e Xiaomi.

Por que usar o Vue.js?
Reatividade;
Reutilização de components;
Legibilidade do código;
Ecossistema de ferramentas sólidas;
Fácil de aprender;
Documentação excelente;
Suporte da comunidade muito unidos e fortes;
Grande flexibilidade;
Two way data-binding (bem próxima ao do Angular).

O diferencial do Vue.js para outros frameworks como react e Angular
Temos muitos frameworks que podemos listar aqui, mas acredito que os frameworks que batem de frente com o mesmo intuito que o Vue, é o React e o Angular. Não tenho muito conhecimento em React e Angular, mas o pouco que vi desses frameworks, o Vue consegue trazer, de uma forma melhor, a organização dos componentes, como eles são estruturados, estilizados e reativos. 

Não irei muito a fundo nesse tema, mas deixarei a referência da página do Vue, onde eles comparam os principais pontos diferenciais com outros frameworks.

Como está o crescimento do Vue e ofertas de empregos?
O Vue.js teve um crescimento muito grande nos últimos anos. Segue um gráfico de comparativos de start no github:

Em questões de ofertas de empregos, acredito que o Vue não tenha tanto poder aqui no Brasil, talvez pelo fato de o Vue ser gerenciado pela comunidade diferente do React, que é mantido pelo Facebook? Será? Enfim deixo essa dúvida que eu também tenho.

Deixarei um link de gráficos do Google Trends em que mostra os termos mais procurados e os locais que foram procurados com mais constância. Claramente você vê que o Vue não é tão forte no Brasil. Segue alguns gráficos sobre o assunto:

Ainda assim, vejo um grande potencial nesse framework para os próximos anos. Vejo muitas vagas de Vue.Js no LinkedIn, mas a maioria está no exterior. Temos alguns sites criados pela comunidade para você conferir sobre esse tema.

O básico do Vue.js
Antes de começarmos essa parte, gostaria que vocês fixassem uma breve frase:

Tudo em Vue.js é componente, não existem páginas e componentes, apenas componentes e componentes.
A instância do Vue.js
O Vue recebe inúmeros atributos, então não vamos entrar em detalhes com todos, mas apresentarei todos que são mais utilizados.

Name
Esse com toda certeza é o mais simples da nossa lista, aqui colocamos o nome do nosso componente, lembre-se que tudo em Vue é Componente.

Components
Quando o seu componente tem outros componentes filhos, você precisa declarar eles aqui antes de usar dentro da tag de seu template. Normalmente você o importa declarando uma variável e passando a variável para dentro deste objeto. Isso só não acontece caso o componente que esta querendo usar seja global, muito comum nos frameworks UI.

Data
Onde você inicia todas as variáveis reativas do seu componente.

Obs: Você retorna um objeto e somente as variáveis que estiverem dentro desse objeto serão reativas.
Methods
É aqui que ficam nossas funções utilizadas para tratar dados, conexões APIs etc.

Computed
São funções com lógicas que vão de simples a complexas, você consegue fazer o mesmo com o methods. O diferencial da computed é que você armazena esses valores no cache e só é recalculado novamente caso alguma variável utilizada nela sofrer alterações.

Você jamais pode passar parâmetros para a computed e não, não use a gambiarra de retornar uma função recebendo parâmetros, pois se você esta usando a computed assim é porque você não precisa de uma computed aqui e sim um método.

Watch
Conseguimos assistir uma variável e toda vez que essa variável sofrer alteração ela irá invocar a função atribuída a ela.

Props
Quando você precisa passar dados do pai para filho no vue nós utilizamos as props, lembrando que é um anti-pattern alterar o valor da variável passada pela prop no filho.

Lifecycle Hooks
Listarei aqui apenas os mais utilizados e deixarei o link com todo o lifecycle do Vue para mais hooks.

beforeCreate: neste hook você só tem os Eventos javascript disponível;
created: aqui você ja tem todas injeções de dependências e as reatividades presentes no vue;
beforeMount: aqui você ja tem o seu HTML renderizado;
mounted: quando os seus componentes estão montados, ele não garante que todos os componentes filhos estejam montados!