Friki Work

Evolución del front end y Vue.js El desarrollo frontend ha pasado de manipular el DOM a mano con JavaScript vanilla, a usar librerías como jQuery y, finalmente, frameworks que abstraen casi toda la gestión del DOM. Entre los más utilizados están React, Angular y Vue.js. Vue.js 3 se centra en la Composition API, una forma de organizar la lógi ...

El manejo del estado global en aplicaciones Vue 3 se simplifica enormemente con Vuex, especialmente cuando múltiples componentes necesitan compartir y modificar datos. A continuación, se detalla cómo integrar y utilizar Vuex en tu proyecto Vue 3, abarcando sus componentes clave: state, mutations, actions y getters. Instalación de Vuex Asegúrat ...

Vue.js es un framework progresivo para la construcción de interfaces de usuario. La migración de Vue 2 a Vue 3 representa un avance significativo con mejoras en rendimiento, nuevas características y cambios de paradigma en la API. 1. Rendimiento y Motor de Renderización Vue 3 incluye un motor de renderizado virtual DOM reescrito desde cero. Est ...

Este artículo explora la implementación manual de varias APIs de composición clave en Vue 3, como reactive, ref, shallowReactive, shallowRef, readonly, shallowReadonly, isRef, isReactive y isReadonly. El objetivo es comprender los mecanismos subyacentes que permiten a Vue 3 lograr la reactividad. Implementando shallowReactive y reactive Esta ...

Vue 3 introdujo un sistema de reactividad completamente rediseñado, y reactive() es una de las herramientas más utilizadas dentro de la Composition API. En proyectos de administración empresarial como Naive UI Admin, convierte objetos simples en estructuras reactivas para formularios, tablas y gestores de estado. Este artículo reparte patrones ...

Propósito de setup en Vue 3 La función setup se introdujo para facilitar el uso de la Composition API en Vue 3, permitiendo organizar la lógica del componente de manera más modular. Ventajas sobre la API de Opciones La API de Opciones (data, computed, methods, watch) puede ser eficaz, pero en componentes grandes dificulta la lectura. Con ...

effectScope() Documentación oficial: Crea un ámbito de efecto que puede capturar los efectos secundarios reactivos generados en su interior (como propiedades computadas y watchers), permitiendo gestionarlos de forma conjunta. Explicación práctica: Podemos imaginarlo como un gestor de escuchas. Básicamente, agrupa dentro de una función las propi ...