Vue.js es un framework progresivo de JavaScript que nos permite agregar desde widget dinámicos a páginas y proyectos ya existentes hasta desarrollar un single page application o SPA desde cero. Vue es además muy fácil de aprender y cuenta con una excelente documentación y comunidad, así como con el apoyo de Laravel.
Así que si estás buscando un framework o library de JavaScript para crear proyectos más dinámicos, has llegado al lugar indicado, puesto que en las siguientes lecciones te explicaré paso a paso y de forma muy detallada todos los features que necesitas para crear desde pequeños componentes dinámicos hasta comenzar el desarrollo de un SPA con Laravel y Vue.
Parte 1: Introducción a Vue.js
- 1 . Introducción a Vue.js 2 2:52
- 2 . Vue.js vs jQuery, parte 1 9:55
- 3 . Vue.js vs jQuery, parte 2 12:59
Parte 2: Vue.js desde cero
- 4 . Primeros pasos con Vue 2 6:40
- 5 . Interpolaciones y directivas 12:40
- 6 . Mostrar y ocultar elementos con v-if, v-else, v-else-if y v-show 16:40
- 7 . Estilos y clases de CSS dinámicos 17:58
- 8 . Listado de elementos con v-for 14:06
- 9 . Manejo de eventos 10:57
- 10 . Uso de filtros en interpolaciones 7:05
- 11 . Diferencias entre métodos, computed properties y filtros 9:43
Parte 3: Crea una aplicación CRUD con Vue.js 2
En las siguientes lecciones aprenderemos a crear una pequeña aplicación CRUD y a manejar arrays de registros de forma dinámica con Vue.
- 12 . Introducción 4:40
- 13 . Listado 7:17
- 14 . Creación 1:31
- 15 . Actualización 5:13
- 16 . Eliminación 2:46
Parte 4: Creación y uso de componentes en Vue 2
En esta parte del curso aprenderás todo sobre la creación, uso y comunicación entre componentes.
- 17 . Creación del primer componente 4:23
- 18 . Representar un registro como un componente 11:05
- 19 . Separación de datos entre el modelo y la vista 9:25
- 20 . Comunicación entre componentes con eventos personalizados 4:14
- 21 . Comunicación entre componentes con «Event Bus» 5:23
Parte 5: Uso de Vue CLI y Webpack
- 22 . Introducción a vue-cli y webpack 13:38
- 23 . Componentes de un solo archivo con webpack y vue-loader 17:43
- 24 . Uso de ES6 con webpack y Babel 10:20
- 25 . Práctica adicional de componentes 9:13
Parte 6: CSS y Sass en Vue.js
- 26 . Agregando estilos a los componentes 8:56
- 27 . Modularizar el CSS con scoped o CSS modules 8:07
- 28 . Uso de Sass 8:31
- 29 . Instalando Bootstrap Sass con webpack 7:34
- 30 . Extraer CSS con webpack y vue-loader 4:12
- 31 . Reduciendo el tamaño del CSS en 90% 8:09
Parte 7: Crea tu primer SPA
- 32 . Organización de los componentes 20:00
- 33 . Instalación y uso de vue-router 9:34
- 34 . Personalizar el estilo del menú de vue-router 6:09
- 35 . Rutas dinámicas con vue-router 10:15
- 36 . Manejo de estado básico con Vue 8:07
- 37 . Manejo de errores 404 con vue-router 8:40
- 38 . Rutas anidadas o sub-rutas con vue-router 6:14
- 39 . Rutas con nombre en vue-router 9:15
- 40 . Modo historia HTML5 11:55
- 41 . Creación de tareas con vue-router 14:45
- 42 . Acciones para completar y eliminar tareas 8:05
- 43 . Edición de registros con vue-router (SPA) 7:35
Parte 8: Render Functions y DOM Virtual
- 44 . Render Functions, parte 1 11:15
- 45 . Render Functions, parte 2 4:10
- 46 . Reactividad con Vue.js 10:40
Parte 9: Vuex
- 47 . Introducción a Vuex: El problema 8:00
- 48 . Introducción a Vuex: La solución 7:35
- 49 . Introducción a Vuex: Integración con Vue y helpers 13:40
- 50 . Integrando Vuex en una SPA con Vue.js 2 18:15
- 51 . Uso de Promesas en JavaScript 8:40
- 52 . Manejo de acciones asíncronas con promesas en Vuex 14:00