Por qué elegir VueJS: 5 razones para considerarlo nuestro próximo framework de referencia

Durante estos años, he tenido la fortuna de poder trabajar con diferentes frameworks JavaScript. Cada uno de ellos de ellos ha tenido, para mi, sus puntos fuertes y sus puntos enclenques. Jamás he tenido un apego incondicional con ninguno de ellos y eso me ha hecho ver a los frameworks como lo que son: herramientas que pueden asistirnos tanto como hacernos pasar un buen cefalea. Esto ha hecho que pueda valorar mucho qué funcionalidades son precisas y qué razonamientos tener en consideración en el momento de decantarme por uno o bien por otro en dependencia del contexto en el que me he encontrado.

Viéndolo con perspectiva, en poquísimo tiempo, hemos visto como estos frameworks han ido pasando por diferentes generaciones y como han ido madurando. Podría decirse que ha día de el día de hoy, en lo que suelo estimar la 3ª Generación, nos hallamos con frameworks bastante maduros que nos asisten a efectuar un elevado número de labores que pueden ser ejecutados en diferentes navegadores al unísono.

ReactJS, Angular y EmberJS son los frameworks que representan un mayor empleo en el mercado y que han probado ser una garantía de solidez y escalabilidad. A esta terna, se ha unido hace una temporada VueJS. Un framework con el que llevo trabajando a lo largo de un buen tiempo y del que he intentado estudiar cada funcionalidad.

En este blog post, me agradaría exponer 5 razones que han hecho que VueJS se haya transformado en mi framework JavaScript preferido. Espero que estas razones os persuadan a fin de que en vuestra próxima prueba de término o bien proyecto personal, le deis una ocasión.

1. Un framework para aprender y utilizar de forma progresiva

VueJS se autodenomina como un framework progresivo. Cuando enfrentamos un desarrollo con VueJS, podemos apuntar qué unas partes del framework deseamos incluir. VueJS está modularizado en diferentes librerías separadas que dejan ir agregando funcionalidad en el instante que las vayamos necesitando.

La modularización en librerías de un framework no es algo nuevo en el desarrollo front. Tanto ReactJS como Angular cuentan con una organización semejante de su código base. Lo que diferencia a VueJS de otras opciones alternativas es lo bien desajustadas que se hallan estas partes, lo simple que es extender la funcionalidad core y lo bien que trabajan sus partes en el momento en que se decide incluir más módulos.

El core primordial de VueJS está formado por una librería encargada de renderizar vistas en el navegador. Su forma de organizar el código es a través de pequeños componentes que poseen todo el HTML, CSS y JavaScript preciso para marchar como pieza independiente. Estas piezas se marchan componiendo en un árbol jerárquico de componentes hasta formar nuestra aplicación. Emplear esta librería es tan simple como importar el script en nuestra página HTML.

Si lo único que precisamos como desarrolladores es una mejor manera de organizar y renderizar nuestros pequeños componentes visuales, nos quedamos ahí y no incluiríamos solamente. En el instante que nuestra aplicación comenzase a medrar, contamos con librerías para administrar las sendas de nuestra aplicación como vue-enrutador o bien con librerías para administrar el estado global de la aplicacion como pueda ser vuex. Si nuestra aplicación tuviera que tener una enorme optimización o bien tener buen posicionamiento web, podemos incluir y trabajar con vue-server-rendering.

Y de esta forma nos pasaría con considerablemente más funcionalidades. La cantidad de librerías con las que se cuentan (así sean creadas por los desarrolladores oficiales o bien por la comunidad) es tan grande y cubre tal fantasma de funcionalidades, que va a ser bastante difícil que nos hallemos desprotegidos y sin esa utilidad que nos resulta imprescindible.

2. Funcionalidades intuitivas, modernas y simples de usar

VueJS no ha reinventado la rueda. Nuestro amigo verde fue creado como proyecto personal por Evan You, viejo desarrollador de Google, en un intento de facilitar el funcionamiento de AngularJS. El framework comenzó a ser tan simple y simple de utilizar que, cuando su autor decidió subirlo a los repositorios de Github, la comunidad fue empleándolo en poco a poco más proyectos.

Empresas como Xiaomi, Alibaba o bien Gitlab son ciertos de sus grandes exponentes. Si miramos las estadísticas de las esperanzas de empleo en el año dos mil dieciocho hallamos que bastantes personas y empresas están interesadas en conocerlo y utilizarlo.

Mas ¿Por qué razón este hype? ¿Por qué razón la comunidad tiene tan buenas palabras de este framework?

A mi juicio, se debe a lo bien que Evan You ha sabido trasladar todo lo bueno que tienen otros frameworks como Angular, ReactJS y EmberJS y desechar aquello que al desarrollador no le aportaba o bien le era complejo de emplear.

Si tuviéramos que delimitar a VueJS por 4 de sus aspectos ideales serían estos:

El dato como centro de todo: En VueJS, los componentes administran un modelo de datos interno. Estos componentes están desarrollado bajo el patrón MVVM. Esto desea decir que el desarrollador no debe preocuparse tanto por de qué forma o bien cuando renderiza un modelo en pantalla y sí más en de qué forma debe ser la lógica que administra ese modelo. El renderizado de HTML es encargado a la librería. Nosotros sencillamente jugamos con datos, métodos y plantillas HTML donde señalamos cuando se debe pintar cada una parte del modelo.
El sistema de componentes es reactivo: VueJS sabe comunicarse realmente bien a través de acontecimientos asíncronos. Un componente hijo se puede comunicar con su componente padre a través de acontecimientos. 2 unas partes del sistema pueden comunicarse a través de acontecimientos. Los propios modelos de un componente son capaces de mandar acontecimientos para apuntar en qué momento renderizarse. El sistema de componentes se transforma en un organismo vivo que reacciona realmente bien al cambio y efectúa acciones programadas por el desarrollador. Esto es debido a que el módelo de datos del componente es envuelto por getters y setters singulares encargados de administrar estas reacciones.
Sin fricción con otras librerías o bien recursos: En el momento en que me encaré a ReactJS padecí un tanto con el término de que todo era JS. Tener JSX no me asistió para su aprendizaje. Angular me medio forzó a incluir TypeScript para redactar componentes. Me agrada TypeScript, lo que no me agrada es que me impongan herramientas. VueJS es el más mentalizado con esto: Utiliza cuanto quieras, emplea la herramienta con la que te halles cómodo, céntrate en redactar HTML, CSS y JavaScript. Si deseas agregar JSX o bien TypeScript hazlo. Si no lo quieres incluir ahora, hazlo después. Esto causa que desarrollar en VueJS sea más intuitivo. Es prácticamente como trabajar con JavaScript nativo. Particularmente, me semeja un paso muy natural si vienes de trabajar con jQuery.
Todo está en el lugar que debe estar. Cuando comencé con VueJS, me di cuenta que miraba la documentación menos que en la de otras herramientas. Asimilaba la sintaxis ya antes. Aun la propia intuición me dejaba utilizar la librería sin mirar la documentación anteriormente. Esto se debía a que el naming de la API de VueJS es bastante intuitiva. Con saber lo que significa props, data y methods y qué puedo incluir en estas partes, podía comenzar a hacer mucho, con poquísimos conocimientos. En verdad, si no os explico de qué trata cada una de estas unas partes de la API, lo más seguro es que supierais de qué hablo. Es una de las virtudes de VueJS. Ser simple, intuitivo y poco recargado. Cada parte está en el sitio que habría de estar. Esto es algo difícil de comprender hasta el momento en que no se está desarrollando algo en VueJS, mas creedme, que si le dáis una ocasión, esto lo notareis.

3. Un ecosistema variadísimo que cubre todo lo necesario

Cuando opto por una herramienta de trabajo o bien otra, busco que la experiencia de desarrollo sea lo más cómoda posible. VueJS tiene a su alrededor una serie de herramientas que asisten a lograr que el desarrollador sepa en todo instante qué hace y de qué forma lo hace. Hay 3 herramientas que me asisten mucho en el momento de trabajar con VueJS.

Una de ellas es la línea de comandos (CLI) singular que han creado sobre NodeJS. Esta herramienta deja iniciar un proyecto con un boilerplate (o bien plantilla base) configurado a nuestro gusto de una forma simple y fácil. Sencillamente descargando desde npm la herramienta vue-cli, vamos a poder crear una estructura inicial con la que trabajar que cumple con la guía de estilo pactada por la comunidad. En mi opinión, es la mejor forma de comenzar a conocer la plataforma.

Además de esto, en el momento en que estamos desarrollando, lo que más me ayuda a saber qué hago y si lo hago bien son los procesos de depuración. Es verdad que Mozilla Firefox y Chrome ya cuentan con inusuales herramientas para depurar código. Mas hay una serie de conceptos internos que VueJS administra como el estado, las propiedades o bien los acontecimientos que las herramientas estándar no acostumbran a conocer.

El equipo de desarrollo de VueJS sostiene una extensión de Google Chrome que nos deja ver de qué forma se renderiza nuestro árbol de componentes, de qué forma se están lanzando y registrando acontecimientos, de qué forma se guarda el estado interno de cada componente o bien de qué forma se está comportando el estado global de la aplicación. Esta es buena herramienta que nos va a ayudar mucho en nuestro cada día. Sencillamente hay que ir al store de Google Chrome y descargarla.

Mas esto no queda acá, y es que aparte de localizar comodidades en el momento de iniciar y de depurar un proyecto con VueJS, contamos con complementos para los IDEs más utilizados actualmente. Yo en mi caso, empleo Visual Studio Code (VSC) para desarrollar aplicaciones front y me agrada mucho tener instalado un complemento para efectuar diferentes acciones de VueJS llamado Vetur.

Este complemento, me deja tener intellisense de la sintaxis de Vue en VSC. Me deja redactar componentes más veloz merced a los snippets por defecto que tiene, me deja tener pintado y afinado mí codigo a fin de que en todo instante sepa cuales son las palabras reservadas del framework. Finalmente, me deja emplear herramientas como Prettier con solo utilizar un grupúsculo de teclado. De qué manera véis es una herramienta realmente útil.

Lo bueno de estas herramientas es que se hallan en continua evolución. Siempre y cuando sale una nueva versión del framework, la comunidad y el equipo core se hace cargo de sostenerlas al día y siempre y en todo momento están agregando funcionalidad extra para hacer el trabajo a los desarrolladores un tanto más simple.

4. Una comunidad muy activa

Todo lo precedente puede estar realmente bien, mas si no hay un buen conjunto de personas que esté tras un proyecto tan esencial como este, poco puede importar ¿Cuántas veces nos ha pasado, que hemos utilizado una librería y con el tiempo, hemos debido ser quien la hemos debido sostener por el hecho de que su autor no le ha dado soporte? En la temporada de esplendor de jQuery, me pasó más de lo que me hubiese agradado.

En ese sentido, sencillamente debemos mirar este repositorio oficial de VueJS llamado ‘Awesome VueJS’. En este repositorio se incluyen todos aquellos recursos relevantes que la comunidad crea sobre esta herramienta: Libros, conversas, librerías, posts, manuales… todo cuanto se nos ocurra está acá.

VueJS es un proyecto Open Source que cuenta con una comunidad vivísima. Además de esto, es un proyecto Open Source ‘real’. ¿Qué deseo decir con ‘real’? Deseo decir que es un proyecto gestionado, desarrollado, evolucionado y planteado para y por la comunidad. Si miramos a sus contendientes más directos, tanto Angular (creado por Google) como ReactJS (creado por Fb) tienen un sistema Open Source más recio y menos abierto de lo que nos agradaría.

El roadmap, el versionado, las resoluciones, siempre y en todo momento o bien prácticamente siempre y en todo momento, son tomadas desde los equipos formados por estas 2 grandes empresas. En