
Frontend Development Projects with Vue.js 3
Maya Shavin, Raymond Camden
- Editorial
- Packt
- Año
- 2023
- Páginas
- ~621
- Nivel
- Básico
De qué trata
Segunda edición de este libro de Packt, actualizada a Vue.js 3, escrita por Maya Shavin y Raymond Camden junto con Clifford Gurney y Hugo Di Francesco. Es una introducción práctica al framework para quien quiere crear aplicaciones web con Vue 3 y no sabe por dónde empezar, incluidos quienes vienen de React o Angular. Solo se necesita conocer HTML, CSS, JavaScript y lo básico de npm o Yarn.
El libro se divide en cuatro partes: introducción y curso intensivo, construcción de la primera aplicación, estado global, y pruebas y despliegue. Empieza creando un proyecto con Vite y explica las propiedades de datos como estado local, los componentes con <script setup>, las directivas (v-model, v-for), los métodos, los hooks del ciclo de vida y CSS Modules. Después trata la composición de componentes en jerarquías y su comunicación mediante props y eventos, el enrutado estático y dinámico con Vue Router, las animaciones y transiciones (también con librerías JavaScript externas), y el uso de Vue DevTools. La parte de estado global se centra en Pinia y en el consumo de API remotas con Axios. La última parte cubre las pruebas unitarias y end-to-end y el despliegue de la aplicación en la web.
Cada capítulo combina explicación, ejercicios guiados cortos y actividades en forma de miniproyectos que imitan aplicaciones reales, como una interfaz de chat, un carrito de compras, una calculadora de precios, una aplicación de tareas y un generador de tarjetas de perfil. Su punto fuerte es la práctica constante: con más de 600 páginas, se aprende Vue 3 haciendo, no solo leyendo. A cambio, los proyectos son pequeños y aislados: no hay una aplicación grande de principio a fin, ni se tratan temas como TypeScript a fondo, el renderizado en servidor con Nuxt o la arquitectura de aplicaciones grandes. Es un buen primer libro antes de pasar a textos de arquitectura o full-stack.
- Vue.js 3
- Vite
- Componentes
- <script setup>
- Directivas
- Vue Router
- Animaciones y transiciones
- Pinia
- Axios
- Vue DevTools
- Pruebas unitarias y E2E
- Despliegue
¿Cómo enseña?
Con proyectos
- ✓ Incluye ejercicios
- ✓ Incluye proyectos
Proyectos
Interfaz de chat
Miniproyecto en Vue 3 que simula una interfaz de mensajería. Sirve para practicar componentes, manejo de datos y comunicación entre componentes.
Carrito de compras
Actividad que construye un carrito de compras con Vue 3, con estado compartido entre componentes y cálculos derivados de los productos seleccionados.
Calculadora de precios
Pequeña aplicación que calcula precios de forma reactiva a partir de los datos que introduce el usuario. Sirve para practicar la reactividad y las propiedades computadas.
Aplicación de tareas (to-do)
Lista de tareas clásica hecha con Vue 3, con directivas como v-for y v-model, para practicar la gestión del estado local y los eventos.
Generador de tarjetas de perfil
Aplicación que crea tarjetas de perfil para guardar datos de contacto. Sirve para practicar formularios, componentes y manejo de estado.

