Introducción a Vue.js

Vue es un framework de javascript enfocado a la creación de interfaces de usuario cuya popularidad está creciendo enormemente, especialmente desde la publicación de Vue 2.

Viene integrado por defecto en Laravel y Laravel Mix, haciendo que sea muy sencillo desarrollar los componentes visuales con Vue y el resto de la lógica de la aplicación en Laravel.

Al utilizar javascript estandar se puede integrar en proyectos nuevos y existentes sin tener que reescribir el código como sucede con otros frameworks como Angular.

Está basado en componentes (cada uno con su código css, js y html), por lo que es fácil integrarlo en proyectos existentes desarrollado progresivamente distintos fragmentos de la página como componentes Vue.
Es válido tanto para desarrollar pequeños componentes reutilizables con funcionalidades específicas, como para páginas completas SPA (single page application) que gestionen toda la lógica de la aplicación, haciendo uso de componentes adicionales como Vue-Router y Vuex.

Cuenta con una buena documentación y una comunidad muy activa que le da soporte.

Está enfocado en la capa de visualización, por lo que es un framework ligero, con una curva de aprendizaje asumible y con un gran rendimiento, situandose entre los frameworks actuales más rapidos.

Permite la creación de interfaces dinámicos y reactivos, gestionando eventos y el renderizado de información basandose en los datos en lugar de en el árból DOM como ocurre con jQuery.

Ejemplo de reactividad

A continuación se muestra un sencillo ejemplo del funcionamiento de un componente de Vue gestionando el valor de un campo de texto y mostrando

const ejemplo = new Vue({
    el: '#ejemploVue',
    data:  {
      texto: 'Texto inicial'
    }
});

<div id="ejemploVue">
<input type="text" v-model="texto">
{{ texto }}
</div>