Cómo crear rutas en Vue 3 con Vue-Router | Curso de Vue.js 3 - 05
Sigue así. Cada lección te acerca más a tu certificado.
Sobre esta lección
En este quinto video, continuamos el desarrollo de nuestra lista de tareas reactiva, centrándonos en la funcionalidad de borrar elementos de la lista de forma dinámica. Además, agregamos una nueva vista a nuestra aplicación, a la cual aplicamos estilos CSS personalizados utilizando la sección 'Style' y contenedores para mejorar su apariencia. Introducimos un nuevo componente llamado sidebar y le aplicamos estilos CSS específicos para darle un aspecto atractivo. También añadimos dos router-link para navegar entre las distintas vistas de nuestra aplicación y agregamos un router Vue para gestionar la navegación entre estas vistas. ¡Sigue este emocionante video para seguir mejorando tus habilidades en Vue.js 3 con Composition API! 00:00 Cómo borrar elementos de una lista en vuejs 02:14 Cómo ver lo elementos de un arreglo en la vue.js devtools 02:37 ¿Para qué sirve vue-router? 03:57 Cómo crear una View en Vue js 3 04:59 Cómo agregar estilos CSS en una View de Vue 3 06:58 Cómo crear un menú lateral (Sidebar) en vue.js 09:15 Cómo agregar un Router-Link en vue 13:51 Crear una Router-View en Vue.js 3 15:32 De esta forma debes modificar el archivo index.js del router 17:30 Cómo crear más de una ruta en Vue.js 3 con Vue-Router Página oficial de la documentación de Vue 3: https://vuejs.org Página oficial de la documentación de Vue-Router: https://router.vuejs.org Herramientas que ocupamos en este curso: Visual Studio Code: https://code.visualstudio.com/ + Instalar la extensión oficial de Vue (la puedes buscar como VOLAR) Sourcetree: https://www.sourcetreeapp.com/ | Esta herramienta nos permite utilizar GIT sin comandos. En google Chrome instala la extensión oficial de Vue.js 3, llamada vue.js devtools ¡No te pierdas esta oportunidad de dominar Vue.js 3 de manera clara y efectiva! Más adelante, crearemos un dashboard añadiendo CSS y el framework Bootstrap 5, creando vistas para CRUDs, utilizando Pinia, Vue Router, y otras dependencias como Vee-Validate y Yup. Para más contenido como este, tutoriales de Vue u otros frameworks de desarrollo web frontend, dale "Me gusta", comparte el vídeo y suscríbete. Si te sirvió el vídeo o quieres opinar sobre qué deberíamos ver en este curso de Vue 3, deja tu comentario. #cursodevue #vuejs #router
Sobre este curso
Aprende Vue.js 3 de la mano de José Barrientos en este completo curso en español. Aprende los fundamentos y avanzados de Vue.js 3 con ejemplos prácticos y proyectos reales con Composition API y script setup. Domina uno de los frameworks líder en el desarrollo web frontend, desde la instalación hasta las técnicas más avanzadas, donde veremos reactividad, propiedades, gestión de estados con pinia, rutas con vue-router, consumir APIs con Axios y más. ¡Inicia tu viaje en Vue.js 3 ahora!
Lo que aprenderás en este curso:
- Dominar la sintaxis moderna de JavaScript (ES6+)
- Manipular el DOM y gestionar eventos del navegador
- Trabajar con funciones asíncronas, promesas y APIs
- Implementar estructuras de datos y algoritmos en JavaScript