Aprender Vue: Curso Code
Aprender Vue: Curso Code — Aprende Vue.js creando componentes en tu teléfono
Aprender Vue: Curso Code es una app gratuita para empezar, disponible en iOS y Android, que enseña Vue.js a principiantes con algunos conocimientos de HTML y JavaScript, y a desarrolladores que pasan de la Options API a la Composition API. Incluye 42 cursos y 156 lecciones, desde tu primera plantilla hasta Pinia, Vue Router y Nuxt 3. Además, los componentes de un solo archivo se compilan en tu dispositivo, por lo que los 20 proyectos guiados, las misiones y Vue Lab funcionan sin servidor.
- Precio
- Gratis, actualización a Pro
- Plataformas
- iOS y Android
- Idiomas
- 22
- Clasificación por edad
- 4+
- Versión
- 82.6.0
- Requisitos
- iOS 15.1 o posterior
- App Store
- 3.0 ★ (2)
Un componente se entiende mejor después de haberlo descompuesto.
Vue Lab te entrega cada día un componente averiado y te pide encontrar el error, te permite ajustar las props de un componente con controles interactivos y muestra cómo cambia el estado al hacer clic. Los componentes de un solo archivo se compilan en el teléfono, así que la vista previa se rompe y se repara delante de ti, con una tarjeta de error que explica qué ha fallado.
Qué es
Aprender Vue: Curso Code es una app gratuita para iOS y Android que enseña Vue.js mediante 42 cursos y 156 lecciones, desde la sintaxis de plantillas y la vinculación de datos hasta la Composition API, Pinia, Vue Router y TypeScript, y también Nuxt 3, las pruebas con Vitest y las apps full-stack. Los componentes de un solo archivo se compilan en el dispositivo, por lo que los proyectos guiados, las misiones de programación y Vue Lab funcionan en el teléfono sin servidor. Además, un mentor de AI en Pro explica el código y los errores.
Dentro de la app
Qué aspecto tiene
El curso
Qué incluye el curso de Vue
42 cursos y 156 lecciones de la lista de cursos propia de la app, desde la primera plantilla hasta el renderizado en el servidor y los patrones de producción.
Primeros pasos con Vue.js
Introducción a Vue.js, Vue CLI y la estructura de los proyectos, la sintaxis de plantillas y el enlace de datos.
Reactividad y Composition API
Conceptos básicos de Vue 3 Composition API, la sintaxis de script setup, la reactividad y las propiedades computadas, además de las directivas de Vue.
Componentes y formularios
Conceptos básicos de los componentes y comunicación entre ellos, slots, provide e inject, formularios y validación, y el ciclo de vida de los componentes.
Reutilización y acabados
Composables de Vue 3, transiciones y animaciones, gestión de errores, y funciones de renderizado y JSX.
Estado y routing
Gestión del estado con Pinia, Vuex, routing con Vue Router y patrones avanzados de router, además de la gestión de APIs y datos asíncronos.
TypeScript, i18n y herramientas
TypeScript con Vue 3, internacionalización, integración con Storybook, y despliegue y mantenimiento de apps Vue.
Nuxt 3, testing y tiempo real
Renderizado en el servidor con Nuxt 3, testing de componentes con Vitest, GraphQL con Apollo y apps en tiempo real con WebSockets.
Patrones de producción
Rendimiento, buenas prácticas de seguridad, desarrollo de plugins, publicación de una biblioteca de componentes, aplicaciones web progresivas y microfrontends.
Cómo funciona
Cómo se aprende Vue en la app
Cada curso tiene un nivel, y todas las lecciones posteriores al primer curso gratuito comienzan con una vista previa gratuita, para que puedas ver cómo es un tema antes de decidir si quieres continuar.
Empieza con Introducción a Vue.js
El primer curso es gratuito y comienza explicando qué es Vue, cómo configurar el entorno y cómo crear una aplicación Hello Vue. Los cursos están etiquetados de A1 a C1, para que sepas claramente por dónde empezar y qué viene después.
Crea y ejecuta componentes en el teléfono
Edita un componente de un solo archivo y previsualízalo al instante. Los proyectos guiados hacen crecer una app paso a paso, y App Studio te permite crear apps con varias pantallas, un router y un store a partir de blueprints listos para usar.
Practica en Vue Lab
Encuentra el error diario, reproduce un diseño objetivo en Style Lab, compite contra el reloj en duelos de construcción rápida o reescribe un componente de la Options API con el estilo de la Composition API.
Qué incluye
Qué incluye la app
42
Cursos, 156 lecciones
Desde la sintaxis de plantillas y las directivas hasta el ciclo de vida, los slots, provide e inject y los composables, y también Nuxt 3, GraphQL, las PWA y los micro-frontends.
20
Proyectos guiados
Haz crecer una app paso a paso, con componentes de un solo archivo que se compilan directamente en tu dispositivo y una tarjeta de error cuando falla una vista previa.
28
Misiones de programación
Ejercicios de fáciles a difíciles, además de blueprints de App Studio para crear apps con varias pantallas, un router y un store.
Laboratorio
Vue Lab
Un inspector de reactividad, una búsqueda diaria de errores, 12 niveles de Style Lab, duelos de construcción rápida, un dojo para pasar de Options API a Composition API y una biblioteca My Components que puedes compartir como tarjeta de imagen.
Entrevista
Preguntas de entrevista sobre Vue
Preguntas para entrevistas de desarrolladores front-end, con cuestionarios, sesiones de repaso con tarjetas y una chuleta que puedes abrir en cualquier momento.
AI
Mentor de AI (Pro)
Pregunta sobre un concepto o un error, haz que te expliquen tu código o genera una lección personalizada sobre cualquier tema que quieras estudiar.
Contexto
¿Qué es Vue.js y qué debería aprender primero un principiante?
Vue es un framework de JavaScript para crear interfaces web interactivas a partir de componentes: piezas pequeñas y reutilizables que contienen su propia plantilla, lógica y estilos. Para los principiantes, resulta atractivo porque ofrece una entrada gradual: puedes empezar con HTML básico y un poco de JavaScript, y añadir estructura poco a poco. Un orden sensato es comenzar por las plantillas y la vinculación de datos, continuar con la reactividad y los componentes, seguir con la Composition API y dejar para después el enrutamiento, la gestión del estado y el renderizado en el servidor.
Reactividadla idea central
Cambias un dato y la pantalla que depende de él se actualiza automáticamente. Entender qué valores son reactivos y qué aportan las propiedades computadas y los watchers elimina gran parte de la confusión inicial con Vue.
Options API y Composition APIdos formas de escribir un componente
La Options API, más antigua, agrupa el código por tipo, como data y methods. La Composition API, con script setup, lo agrupa por funcionalidad y facilita la creación de composables reutilizables. Muchos tutoriales y bases de código siguen usando ambas, así que saber leer cualquiera de las dos es una habilidad útil.
Pinia, Vuex y el routerlo que añade una app real
Cuando una app tiene varias pantallas, necesita un sistema de enrutamiento para moverse entre ellas y un store compartido para los datos que utilizan varios componentes. Pinia es el store actual de Vue, mientras que Vuex es el anterior y todavía está presente en muchos proyectos existentes.
Nuxt y el renderizado en el servidorcuando importan las búsquedas y la velocidad
Nuxt se basa en Vue para renderizar las páginas en el servidor, lo que ayuda a acelerar la primera carga y mejora la visibilidad en las búsquedas. Normalmente se aborda en una segunda etapa, después de dominar los componentes, el enrutamiento y el estado.
Encaja
Para quién es y para quién no
Es una buena opción si
- Conoces un poco de HTML y JavaScript y quieres aprender tu primer framework
- Estás pasando de Options API a Composition API, o de Vuex a Pinia
- Te estás preparando para una entrevista de desarrollador de Vue.js o para tu primer trabajo de front-end
- Aprendes mejor arreglando un componente roto que leyendo sobre él
- Quieres sesiones cortas que puedas aprovechar durante un trayecto
No es la herramienta adecuada si
- Nunca has visto HTML ni JavaScript: empieza primero con un curso de JavaScript
- Quieres lanzar una app de producción desde tu teléfono: para eso, un portátil sigue siendo lo habitual
- Esperas que todo sea gratuito: el primer curso y las vistas previas son gratuitas; Pro desbloquea todo el plan de estudios
- Quieres material oficial de Vue.js: esta es una app de aprendizaje independiente
Preguntas
Preguntas frecuentes
¿Cuál es la mejor forma de aprender Vue.js en un teléfono?
Aprende ejecutando componentes en lugar de limitarte a leer sobre ellos. Aprender Vue: Curso Code compila componentes de archivo único en el dispositivo, así que sus 20 proyectos guiados, 28 misiones y Vue Lab funcionan directamente en el teléfono. Las lecciones breves de 42 cursos te llevan desde la sintaxis de plantillas hasta Nuxt 3, con un primer curso gratuito para empezar.
¿La app enseña Composition API y Pinia?
Sí. Aprender Vue: Curso Code incluye cursos sobre los conceptos básicos de Vue 3 Composition API, la sintaxis de script setup, los composables y la gestión del estado con Pinia, además del Vuex más antiguo para proyectos existentes. Un dojo de Options a Composition API en Vue Lab te permite reescribir componentes clásicos con el estilo moderno.
¿Cuál es la diferencia entre Options API y Composition API en Vue?
Options API agrupa el código de un componente por tipo, como data, methods y computed, mientras que Composition API con script setup lo agrupa por funcionalidad y facilita la creación de composables reutilizables. Aprender Vue: Curso Code enseña Composition API con script setup e incluye un dojo de Options a Composition API en Vue Lab para reescribir componentes clásicos con el estilo moderno.
¿Necesito saber JavaScript antes de aprender Vue?
Tener algunos conocimientos de HTML y JavaScript ayuda mucho. Aprender Vue: Curso Code está dirigida a principiantes que conocen las bases y quieren aprender su primer framework, por lo que explica los conceptos de Vue desde el principio, pero no enseña JavaScript. Si las variables y las funciones son nuevas para ti, deberías empezar primero con un curso de JavaScript.
¿Qué es Vue Lab?
Vue Lab es el área de práctica de Aprender Vue: Curso Code. Incluye un inspector de reactividad, un desafío diario de depuración con un componente roto, niveles de Style Lab en los que reproduces un diseño objetivo con CSS, duelos de creación rápida, un dojo de Options a Composition API y una biblioteca My Components con lo que has creado.
¿Incluye Nuxt 3 y el renderizado en el servidor?
Sí. Los cursos avanzados de Aprender Vue: Curso Code incluyen renderizado en el servidor con Nuxt 3, streaming SSR con Suspense y Vue full-stack con Fastify y autenticación, además de testing de componentes con Vitest y apps en tiempo real con WebSockets.
¿Ayuda con las entrevistas de Vue.js?
Sí. Aprender Vue: Curso Code incluye preguntas de entrevista sobre Vue para puestos de desarrollador front-end, junto con cuestionarios, sesiones de repaso con tarjetas y una chuleta. Los cursos en los que se basan cubren reactividad, ciclo de vida, composables y gestión del estado, temas habituales en las entrevistas.
¿Aprender Vue: Curso Code es gratis?
La descarga es gratuita. El primer curso, una vista previa de cada lección, el primer proyecto guiado, la primera misión, el desafío diario de depuración, tres niveles de Style Lab, los cuestionarios, las preguntas de entrevista y la chuleta son gratuitos, y la versión gratuita muestra anuncios. Pro desbloquea todo el plan de estudios y el laboratorio, el mentor de AI y el examen para obtener el certificado, además de eliminar los anuncios.
¿La app está hecha por el equipo de Vue.js?
No. Aprender Vue: Curso Code es una app de aprendizaje independiente y no está afiliada al proyecto Vue.js ni cuenta con su respaldo. Enseña Vue.js como framework de código abierto mediante sus propios cursos y ejercicios.
¿Hay algún certificado?
Sí. Aprobar el examen final, que forma parte de Pro, te proporciona un certificado de finalización. Muestra el trabajo que has realizado y no es una titulación acreditada, por lo que funciona mejor junto con componentes y proyectos que puedas explicar.
¿Qué plataformas e idiomas admite?
Aprender Vue: Curso Code funciona en iPhone a través del App Store (iOS 15.1 o posterior) y en Android a través de Google Play. La interfaz está disponible en 22 idiomas y la app tiene una clasificación de 4+ en el App Store.
Empezar
Crea hoy tu primer componente de Vue
Empieza gratis en iOS y Android, en 22 idiomas.
Más de CoddyKit
Disponible en iOS y Android.