En esta entrada vamos a ver Vue.JS, un framework de JavaScript potente y ligero diseñado para construir interfaces web, especialmente en aplicaciones SPA (Single Page App). Vue.JS destaca por su velocidad, sencillez y ligereza. De hecho, es tan ligero que resulta adecuado incluso para dispositivos IoT como el ESP8266 y el ESP32. ¿Cuál es el interés en Vue.JS? ¿Por qué es interesante frente a otras opciones como Angular, React o Knockout? ¿Qué tiene Vue.JS que le hace tan especial? Lo respondemos a continuación.
Comentarios
Parece que últimamente la peor parte de desarrollar una aplicación web es elegir la tecnología que vas a usar.
#1 Yo pienso que lo es.. va a condicionar todo tu proyecto y es algo muy difícil de arreglar después. Así que hay que tener un cuidado de cojones.
#2 Al final todo acaba reduciéndose a conocer bien lo que usas, pero si que da la impresión de que hay mucha cosa "inacabada" y que para cosas fáciles va bien, pero si necesitas algo de complejidad...
A mi angular>2 me parece una herramienta bastante completa, es la que estoy intentando aprender vaya.
Y si le quereis dar al Server Side Rendering y las PWA sin que os explote la cabeza, muy recomendado: https://nuxtjs.org/
#10 La idea es que creemos que Angular está bastante maduro y que no creemos que vaya a volver a sufrir una reescritura como fue el cambio de la 1 a la 2. Con Vue, que es un producto mucho más nuevo, no tenemos esa confianza.
A ver, que evidentemente nadie tiene una bola de cristal para predecir el futuro, pero Angular ha llegado a un punto en donde es un producto muy maduro y a Vue aún le queda algo para llegar ahí.
#12 No te quito razón, pero Angular 5 salió en Noviembre 2017, en cambio VueJs 2 salió en Abril del 2016 y VueJS 1 salió 6 meses antes, desde entonces solo han hecho cambios menores, en cambio Angular tiene pinta que va a llevar una cadencia de cambios cada 6 meses y que en cada versión, van a estar cambiando y rompiendo bastantes cosas.
Por lo que si te refieres a un producto maduro, diría que vuejs va madurando correctamente y su ecosistema empieza a tener componentes muy potentes.
En cambio en Angular, ya veo tener que adaptar plugins cada 6 meses y volver a adaptar la aplicación en cada revisión y sobre todo, tener una ayuda completamente fragmentada.
#14 Es otra forma de verlo y entiendo perfectamente por dónde vas. Como te dije, no tenemos bolas de cristal, así que ya veremos en que queda el asunto. Yo sinceramente espero que nosotros hayamos escogido bien la tecnología.
#15 Angular al igual que VueJs son buenas tecnologías, maduras, con un buen ecosistema y una comunidad decente (sobre todo angular), mientras trabajéis en el proyecto y lo vayáis renovando, no deberíais tener problemas. Suerte!
Angular JS hace tiempo que esa superado por Angular (Angular JS es 1.x, y Angular es 2.x en adelante, hasta la 4.x).
El caso es que Angular es un framework de desarrollo de aplicaciones JS orientado a SPA (Single Page Application), especialmente Angular, y se comporta muy bien para proyectos de tamaño medio a grande. Su orientación a objetos (ahora usa TypeScript), la cantidad de librerías y código disponible, documentación, etc, lo hacen muy adecuado para ello.
Vue. js, en cambio, creo que brilla en proyectos más pequeños o para componentes sueltos. Es más sencillo, pero también dispone de menos funcionalidades de base, que se pueden ampliar metiendo más componentes, pero ya tienes que saber qué componentes son los más adecuados, según se comenta.
En cualquier caso Vue.js parece ser un excelente alternativa, especialmente para cosas como React, que se parece más a Vue.js que Angular.
#3 Para aplicaciones un pelin mas complejas es recomendable utilizar https://github.com/vuejs/vuex
En mi caso, vuejs me pareció muy sencillo de aprender y utilizar y con mucha menos verborrea que angular.
#3 #4 #5 #6 ¿Cómo resolvisteis el problema del posicionamiento en buscadores con estos frameworks? En mi empresa estuvimos tanteando Angular 2.x para el desarrollo de los frontends de los clientes (tenemos un servicio en la nube de erp,crm, etc.) aplicándolo a lo que ya teníamos creado en php, y al final lo descartamos por el tema del seo, urls amigables, etc., y su integración en nuestra solución.
#7 Puedes utilizar server-side rendering (SSR) para eso. Al menos Vue y Angular tienen soporte, aunque como puedes leer en #6, con Vue tuve problemas (en Angular un compañero lo montó sin dificultad).
También Vue al menos (y casi seguro que Angular también) tiene soporte para generar algunas páginas estáticas en el servidor y que al menos la primera página que se le envíe al usuario ya venga «completa» para el tema de SEO. Esto es bastante más sencillo de montar que el SSR, aunque menos potente, claro.
#7 En mi caso, uso Laravel, por lo que cada página es renderizada por el servidor utilizando php y vuejs solo se usa para componentes concretos para añadir funcionalidad/dinamismo, por lo que toda la parte de seo es gestionada por laravel.
La administración en cambio solo es un frontal que ataca la api, por lo que el seo no nos importa.
Haciendo una búsqueda sencilla en google (siempre que quisieras no quisieras utilizar otro lenguaje que no fuera javascript):
https://snipcart.com/blog/vuejs-tutorial-seo-example
Recientemente estuvimos haciendo una comparativa en mi empresa para un proyecto nuevo entre Angular 5, Vue.js y React. Os comento por encima lo que vimos:
- React básicamente es la mierda. Es algo muy limitado en comparación con otros frameworks y que aportó muchísimas novedades cuando todo lo que había era AngularJS, pero es algo que hoy no tocaríamos ni con un palo porque hay alternativas mucho, mucho mejores. Dos compañeros estuvieron jugando con aquello, no les gustó un pelo y lo descartaron enseguida.
- Con Vue estuve jugando yo y la verdad es que lo que vi a nivel de código me gustó mucho. Me resultó muy sencillo de usar y con una curva de aprendizaje muy suave (especialmente en mi caso, que venía de trabajar durante varios años con AngularJS); además, la documentación es meridianamente clara y sencilla; también es verdad que era muchísimo menos completo que Angular. Los problemas nos venían a la hora de la integración con TypeScript porque, si bien Vue ofrece soporte para TypeScript, es un framework que está muy enfocado a JavaScript. Entonces cuando quieres hacer cosas que no están explícitamente recogidas en la documentación oficial, especialmente si vas a usar TypeScript, te encuentras con bastantes problemas. Recuerdo en particular que yo no fui capaz de montar server-side rendering con TypeScript (mientras que en JS puro ya te venían proyectos preconfigurados en GitHub, en TS solo encontré uno y no funcionaba). En principio se tendría que hacer razonablemente sencillo usando Webpack, pero yo estuve dedicándole bastantes horas y no le vi salida. Aparte de eso, también había razones políticas: nos daba algo de miedo que Vue sufriera una reescritura bestia como ya hicieron cuando pasaron de AngularJS 1 a Angular 2 y no queríamos que nos pillara el toro con algo parecido en el proyecto nuevo. (Para nosotros el uso de TypeScript no es negociable porque la posibilidad de meterle tipado fuerte a JavaScript ayuda UN MONTÓN a programar).
- Angular 5 tiene una curva de aprendizaje algo bestia y la documentación es algo menos clara, pero sigue teniendo el gran soporte de Google detrás y es extraordinariamente completo; es como la famosa navaja suiza que vendían en Amazon y que tenía del orden de mil herramientas. Claro, para un proyecto pequeño es una bestialidad, pero para proyectos más bien grandes seguramente acabes necesitando muchas de las herramientas que te aporta Angular. Y, por otra parte, ya se le supone una estabilidad y madurez por el tema de que ha sido reescrito de cero con un montón de features en mente que no se tenían cuando se escribió AngularJS.
Así que bueno, la conclusión a la que llegamos en el curro es que Vue está bien para proyectos personales y/o pequeños, pero cuando quieres montar algo grande, la mejor opción de entre las que nosotros probamos es Angular.
Ah, por cierto, hay una pequeña errata en el artículo (o una omisión): AngularJS es exclusivamente la versión 1 de Angular, que está escrita con JavaScript. A partir de la versión 2 ya se lo llama exclusivamente Angular y es TypeScript.
#6 Hola, tengo curiosidad por un punto que mencionas:
Hablas de que te preocupaba que en vuejs decidieran reescribirlo por completo, pero los cambios entre vuejs1 y vuejs2 fueron bastante pequeños, pero en angularjs no mencionas este punto cuando fue realmente lo más criticado, ya que cada nueva versión de angular (cada año ) rompía tu aplicación.
A mi vuejs me parece la mejor alternativa. Mejor que react y angular. Sencillo, fácil de aprender y si le metes vuex, vue-router, vue-http y vue-i18n ya tienes toda la funcionalidad base que necesitas. Además los ficheros .vue que juntan las plantillas, con el código y es estilo hace muy fácil el trabajar con componentes.