Front-end

Vue.js parte 1: construindo Single Page Applications

Curso online de Vue.js parte 1: construindo Single Page Applications

1191 9.4

9,4

é a nota desse curso

4.058

alunos neste curso

Faça esse curso e...

  • Construa do zero uma Single Page Application
  • Crie seus próprios componentes
  • Domine o data binding, diretivas, rotas e views
  • Aplique boas práticas do início ao fim
  • Integre com o backend NodeJS como exemplo

Carreiras com esse curso

Veja a 1ª aula

Público alvo

Programadores front-end que já dominam JavaScript e que procuram maior produtividade na criação de Single Page Applications

Nível de Dificuldade

Intermediário

Instrutores

Já é aluno?

Começar o Curso

Conteúdo Detalhado

  1. Bem começado, metade feito

    • Conhecendo um pouco da nossa aplicação
    • Apresentando Vue.js
    • Gerando o projeto
    • Automatizando a construção do projeto com Vue CLI
    • Instalando o CLI do Vue
    • Novo projeto a partir de um template
    • Levantando um servidor e acessando a aplicação
    • Entendendo a estrutura: Babel, Webpack e geração do bundle
    • Componentes declarados em Single File Templates
    • Global View Object e View Instance
    • Renderizando um template
    • Interpolação e data binding
    • Livereloading
    • Revisão
  2. Adequando o template gerado

    • Template e view root
    • Data binding unidirecional através de interpolação
    • A diretiva v-bind
    • O poder das diretivas
    • Revisão
  3. Integração com a API de terceiros

    • Um pouco sobre a separação do cliente e sua API
    • O módulo VueResource: instalação e registro
    • Lifecycle Hooks: em que momento acessaremos nossa API?
    • $http e promises
    • Revisão
  4. Criando componentes e encapsulamento de view

    • Estilizando um componente
    • Modificações na estrutura e mais estilos
    • Isolando marcação e estilos em um novo componente
    • Importando e comunicando-se com o componente
    • Trabalhando com slots
    • Estilos e escopo
    • Revisão
  5. Melhorando a UX com animações

    • Que tal filtrarmos nossa lista? Precisamos de dados!
    • A diretiva v-on e mais um tipo de data binding
    • Filtrando efetivamente a lista
    • Adicionando comportamento ao nosso componente
    • A diretiva v-show
    • Pegadinha do v-show e slots
    • Bind de eventos, mais uma vez
    • Atalho para v-on
    • Deixando tudo mais alegre com efeitos
    • Que tal mais um componente?
    • Revisão
  6. Single Page Application e criação de rotas

    • O componente Cadastro
    • Single Page Application
    • Ajustando a aplicação para SPA
    • O módulo VueRouter: instalação e registro
    • Configurando rotas
    • O menu da aplicação
    • Animando transições de página
    • Transformando o menu em componente
    • Revisão
  7. Um pouco mais sobre componentes

    • Nosso botão de 1001 utilidades!
    • Chamada de métodos
    • Disparando eventos nativos
    • Eventos customizados
    • Lapidando nosso componente
    • Validando propriedades
    • Considerações do primeiro módulo

Escolha o seu plano e vamos começar

  • Cursos
  • Certificado de participação
  • Todas as formações
  • Projeto avaliado pelos instrutores
  • Certificado de avaliação
  • Acesso à Alura Start
  • Acesso à Alura Língua
  • Preços
  • Como Funciona?
Premium
  • 598
12X R$75 à vista R$900
Comprar
Premium Plus
  • 598
12X R$100 à vista R$1.200
Comprar
Max
  • 598
12X R$120 à vista R$1.440
Comprar
Acesso por 1 ano
Certificado Digital de conclusão
Estude 24h/dia onde e quando quiser
Novos cursos toda semana