¿Aprender React o Angular? diferencias.


Desde hace un tiempo que he estado buscando la mejor opción para frontend y entre los cientos de artículos que hablan de este tema, nunca se hace una comparación completa o no colocan información relevante para mi. Entonces intentaré recopilar y explicar ciertas diferencias en este post.

Nota: No se incluye Vue porque nunca he tenido la oportunidad de utilizarlo. Mas adelante espero probarlo y realizar otras comparaciones.

Angular es un framework JavasScript escrito en TypeScript y creado por Google.

React es una librería JavaScript creada por Facebook.

Ambos son utilizados ampliamente en el mercado tecnológico pero en mayor medida React. Constantemente están en desarrollo y se van incluyendo mejoras adaptadas al día de hoy. Es muy conveniente aprenderlas y están aquí para quedarse, es decir, son mantenidas por los creadores, no se espera que sean abandonadas o reemplazadas por otras, tienen bastante documentación, son estables, no propensas a los bugs y con una gran comunidad.

Arquitectura

Aunque son muy similares, también tienen sus diferencias.

Angular se considera un completo Framework MVC por la estructura y funcionalidades que provee, esto te permiten empezar a trabajar inmediatamente. Angular te indica la estructura de trabajo y las herramientas, es una ventaja porque no tienes que buscar e incorporar para cada proceso, aunque algunos considera esto perdida de flexibilidad porque no te permite elegir.

Angular nos provee:

  • Manejo de componentes, data binding (Two way binding), funcional en cualquier plataforma.
  • Plantillas HTML usando adicional características propias de angular.
  • Encapsulación de CSS
  • Inyección de dependencias
  • Formularios a través del componente @angular/forms
  • Peticiones Ajax a través del componente @angular/HTTP
  • Manejo de Rutas a través del componente @angular/router
  • Protección de XSS
  • Componentes para pruebas unitarias

React solo provee la parte de la vista, la V de MVC. La desventaja es que tardaremos en empezar a trabajar mientras definimos que otros componentes agregar. La ventaja es que nos permite a nosotros mismos definir una estructura de trabajo y elegir solamente las herramientas que deseemos utilizar y pueden ser simple o complejas dependiendo del proyecto.

React nos provee:

  • Manejo de componentes, data binding (One way binding), funcional en cualquier plataforma.
  • Plantillas JSX basados en javascript y xml
  • Manejo de Virtual DOM
  • Protección de XSS.
  • Componentes para pruebas unitarias.

Las demás funcionalidades debemos agregarlas nosotros mismos. Existen muchas librerías las cuales nos pueden ayudar para cada ocasión.

Algunas librerías de React son:

  • React-router para las rutas
  • Redux para el manejo de states
  • Fetch o Axios para peticiones HTTP
  • Enzyme para pruebas unitarias

Apps móviles

Con Angular podemos desarrollar aplicaciones con el framework Ionic, utilizado en aplicaciones híbridas que luego se compilan para Android o ios. Ionic tiene una extensa librería de componentes UI, que nos permite desarrollar rápidamente interfaces atractivas para el usuario. Ionic utiliza contenedores web view, es decir, creas una aplicación web que luego es embebida dentro del contenedor web del móvil.

En mi experiencia es fácil trabajar con Ionic sin embargo como utiliza web view, el rendimiento dependerá del interprete web del móvil y esto puede resultar problemático para aplicaciones grandes, disminuyendo el rendimiento y la respuesta. También hay funcionalidades del teléfono a las cuales no podemos acceder desde una vista web, o que se podría pero solo si incluimos plugins dedicados a esa funcionalidad y tendremos que enfocarnos en compatibilidad, verificando como afecta el rendimiento.

Yo lo uso para páginas web que requieran una versión móvil, proyectos pequeños o medianos que no requieran accesos a hardware del teléfono o no requieran funcionalidades especificas del teléfono.

Con React se puede desarrollar usando React Native, que a diferencia de Angular, la aplicación se traduce a una verdadera aplicación nativa, esto permite un gran rendimiento de la app. También nos permite acceder fácilmente a componentes del teléfono y crear nuestros propios componentes a partir de Java, Objetive C, Swift para luego incorporarlo a nuestra app nativa.

Comúnmente una aplicación nativa es mas arduo de aprender y largo el proceso de desarrollar, por eso existen frameworks híbridas como ionic, phonegap (ambos usan apache cordova), o de compilación a nativa como Xamarin, React Native y muchos otros mas, que nos permiten utilizar lo que ya conocemos para desarrollar apps móviles, facilitando el trabajo.

En conclusión

En React debemos aprender acerca de JSX, componentes funcionales, manejo de states, Props y Flow. Adicional podemos agregar: los comandos de consola Create React App, móvil React Native, Material UI, Next.js, debug con la extensión del navegador React Developer Tools, etc.

En Angular debemos aprender acerca de TypeScript, RxJS, elementos de Angular y su propio manejo de states. Adicional podemos agregar: los comandos de consola Angular CLI, móvil Ionic, Angular Material, Angular Universal, debug con la extensión del navegador Augury, etc.

Aunque en React tiene menos conceptos que aprender y esto implica una menor curvatura de aprendizaje en comparación con angular, ambos son relativamente similares, fáciles de aprender pero complejas para dominarlas al 100%, más con sus respectivas librerías añadidas y tomando en cuenta que un proyecto puede incluir otros frameworks a los cuales se deben acoplar y mantener compatibilidad.

En mi experiencia he usado ambos y los dos me gustan, la complejidad depende del proyecto y lo que se haya agregado, incluso he visto proyectos muy malos porque no sabían aprovechar correctamente los frameworks utilizados, así que indicar si alguno fue «bueno o malo» depende de lo que las personas hayan realizado con el framework. Trabajaré con el que me indiquen en el trabajo o proyecto, pero si dejan a elegir uno puede verificar estas comparaciones y utilizar el que mejor te parezca.

En lo personal se me hizo mas fácil aprender angular y lo veo más organizado desde el principio. Por el mercado laboral el más solicitado es React y su versión móvil React Native, entonces si tuviese que enfocarme a uno solo, me decidiría por React. Aprender toma tiempo y lo mejor es enfocarse en el que más beneficio ofrezca.

En cuanto al código, es difícil de comparar y la mejor manera es ir a la documentación oficial, aprender lo básico y realizar los tutoriales introductorios. Después tendrás una visión global de lo que trata cada tecnología y podrás enfocarte en el que te guste.

Documentación Angular: https://angular.io/guide/quickstart

Documentación React: https://reactjs.org/docs/hello-world.html

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *