Generar formularios en Vue.js

vue-form-generator es una librería de Vue.js que nos permite generar formularios a partir de un esquema previamente definido. Es decir, en lugar de escribir el código HTML de los formularios los generamos definiendo los campos que queremos tener en un objeto de JavaScript. Veamos cómo usar esta librería a continuación:

Ver post

Formularios en múltiples pasos con Vue y vue-form-wizard

Seguramente alguna vez has rellenado un formulario donde a medida que vas completando los campos de diferentes secciones vas avanzando a otras partes del mismo; si necesitas hacer esto en un proyecto puedes lograrlo con vue-form-wizard, el cual es un plugin de Vue.js que nos permite dividir el flujo de un formulario en múltiples pasos (tipo […]

Ver post

Snapshot testing con Jest en Vue.js

Para terminar este Curso de Testing con Vue aplicaremos diseño a nuestra app de gestión de tareas. Para ello instalaremos Bootstrap y aplicaremos algunas de las clases de este framework en algunos componentes. Cuando tengamos un diseño mas o menos convincente realizaremos un test de snapshot para asegurarnos que este diseño es el que queremos y...

Regístrate para ver ésta y cientos de lecciones exclusivas.

Ver post

Invocando mutaciones desde una computed property de Vue.js con get y set

En el video anterior dejamos sin hacer la funcionalidad de marcar una tarea como no realizada. A través de una computed, vamos a lanzar una mutación de vuex u otra dependiendo del valor del checkbox. Esto lo conseguiremos sobreescribiendo el setter de la computed. Crearemos tests que comprueben esta lógica....

Regístrate para ver ésta y cientos de lecciones exclusivas.

Ver post

Mostrando nuestra App de Vue en el navegador

Durante todo el curso hemos estado implementando funcionalidades a nuestra app de tareas sin abrir el navegador. ¿Creéis que todo estará funcionando? Vamos a montar el componente ToDoList en la raíz y aprovecharemos también para eliminar ciertos tests introductorios. Finalmente haremos un par de ajustes a la interfaz de usuario....

Regístrate para ver ésta y cientos de lecciones exclusivas.

Ver post

Implementando las acciones del store de Vuex en el componente

En esta lección implementaremos las acciones que probamos en el video anterior. Cambiaremos nuestra prueba que llamaba al método deleteTask para que ahora se llame a la acción del store. También crearemos las funciones necesarias para agregar una tarea y completarla, llamando a sus correspondientes acciones....

Regístrate para ver ésta y cientos de lecciones exclusivas.

Ver post

Probando acciones y mutaciones del store con Jest

En este video añadiremos acciones y mutaciones a nuestra store. También comprobaremos con Jest que las diferentes mutaciones cambien el estado de la manera esperada y que, a su vez, las diferentes acciones llamen a sus correspondientes mutaciones....

Regístrate para ver ésta y cientos de lecciones exclusivas.

Ver post

Paginación en Vue.js con vue-paginate

vue-paginate es un plugin de Vue.js que nos permite agregar paginación a nuestras aplicaciones. El funcionamiento de vue-paginate es muy simple: le das un arreglo de elementos, indicas cuántos quieres mostrar por página y obtienes una lista de elementos paginados.

Ver post

Probando la integración del state y los getters de Vuex en el componente con vue-test-utils

En la lección anterior probamos unitariamente el state y los getters de nuestra pequeña store. En este video integraremos esta store en nuestro componente TodoList.vue y comprobaremos que hacemos uso de ésta. Lo conseguiremos inyectando el objeto $store dentro del componente a través de mocks....

Regístrate para ver ésta y cientos de lecciones exclusivas.

Ver post

Probando el state y los getters de Vuex con Jest

En esta lección crearemos una pequeña store de Vuex en nuestra aplicación. Nos aseguraremos a través de las pruebas de que en el state se inicializan los valores por defecto que esperamos y también que los getters devuelvan los valores correctos....

Regístrate para ver ésta y cientos de lecciones exclusivas.

Ver post

Suscríbete a nuestro boletín

Te enviaremos publicaciones con consejos útiles y múltiples recursos para que sigas aprendiendo.