Showing posts in Vue.js


post image

Instalar Bootstrap 5 en proyectos Vue.js

2021-07-19 Vue.js

En un post anterior vimos la estructura o Scaffolding de aplicación en Vue.js. Después de esto muy seguramente requerirás instalar alguna librería de CSS como boostrap, Bulma, Semantic UI, etc. El día de hoy, veremos cómo agregar Bootstrap 5.0 a nues...

by Darío Rivera


post image

Hola mundo! en Vue.js 2

2021-02-16 Vue.js Vue 2

En nuestro artículo anterior vimos una Introducción a Vue.js en donde abarcamos algunas de las características más importantes de este framework. El día de hoy crearemos nuestra primera aplicación en Vue.js 2, el clásico "Hola mundo!". El primer ...

by Darío Rivera


post image

Integrar ESLINT con Vue.js

2020-10-19 Vue.js

Para configurar ESLINT en un proyecto con Vue.js debes haber instalado primero ESLINT. Por lo general ESLINT viene integrado en proyectos creados con vue-cli, te invito a revisar nuestro artículo Cómo crear un scaffolding de aplicación en Vue.js&nb...

by Darío Rivera


post image

Pruebas unitarias en Vue.js con Jest

2020-10-13 Vue.js

En un post anterior vimos los Componentes de un solo archivo en Vue.js. Resulta que cuando tu aplicación va creciendo se hace en extremo necesario que comiences a probar cada componente con el fin de que los cambios futuros no afecten la funcionalidad act...

by Darío Rivera


post image

Componentes de un solo archivo en Vue.js

2020-10-12 Vue.js

Como vimos anteriormente en el artículo Componentes en Vue.js, es posible reutilizar una instancia de Vue y utilizar nuestros propios elementos HTML mediante el método Vue.component. Sin embargo, como pudiste haberte dado cuenta pudiera parecer algo...

by Darío Rivera


post image

Estructura de aplicación en proyectos Vue.js 2

2020-10-10 Vue.js

En un post anterior vimos Cómo crear un scaffolding de aplicación en Vue.js con el preset [Vue 2] babel, eslint. Si eres nuevo en Vue y tampoco sabes mucho de Node pudiera parecer un poco confuso esta estructura de aplicación. Sin embargo, est...

by Darío Rivera


post image

Instalar Bootstrap 4.6 en proyectos Vue.js

2020-10-10 Vue.js

En un post anterior vimos la estructura o Scaffolding de aplicación en Vue.js. Después de esto muy seguramente requerirás instalar alguna librería de CSS como boostrap, Bulma, Semantic UI, etc. El día de hoy, veremos cómo agregar Bootstrap 4.6 a nues...

by Darío Rivera


post image

Slots nombrados en Vue.js

2020-10-10 Vue.js

En nuestro artículo anterior vimos una introducción a los Slots en Vue.js. Los slots aportan una gran flexibilidad en cuanto a cómo se renderiza un componente y dan la posibilidad de inyectarles contenido tal y como un elemento en bloque de HTML lo perm...

by Darío Rivera


post image

Slots en Vue.js

2020-10-09 Vue.js

El concepto de Slot es difícil de definir pero fácil de entender viendo unos pocos ejemplos. Un slot es como un fragmento de componente al cuál se le puede inyectar contenido. Esto permite que podamos utilizar los componentes de Vue de la misma forma co...

by Darío Rivera


post image

Enviar datos entre componentes hermanos en Vue.js

2020-10-08 Vue.js

En Vue.js se envían datos desde un componente padre hacia el hijo mediante sus propiedades ( props ) y desde el componente hijo hacia el padre mediante eventos ( $emit ). Con estas dos formas de enviar datos que hemos visto en artícul...

by Darío Rivera


post image

Registro Global y Local de componentes en Vue.js

2020-09-30 Vue.js

En un post anterior vimos Qué son los Componentes en Vue.js y cómo crearlos. Resulta que Vue diferencia entre dos formas de cargar los componentes, la manera global y la forma local. El día de hoy veremos cuál es la diferencia de cada una de estas form...

by Darío Rivera


post image

Cómo crear un scaffolding de aplicación en Vue.js ?

2020-09-29 Vue.js

Después de haber visto los conceptos básicos sobre Vue.js, desde el enlace de atributos hasta la creación de componentes ya es hora de empezar con nuestra primera aplicación profesional. Para esto, vamos a hacer uso de Vue CLI (command line interface) ...

by Darío Rivera


post image

Enviar datos de un componente hijo al padre en Vue.js

2020-09-28 Vue.js

En un post anterior vimos Cómo Crear un componente en Vue.js y cómo enviar parámetros a un componente en Vue desde la instancia principal. El día de hoy veremos como hacer lo opuesto, enviar parámetros o información desde un componente hijo al p...

by Darío Rivera


post image

Componentes en Vue.js

2020-09-27 Vue.js

Un componente en Vue.js es la forma de reutilizar una instancia de Vue tantas veces como sea necesario. Mediante los componentes podemos crear nuestros propios elementos html, cada uno con sus propiedades y métodos particulares que fácilmente podemos reu...

by Darío Rivera