Aprender Vue: Curso Code
Aprender Vue: Curso Code — Aprenda Vue.js criando componentes no celular
Aprender Vue: Curso Code é um app gratuito para começar, disponível em iOS e Android, que ensina Vue.js a iniciantes que conhecem um pouco de HTML e JavaScript e a desenvolvedores que estão migrando da Options API para a Composition API. São 42 cursos e 156 aulas, desde seu primeiro template até Pinia, Vue Router e Nuxt 3, e os componentes de arquivo único são compilados no seu dispositivo — assim, os 20 projetos guiados, as missões e o Vue Lab funcionam sem servidor.
- Preço
- Grátis, upgrade para Pro
- Plataformas
- iOS e Android
- Idiomas
- 22
- Classificação indicativa
- 4+
- Versão
- 82.6.0
- Requisitos
- iOS 15.1 ou posterior
- App Store
- 3.0 ★ (2)
Um componente fica mais fácil de entender depois que você o quebra.
O Vue Lab apresenta um componente quebrado todos os dias e pede que você encontre o bug, permite ajustar as props de um componente com controles ao vivo e mostra como o estado muda enquanto você clica. Os componentes de arquivo único são compilados no celular, então a prévia quebra e se corrige diante dos seus olhos, com um cartão de erro informando o que deu errado.
O que é
Aprender Vue: Curso Code é um app gratuito para iOS e Android que ensina Vue.js por meio de 42 cursos e 156 aulas, começando pela sintaxe de templates e data binding e avançando pela Composition API, Pinia, Vue Router e TypeScript até Nuxt 3, testes com Vitest e apps full-stack. Os componentes de arquivo único são compilados no dispositivo, então os projetos guiados, as missões de programação e o Vue Lab funcionam no celular sem servidor, e um mentor de IA no Pro explica códigos e erros.
Dentro do app
Como ele é
O curso
O que o curso de Vue aborda
42 cursos e 156 lições da lista de cursos própria do app, do primeiro template até renderização no servidor e padrões de produção.
Primeiros passos com Vue.js
Introdução ao Vue.js, ao Vue CLI e à estrutura de projetos, sintaxe de templates e vinculação de dados.
Reatividade e a Composition API
Fundamentos da Composition API do Vue 3, a sintaxe de script setup, reatividade e propriedades computadas, além das diretivas do Vue.
Componentes e formulários
Fundamentos e comunicação entre componentes, slots, provide e inject, formulários e validação, além do ciclo de vida dos componentes.
Reutilização e acabamento
Composables do Vue 3, transições e animações, tratamento de erros, funções de renderização e JSX.
Estado e roteamento
Gerenciamento de estado com Pinia, Vuex, roteamento com Vue Router e padrões avançados de roteamento, além do tratamento de APIs e dados assíncronos.
TypeScript, i18n e ferramentas
TypeScript com Vue 3, internacionalização, integração com Storybook e publicação e manutenção de apps Vue.
Nuxt 3, testes e tempo real
Renderização no servidor com Nuxt 3, testes de componentes com Vitest, GraphQL com Apollo e apps em tempo real com WebSockets.
Padrões de produção
Desempenho, boas práticas de segurança, desenvolvimento de plugins, publicação de uma biblioteca de componentes, apps web progressivos e microfrontends.
Como funciona
Como é aprender Vue no app
Cada curso tem um nível, e toda aula depois do primeiro curso gratuito começa com uma prévia grátis, para que você veja como é um tema antes de decidir continuar.
Comece com Introdução ao Vue.js
O primeiro curso é gratuito e começa explicando o que é Vue, como configurar o ambiente e como criar um app Hello Vue. Os cursos são classificados de A1 a C1, deixando claro por onde começar e o que vem depois.
Crie e execute componentes no celular
Edite um componente de arquivo único e visualize o resultado na mesma hora. Os projetos guiados desenvolvem um app passo a passo, e o App Studio permite criar apps com várias telas, router e store a partir de blueprints prontos.
Pratique no Vue Lab
Encontre o bug do dia, reproduza um design-alvo no Style Lab, corra contra o relógio em duelos de speed-build ou reescreva um componente da Options API no estilo da Composition API.
O que está incluído
O que vem com o app
42
Cursos, 156 aulas
Da sintaxe de templates e diretivas, passando por lifecycle, slots, provide e inject e composables, até Nuxt 3, GraphQL, PWAs e micro-frontends.
20
Projetos guiados
Desenvolva um app passo a passo, com componentes de arquivo único compilados diretamente no seu dispositivo e um cartão de erro quando uma prévia falhar.
28
Missões de programação
Exercícios do fácil ao difícil, além de blueprints do App Studio para apps com várias telas, router e store.
Lab
Vue Lab
Um inspetor de reatividade, uma caça diária a bugs, 12 níveis do Style Lab, duelos de speed-build, um dojo de Options para Composition API e uma biblioteca My Components que você pode compartilhar como um cartão de imagem.
Entrevista
Perguntas de entrevista sobre Vue
Perguntas para entrevistas de desenvolvedor front-end, com quizzes, sessões de revisão com flashcards e uma cola que você pode abrir a qualquer momento.
IA
Mentor de IA (Pro)
Pergunte sobre um conceito ou erro, peça uma explicação do seu código ou gere uma aula personalizada sobre qualquer tema que queira estudar.
Contexto
O que é Vue.js e o que um iniciante deve aprender primeiro?
Vue é um framework JavaScript para criar interfaces web interativas a partir de componentes: pequenas partes reutilizáveis, cada uma responsável por um pouco do template, da lógica e do estilo. O que o torna atraente para iniciantes é a curva de entrada suave: você pode começar com HTML puro e um pouco de JavaScript e adicionar estrutura aos poucos. Uma ordem sensata é aprender templates e data binding, depois reatividade e componentes, em seguida a Composition API e só então roteamento, gerenciamento de estado e renderização no servidor.
Reatividadea ideia central
Você altera um dado e a tela que depende dele é atualizada automaticamente. Entender quais valores são reativos e o que as propriedades computadas e os watchers acrescentam elimina grande parte da confusão inicial em Vue.
Options API e Composition APIduas formas de escrever um componente
A Options API, mais antiga, organiza o código por tipo, como data e methods. A Composition API, com script setup, organiza tudo por recurso e facilita a criação de composables reutilizáveis. Muitos tutoriais e bases de código ainda usam as duas, então saber ler qualquer uma delas é uma habilidade útil.
Pinia, Vuex e o routero que um app real acrescenta
Quando um app tem várias telas, ele precisa de roteamento para navegar entre elas e de uma store compartilhada para os dados usados por mais de um componente. Pinia é a store atual do Vue, e Vuex é a anterior, que ainda está presente em muitos projetos existentes.
Nuxt e renderização no servidorquando busca e velocidade são importantes
Nuxt se baseia em Vue para renderizar páginas no servidor, o que ajuda no carregamento inicial e na visibilidade nas buscas. Normalmente, esse é um assunto para uma segunda etapa, depois que componentes, roteamento e estado já estiverem confortáveis.
Para quem é
Para quem é — e para quem não é
É uma boa opção se você
- Conhecem um pouco de HTML e JavaScript e querem seu primeiro framework
- Estão migrando da Options API para a Composition API ou do Vuex para o Pinia
- Estão se preparando para uma entrevista para desenvolvedor Vue.js ou para o primeiro emprego em front-end
- Aprendem melhor corrigindo um componente com problemas do que lendo sobre ele
- Querem sessões curtas que caibam no trajeto
Não é a ferramenta certa se você
- Nunca viram HTML ou JavaScript — comecem primeiro por um curso de JavaScript
- Querem colocar um app em produção usando o celular — um laptop ainda é o lugar onde isso acontece
- Esperam que tudo seja gratuito: o primeiro curso e as prévias são gratuitas, e o Pro desbloqueia o currículo completo
- Querem material oficial do Vue.js — este é um app de aprendizado independente
Dúvidas
Perguntas frequentes
Qual é a melhor maneira de aprender Vue.js no celular?
Aprenda executando componentes em vez de apenas ler sobre eles. Aprender Vue: Curso Code compila single-file components no dispositivo, então seus 20 projetos guiados, 28 missões e o Vue Lab funcionam todos no celular. Lições curtas em 42 cursos levam você da sintaxe de templates ao Nuxt 3, com um primeiro curso gratuito para começar.
O app ensina a Composition API e o Pinia?
Sim. Aprender Vue: Curso Code oferece cursos sobre os fundamentos da Composition API do Vue 3, a sintaxe de script setup, composables e gerenciamento de estado com Pinia, além do Vuex mais antigo para projetos existentes. Um dojo de Options para Composition API no Vue Lab permite reescrever componentes clássicos no estilo moderno.
Qual é a diferença entre a Options API e a Composition API no Vue?
A Options API organiza o código de um componente por tipo, como data, methods e computed, enquanto a Composition API com script setup o organiza por funcionalidade e facilita a criação de composables reutilizáveis. Aprender Vue: Curso Code ensina a Composition API com script setup e inclui um dojo de Options para Composition API no Vue Lab para reescrever componentes clássicos no estilo moderno.
Preciso saber JavaScript antes de aprender Vue?
Saber um pouco de HTML e JavaScript ajuda bastante. Aprender Vue: Curso Code é voltado para iniciantes que conhecem o básico e querem aprender seu primeiro framework, por isso explica os conceitos de Vue desde o início, mas não ensina JavaScript em si. Se variáveis e funções são novidade para você, faça primeiro um curso de JavaScript.
O que é o Vue Lab?
O Vue Lab é a área de prática do Aprender Vue: Curso Code. Ele conta com um inspetor de reatividade, uma caça diária a bugs com um componente com problemas, níveis do Style Lab em que você reproduz um design-alvo com CSS, duelos de criação rápida, um dojo de Options para Composition API e uma biblioteca My Components com tudo o que você criou.
O app aborda Nuxt 3 e renderização no servidor?
Sim. Os cursos avançados do Aprender Vue: Curso Code abordam renderização no servidor com Nuxt 3, streaming de SSR com Suspense e Vue full-stack com Fastify e autenticação, além de testes de componentes com Vitest e apps em tempo real com WebSockets.
Ele ajuda com entrevistas de Vue.js?
Sim. Aprender Vue: Curso Code inclui perguntas de entrevista sobre Vue para vagas de desenvolvedor front-end, além de quizzes, sessões de revisão com flashcards e um resumo de consulta rápida. Os cursos relacionados abordam reatividade, ciclo de vida, composables e gerenciamento de estado — temas comuns em entrevistas.
O Aprender Vue: Curso Code é gratuito?
O download é gratuito. O primeiro curso, uma prévia de cada lição, o primeiro projeto guiado, a primeira missão, a caça diária a bugs, três níveis do Style Lab, os quizzes, as perguntas de entrevista e o resumo de consulta rápida são gratuitos, e a versão gratuita exibe anúncios. O Pro desbloqueia o currículo e o laboratório completos, o mentor de IA e a prova de certificação, além de remover os anúncios.
O app foi criado pela equipe do Vue.js?
Não. Aprender Vue: Curso Code é um app de aprendizado independente e não tem afiliação com o projeto Vue.js nem é endossado por ele. O app ensina Vue.js como um framework de código aberto em seus próprios cursos e exercícios.
Há um certificado?
Sim. A aprovação no exame final, que faz parte do Pro, dá a você um certificado de conclusão. Ele mostra o trabalho que você realizou e não é uma qualificação credenciada, por isso funciona melhor como complemento a componentes e projetos que você consiga explicar.
Quais plataformas e idiomas são compatíveis?
Aprender Vue: Curso Code funciona no iPhone pela App Store (iOS 15.1 ou posterior) e no Android pelo Google Play. A interface está disponível em 22 idiomas, e o app tem classificação 4+ na App Store.
Comece agora
Crie seu primeiro componente Vue hoje
Comece gratuitamente no iOS e no Android, em 22 idiomas.
Mais da CoddyKit
Disponível em iOS e Android.