Intive-FDV Blog

Las estrellas del Frontend para este 2019 (y las nominadas son…)

Desde las más usadas y escalables, pasando hasta por las más escondidas (pero maduras), hemos recopilado tres herramientas estelares de la tecnología del frontend: React, Angular y ¡sorpresa!

Con ustedes, React

  • Que React no es un Framework
  • Que sí
  • Que no

El acelerado crecimiento de React y su poderoso ecosistema de desarrollo, continúan generando las mismas discusiones entre algunos profesionales del área.  ¿Es React un Framework? No, es una librería creada por Facebook en el año 2013, que se encarga del manejo de la UI.

Una de las grandes ventajas de esta librería, es la posibilidad de poder generar componentes que pueden ser reutilizados en otras partes de la aplicación, sin tener que recurrir a la duplicación de código. Por otra parte, tiene una curva de aprendizaje flexible. Un programador con conocimientos básicos de HTML y Javascript, puede partir de allí para generar componentes sin mucha dificultad. Además, provee un CLI o “Create-React-App”, que levanta un entorno de desarrollo con solo unas pocas líneas de comando en la consola, sin necesidad de batallar eternamente con las configuraciones.

En otro sentido, y de acuerdo con el patrón de arquitectura MVC, el objetivo de React es ocuparse de la lógica de la Vista.

  • Perfecto pero, entonces, ¿quién se dedica a la lógica de la aplicación, a los datos?
  • Ahí aparece Redux.

La librería más conocida y utilizada para trabajar esta lógica de la aplicación es React-Redux, que guarda todo el estado de la aplicación en un solo objeto. Así es posible pasar esos datos entre componentes, incluso si son de la misma jerarquía, cosa que no podría hacerse sólo con React. Sin embargo, existen otras librerías que van de la mano de React, como pueden ser React-Router para el manejo de rutas de la aplicación, o Axios para el manejo de endpoints.

En cuanto a la comunidad de React, el repositorio de Github cuenta con 127.000 estrellas, 1299 contribuidores y 153 pull request, aparte de 482 issues abiertos.

El turno de Angular

Este Framework all-in-one desarrollado por Google, fue lanzado en septiembre de 2016. Entre las herramientas que facilitan su desarrollo se encuentran el Routing y el Handling de los request HTTP ya incluidos, sin tener que acudir a terceras librerías. Es importante destacar que las nuevas versiones de Angular incluyen Typescript, lo que dificulta la curva de aprendizaje en los desarrolladores que no estén familiarizados con el lenguaje.

Al igual que React, Angular usa Components para la UI, la que define la vista de las pantallas, asociando un template escrito en HTML a los datos de la aplicación y lógica. Estos Components, a su vez, pueden usar Services para crear data de alguna API a la que queramos conectar nuestra aplicación.

Como es un framework all-in-one, Angular no requiere demasiadas librerías para realizar una  aplicación, ya que para la mayoría de los casos puede manejarlo solo. No obstante,  hay una extensa lista de librerías de UI que pueden usarse sin problema. Entre ellas encontramos a Material, NGX Bootstrap y Prime NG. Angular también goza de un potente CLI, lo que facilita varias tareas: la creación de proyectos con el framework ya configurado, desarrollar componentes con una línea de comandos y correr tests, entre otras funciones.

Por ahora, cabe diferenciar Angular 2 o posteriores (al día de hoy la última versión es la 7)  de AngularJS (versiones 1 a 1.7.x), que actualmente está en LTS y es totalmente diferente a las nuevas versiones.

Para la comunidad, Angular en Github actualmente cuenta con un total de 2.366 issues (muchos antiguos, al parecer por falta de limpieza de los mismos), con más de 47.000 estrellas, 376 Pull Request y alrededor de 911 contribuidores.

Premio revelación

En febrero de 2014 Evan You, ex-Google, lanzó por primera vez Vue.JS, su versión personal de un framework basado en Angular 1. Se trata de una herramienta poderosa, con cada vez mayor auge en el mundo del frontend.

Vue.JS se define a sí mismo como un framework progresivo, es decir, que a medida que la aplicación va creciendo y tornándose compleja, podremos ir utilizando nuevas librerías para adaptarlo a lo que necesitemos. Desde su lado Vue nos ofrece a Vue-Router para el manejo de rutas en la aplicación y a Vuex, en caso de ameritar un manejo central del estado de la app, similar a lo que hace Redux con React.

Tal como dijimos de React y Angular, Vue también usa una jerarquía de componentes para la presentación de la UI.

Desde su página oficial en Github, Vue nos facilita una lista llamada awesome-vue con muchas librerías y componentes creadas por la comunidad, muy provechosa a la hora de buscar utilidades para alguna funcionalidad que se tenga que desarrollar. Otra gran virtud de este framework es que se puede desarrollar en el lenguaje que quieras: puedes usar HTML, JSX, CSS, SASS, LESS, Typescript o Javascript, aunque, al momento de trabajar en equipo, tal vez sea conveniente acordar el lenguaje a trabajar, para evitar carencias o desbalances.

Si sumamos los 3 repositorios en Github (vue, vue-router y vuex), Vue.JS tiene un total de más de 170.000 de estrellas, alrededor de 150 Pull Request y 320 issues, con un promedio de 200 contribuidores para cada uno.

¿Y el Ganador? ¿Qué debería elegir?

En cuanto a la curva de aprendizaje, posiblemente más complicado de aprender en principio sea Angular, ya que incorpora Typescript; en especial, si venimos con conocimientos de Javascript puro. No obstante, resulta útil al momento de crear aplicaciones de gran escalabilidad. Luego, React y Vue.JS sean quizás, los más sencillos de aprender, pero nos encontraremos con cierto grado de dificultad si se agregan librerías como React-Redux y Vuex.

La elección de un Framework va a depender de los conocimientos y gustos del desarrollador y, al mismo tiempo, del equipo de trabajo. Estará sujeta a las fortalezas y debilidades que manejen los devs en una u otra tecnología y, por supuesto, de los objetivos del software a desarrollar.

Matías Mastronardi

Matías Mastronardi es desarrollador Frontend en intive-FDV desde diciembre del 2018. Estudiante de la Tecnicatura en Desarrollo de Software en la Universidad de la Punta en San Luis, Matías realizó diversos cursos orientados a profundizar sus conocimientos en React, Redux e Ionic 3. Entre sus principales hobbies están el tenis, el ciclismo y, por supuesto, jugar videojuegos.

Matías Reines

Matías Reines es desarrollador Frontend en intive-FDV desde abril de 2018. Estudiante de Ingeniería en Informática en la Universidad Argentina de la Empresa (UADE), Matías se especializa en el desarrollo en AngularJS, React y Backbone. Jugar videojuegos y mirar series son sus principales hobbies.

Deja un comentario