Vue JS - Curso COMPLETO do Básico ao Avançado

Nessa aula iremos instalar o Visual Studio Code juntos. Ele será o Editor de Texto que iremos usar em nosso treinamento.

Após instalar o nosso Editor de Texto, nessa aula iremos instalar o Node. Iremos ver como ele é importante para o Desenvolvimento Web e como iremos utilizá-lo em nosso curso.

Nessa aula iremos instalar o Git. Iremos entender por que ele é importante para o Desenvolvimento Web atual.

Estamos iniciando uma nova seção, onde iremos dar os nossos primeiros passos com o Vue. Nessa aula iremos aprender a realizar o download do Vue e iremos criar nosso primeiro código com esse framework incrível.

Após aprender a realizar o download do Vue da maneira "clássica", iremos agora realizar o download dele usando uma CDN. Mas, o que é uma CDN? Como ela nos ajuda? Vamos responder essas perguntas nessa aula.

Nessa aula ter uma introdução ao npm. Vamos aprender o que ele é, por que foi criado e como irá nos ajudar ao longo de nosso curso.

Uma alternativa ao npm é o Yarn. Mas, qual é a diferença de um para outro e como usar o Yarn? Vamos descobrir nessa aula.

Já aprendemos diversas formas de realizar o download do Vue. Contudo, há uma ferramenta criada pela equipe do Vue que nos ajuda a criar uma aplicação Vue de maneira muito simples, estamos falando do vue-cli. Iremos conhecê-lo nessa aula.

Seja bem-vindo a mais uma seção. Nela iremos aprender os Conceitos Fundamentais do Vue. Nessa aula veremos uma visão geral do que aprenderemos nas próximas aulas.

Um dos principais conceitos do Vue é a passagem de dados. Iremos aprender esse conceito nessa aula.

Após aprender a informar dados para nossa instância Vue, nessa aula iremos aprender o que são métodos e como eles são usados em nossas aplicações.

Nessa aula iremos aprender o que são as computed properties e como elas podem nos ajudar a armazenar informações importantes.

Depois de aprender o que são métodos e computed properties, talvez pensemos: "os dois fazem a mesma coisa". Entretanto, eles possuem diferenças, e iremos falar sobre elas nessa aula.

Ainda falando sobre computed properties, iremos aprender nessa aula a definir um novo valor para elas.

Um conceito muito importante do Vue são os Watchers. Eles ajudam muito na funcionalidade do Vue. Iremos aprender a usá-los nessa aula.

Já ouviu falar do Ciclo de Vida da instância Vue, ou Lifecycle Hooks? Nós iremos falar sobre esse conceito nessa aula e entender como aplicá-lo em nossos projetos.

Nessa aula iremos resolver o pequeno desafio que deixamos na aula anterior. Iremos trazer uma série de dados assim que a página renderizar usando o Ciclo de Vida do Vue.

Um outro conceito muito importante do Vue são os filtros. Nessa aula iremos aprender o que eles são e como usá-los.

Nessa aula iremos falar de uma dica bem interessante: há uma coleção de filtros personalizados que pode facilitar bastante o uso deles em nossa aplicação. Vamos falar sobre essa biblioteca nesse vídeo.

Estamos iniciando uma nova seção, onde iremos falar sobre diretivas! Esse é um dos conceitos mais lembrados quando falamos do Vue. Mas, o que são diretivas? Iremos aprender nessa aula.

As duas primeiras diretivas que iremos aprender nessa seção serão v-if e v-else. Iremos entender como elas podem ser usadas em nosso projeto.

Nessa aula iremos conhecer a diretiva v-show e entender como ela funciona.

Após aprender sobre as diretivas v-if e v-show, pode ser que cheguemos à conclusão de que os dois são iguais. Eles realmente tem o mesmo objetivo, mas possuem uma pequena diferença em suas execuções. Iremos aprender sobre essa diferença nessa aula.

Nessa aula iremos conhecer a diretiva v-text e entender como ela está embutida nas funcionalidades do Vue.

Após aprender a diretiva v-text, iremos conhecer nessa aula a diretiva v-html.

Nessa aula iremos conhecer a diretiva v-once e aprender a implementá-la em nosso código.

Nessa aula iremos conhecer uma das diretivas mais famosas do Vue, a diretiva v-for.

Nessa aula iremos conhecer outra diretiva muito importante do Vue, a diretiva v-bind.

Após conhecer o conceito da diretiva v-bind, nessa aula iremos aprender a informar argumentos para ela de maneira dinâmica.

Nessa aula iremos conhecer a diretiva v-model e entender como ela pode ser usada em nossos projetos, principalmente em campos de formulário.

Nessa aula iremos conhecer a diretiva v-on e aprender como ela está muito relacionada com o conceito fundamental dos métodos no Vue.

Nessa aula iremos resolver o pequeno desafio que propomos na aula anterior. Nós iremos filtrar uma lista de dados dinamicamente usando a diretiva v-on.

Nessa aula iremos conhecer a diretiva v-slot. Ela é muito usada quando trabalhamos com componentes, então teremos também uma introdução a esse conceito nessa aula.

Nessa aula iremos conhecer a diretiva v-pre e entender por que ela pode ser chamada de "a criptonita do Vue.js".

Nessa aula iremos conhecer a diretiva v-cloak e entenderemos como ela pode nos ajudar a melhorar o desempenho de nossa aplicação.

Após aprender todas as diretivas do Vue, iremos aprender algo incrível nessa aula: vamos começar a criar nossas próprias diretivas!

Nessa aula iremos aprender as funções que o Vue nos oferece para criarmos nossas próprias diretivas.

Continuando a falar sobre as diretivas personalizadas, nessa aula iremos aprender quais são os parâmetros que as funções de criação esperam e como podemos manipular esses parâmetros.

Nessa aula iremos aprender um novo recurso, que é uma das últimas atualizações do Vue: vamos aprender a informar argumentos dinâmicos para uma diretiva personalizada.

Nessa aula iremos aprender a receber múltiplos valores para uma diretiva personalizada.

Seja bem-vindo a nosso primeiro desafio. Nessa aula iremos apresentar como esse desafio e o que iremos criar com ele.

Nessa aula iremos iniciar a correção do desafio, primeiro adicionando o Vue ao projeto e depois iremos desenvolver a lógica de login e logout do Blog.

Nessa aula iremos definir o carregamento dos posts de maneira dinâmica e entender quais diretivas e conceitos do Vue podem nos ajudar para atingir esse objetivo.

Nessa aula iremos continuar a resolução de nosso desafio, agora limitando os caracteres exibidos no post. Qual conceito do Vue nos ajudará nessa questão? Vamos descobrir nesse vídeo.

Nessa aula você poderá acessar o código final do desafio desta seção.

Estamos iniciando mais uma seção de nosso curso, onde iremos falar sobre estilização com Vue. Nessa aula iremos ter uma visão geral daquilo que iremos aprender nas próximas aulas.

Nessa aula iremos aprender a realizar estilização em linha usando objetos.

Após aprender a definir um estilo CSS para um elemento, nessa aula iremos aprender a definir mais de um possível valor para um estilo.

Já aprendemos a definir a estilização em linha usando objetos. Nessa aula iremos aprender a realizar a estilização usando arrays. Iremos aprender também qual é a diferença entre uma maneira e outra.

Nessa aula iremos aprender a aplicar a estilização em elementos por meio de classes, usando objetos.

Após aprender a aplicar classes usando objetos, nessa aula iremos aprender a defini-las por meio de arrays.

Estamos iniciando mais uma seção, onde falaremos sobre animações. Nessa aula teremos uma visão geral do conteúdo das próximas aulas, que serão bem "animadas".

Nessa aula iremos aprender a criar transições CSS usando o Vue.

Nessa aula iremos aprender a criar animações CSS usando Vue. Mas qual é a diferença entre uma transição e uma animação? Vamos aprender esse conceito nessa aula.

Após aprender a criar animações CSS, nessa aula iremos aprender como definir animações personalizadas, usando bibliotecas externas.

O JavaScript pode ser muito útil quando criamos animações em nossa página. Nessa aula iremos aprender a utilizá-lo para deixar nossas aplicações ainda mais interativas.

Toda animação possui uma duração. Nessa aula iremos aprender os recursos que o Vue possui para definirmos o tempo das nossas animações.

Quando trabalhamos com animações, um recurso que temos à nossa disposição é a opção de realizar uma transição entre elementos. Vamos aprender como fazer isso com o Vue nessa aula.

Nessa aula iremos conhecer o conceito da orientação de uma transição. Vamos aprender também como alterar essa orientação com o Vue.

Seja bem-vindo a mais uma seção. Iremos falar a partir de agora sobre eventos. Mas, afinal de contas, o que são eventos, e como podemos usar o Vue para manipulá-los? Vamos ter nessa aula uma visão geral sobre essas questões.

Nessa aula iremos criar nosso primeiro evento usando o Vue.

Já ouviu falar do Event Object? Ele é muito usado quando trabalhamos com eventos. Nessa aula vamos aprender o que ele é e como acessá-lo.

Nessa aula iremos aprender sobre os modificadores de eventos e entender algumas situações em que eles podem ser muito úteis.

Nessa aula iremos aprender quais são os modificadores de eventos de teclado que o Vue possui.

Nessa aula iremos continuar falando sobre os modificadores de Teclado, mas agora vamos aprender sobre os modificadores das teclas do Sistema Operacional.

Nessa aula iremos conhecer o modificador ,exact e entender como ele pode ser usado em nossas aplicações.

Após aprender sobre os modificadores de teclado, nessa aula iremos aprender sobre os modificadores que o Vue nos oferece para os botões do mouse.

Aprendemos ao longo dessa seção como aplicar eventos com Vue. Mas, já pensou em poder aplicar mais de um evento no mesmo elemento? Vamos entender como fazer isso nessa aula.

Estamos iniciando o nosso segundo desafio, seja muito bem-vindo! Nessa aula vamos conhecer o desafio e o que iremos desenvolver com ele.

Vamos iniciar a resolução de nosso desafio adicionando o Vue ao projeto e também iremos configurar uma transição em nossa página.

Nessa aula iremos programar o envio de nosso formulário e também iremos aprender a retornar uma mensagem de sucesso.

Nessa aula você poderá acessar o código final do desafio desta seção.