Creamos la misma aplicación con ReactJS y Angular y te contamos las diferencias
Vložit
- čas přidán 20. 05. 2024
- 👉 Conoce nuestras vacantes actuales de tecnología en bit.ly/talento-tech-GDI
En este vídeo creamos la misma aplicación con Angular y React para contarte las diferencias
Aquí tienes los repositorios:
github.com/GarajedeIdeas/Code...
github.com/GarajedeIdeas/Code...
Si quieres aprender más de programación, te dejamos por aquí otros Garaje Code Pills que seguro que te gustarán:
- CRUD con Angular y Firebase (Firestore): • CRUD con Angular y Fir...
- Sube y descarga archivos con Firebase Storage en Angular: • Sube y descarga archiv...
- Taller de Composition API en Vue 3: • Taller de Composition ...
Esta introducción a Firebase con Angular fue impartida por Mario Girón, Senior Full Stack Developer:
/ mariogironm
Si quieres estar al tanto de todo lo que hacemos, puedes inscribirte aquí 👇
garajedeideas.com/livecoding/...
----------
Garaje de Ideas es un estudio de Diseño, Tecnología y Data. En este canal encontrarás tutoriales, cursos y ejemplos prácticos paso a paso de desarrollo web y programación.
Podrás encontrar desde cursos de JavaScript, Node.js, D3.js, Vue3, Typescript, HTML, CSS, React... hasta cómo optimizar tu proceso de trabajo. - Věda a technologie
Conclusión: Angular es un framework
Continúa mi sólida preferencia por Angular, excelente material!
material es horrible. cuando hice un software grande. me fue mal. mejor compré kendo para angular
Angular 💟
Conclusión: Angular es una bestia 🔥
Es una opción muy interesante sin duda. Lo bueno es manejar todas sus posibilidades
@@mariogiron Muy interesante y en constante evolución, me gusta lo que se ve en el panorama para el framework.
dependiendo el proyecto , cada uno es una bestia
Una de las grandes ventajas de angular es su cli y su sistema de actualizaciones, cuanto más te quedes cerca de su core y menos dependencias externas uses, actualizar puede ser cuestión de minutos. Yo he actualizado aplicaciones de angular 8 a angular 15 en media hora, en otros casos donde usamos más librerías externas no fue tan sencillo, pero vaya, una maravilla solo por eso
muy chulo angular con su nueva sintaxis y lo que se viene !!!
Seria interesante ver paralelismo con Vue, React y Angular
La comparación estuvo súper genial
Gracias! Nos alegramos mucho de que nuestro contenido te sirva de ayuda y te guste :)
¡Muy buena explicación, muchas gracias!
Gracias a ti! Nos alegramos mucho de que nuestro contenido te sirva de ayuda :)
la verdad es que me gustan los tres, vue - Angular - React , son tres bestias 2 frameworks y una librería que si las aprendes muy bien sabrás cual elegir en cada uno de los proyetos.
Excelente explicación...
Gracias! Nos alegramos mucho de que nuestro contenido te sirva de ayuda :)
Excelente!. Para el desarrollo movil, puedes hacer una comparación entre las dos tecnologias mas usadas?, puede ser entre Flutter y React Native
El servicio en 12:10, otra forma de inyectar dependencias es en el provider del componente si es standalone o del módulo.
buena idea esa comparación para la gente que viene de angular y quiere usar react y viceversa. gracias
Gracias! Nos alegramos mucho de que nuestro contenido te sirva de ayuda y te guste :)
excelente video
Gracias! Nos alegramos mucho de que nuestro contenido te sirva de ayuda y te guste :)
Sería bueno una comparación entre frameworks Angular vs Next
Nos lo anotamos a ver si lo podemos encajar en algún vídeo. Gracias por el aporte!
@@GarajedeideasYo quiero esa comparación
@@juantriana821 x2
Angular y Next tienen objetivos diferentes y no se pueden comparar directamente, Next es un meta framework😊. La comparación sería de Next (react) y Analog (Angular)
Excelente material! muy buena comparativa 😊. Y por los que dicen que no se pueden usar clases en React, tranquilo, se entiende perfectamente que no estás usando clases para los componentes (que fue lo que react desaconsejó), pero que tranquilamente puedes usar las clases que quieras a nivel de servicios, utils y demás.
Gracias por tu comentario y tu feedback, Manuel! Nos alegramos mucho de que te guste nuestro contenido :)
Muy buen planteamiento del video. La verdad es que me ha quedado más claro React (decir que tengo una base de angular) 👏🏼
¡Gracias! Nos alegramos mucho de que nuestro contenido te sirva de ayuda :)
Muy interesante.
Hubiese sido un momento clave haber enfocado el codigo de angular con signals, ya que se usan literalmente los mismos hooks que en React:
useState = signal | useEffect == effect
De la misma forma, en lugar de tener 3 archivos por "componente", podias haberlos introducido todo dentro del .ts .
Así se vería mas claro que una de las mayores diferencias es que un framework viene con stack por defecto y otro tienes que preparar tu mismo el entorno.
Aún con todo buen vídeo!
Tener todo en un solo archivo, al principio de un proyecto parece cómodo, pero cuando ya se hace muy grande el código y el proyecto, es un asco tener todo en un solo archivo
muy bueno el video pero en lo que fue angular hicieron falta muchas mejoras que se han implementado como selftag, signals, el uso de pipes para manejar observables, los forms tipados y si queria tambien podia usar promise en angular con lastValueFrom, 1 solo archivo si asi lo queria y en apartado de tests angular ya viene configurado para jasmine y jest
Lo bueno es que se puede empezar con una base y luego usar todas las nuevas herramientas para mejorar el desarrollo exponencialmente
Un video excepcional que muestra el potencial de ambas tecnologías, sin embargo pienso que la comparativa habría estado bastante bien hacerla entre 2 frameworks y no entre 1 framework y 1 librería, lo que quiero decir es que habría estado mejor comparar Angular con NextJS
Gracias por tu comentario y nos alegramos de que te haya gustado el vídeo! Tenemos en el radar grabar también Angular vs Next, así que todo llegará ;)
3:25 también en angular se puede utilizar el html y css en el componente .ts
Hubiera estado excelente el uso de signals en angular.
Like por Angular
Manejo los 2, pero la verdad Angular me gusta mas.
Angular muestra su solidez.
para mi no hay un mejor framework frontend que Angular, se que con todos se hace lo mismo, pero en estructura, organización, desacoplamiento, es el tipo, y ahora con SSR, le puso la tapa al pomo
Like por los dos incluso para vue que buenos 3 frameworks nos han dado la verdad, no me gusta solid
Angular me da de comer y pago mi departamento; React esta bien gracias xD
Gracias
Gracias a ti! Nos alegramos mucho de que nuestro contenido te sirva de ayuda :)
puedes hacer uno de angular vs blazor
No controlo Blazor, pero seguro que es interesante salirse por una vez del stack JS
Hola! Por aquí un dev ha hecho el proyecto en Blazor, por si quieres echarle un ojo al repo: github.com/harveytriana/CodePills-Blazor-CRMEmpleados
Este ejemplo no es suficiente para hacer una diferencia consistente entre angular y react, lo que mas nos daría una idea importante es la implementación del manejo de estado en react redux es más complejo que al desarrollarlo en angular, ya que este cuenta con diferentes features o clases para el estado global de la app, lo cuán resulta más manejable y escalable en proyectos grandes ya que react se necesitan más archivos y esto puede crear un desorden y perder legibilidad incluso más tiempo al
Implementar.
Pero... Redux es una sola forma, ya antigua, de manejar los estados, por qué habría de compararlo con Redux?
@@paulomirandaarias9544 me refiero a la implementación de estado dentro de la app puede ser redux u otro (sigue siendo la más ocupada para react) lo cual hace que el proyecto se vuelva engorroso y complejo y ahí esta la diferencia con angular mucho más legible y escalable.
Sin lugar a dudas angular tiene muchas cosas ya integradas en una arquitectura solida, pero su performance aún tiene que mejorar.
Metale next.js 14
React necesita un Framework
Vue dónde queda?
En australia :V pero con ingles
Angular sin didarlo.
Me gustan los videos así, pero siento que hace falta mostrarnos las comparativas en cuanto a peso de la aplicación y velocidad de carga.
Gracias por tu comentario, Juan. Le daremos una vuelta y a ver si es posible incluirlo en los siguientes vídeos :)
Creo que debías usar nextjs el cual es el framework de react para hacer una comparación justa.
También lo tenemos: czcams.com/video/4MTY884xR0I/video.html ;)
Nada de lo que aporta Next JS lo uso en Angular (que tambien tiene features parecidas o iguales) en este video, y tampoco uso nada de lo novedoso de Angular, asi que la comparativa es justa porque tampoco usó React puro si no con librerías externas para comparar solo esas features basicas como fetching de datos, templates y un poco del ciclo de vida de los componentes. Es una comparación básica y justa. Pero la comparativa con Next JS estaría muy interesante para que enfrente las features como signals vs useState, router de Angular vs File Routing de Next; SSR, SSG de Angular vs SSR, SSG de Next JS; estrategias de caching, performance, comparativa para desarrollo fullstack de ambos. Eso no solo seria justo si no un poco más complejo e interesante.
@@emilzonjeronimo8898 React 19 se habla de que incorporará signals
conozco a muchos que se pasaron de ReactJS a Angular. y simplemente dicen. "WOW ya estoy enamorado de Angular"
Angular papus!!
Me encanta la programación funcional con React y la capacidad de generar tus propias arquitecturas a pico y pala. Angular está muy chulo, pero demasiado estricto, declarativo y enfocado a OOP para mi gusto...
Cuando trabajes en equipos grandes, sabrás porque hay que ser estrictos a la hora de escribir código.
Sí, he trabajo en equipos muy grandes, y entiendo la utilidad de la estructura que te da Angular, simplemente digo que para mí la programación es una forma de vida y una actividad creativa, no sólo una herramienta, y en ese sentido, con React disfruto mucho más, porque tengo que pensar mucho más para crear arquitecturas desde 0 lo más eficientes posibles, y yo decido qué lineas de JS exactas se ejecutan en cada momento 😍
@@marcossalvo7503créeme que con tanta librería externa que debes usar en React no tienes idea de que estás ejecutando... Al final es lo mismo en uno que en otro, el control es una ilusión que solo lleva al desorden. Mantener y migrar proyectos de React es un asco... Sobretodo cuando una librería externa que algún dev genio se le ocurrió usar se depreca.
Angular = bloated, react = pobre... sigo con vue. Muchísimas gracias por el vídeo!
Gracias por tu comment! Nos alegramos mucho de que nuestro contenido te sirva de ayuda y te guste :)
Mucho más simple react una vez q. Se tienen las librerías instaladas
Es cuestión de experiencia. Los dos tienen cosas buenas y malas. Depende del proyecto, se le puede sacar más partido a uno u a otro
falta los signals de angular mas simplificado :D
Hola! Tenemos varios vídeos de Signals en la playlist de Angular, por si los quieres ver: czcams.com/video/t_YSrxj0wGY/video.html
La sintaxis de angular es mas legible y para cambiar los valores de las variables es mucho mas sencillo
Angular forever :P nah, dependiendo de las necesidades del proyecto puede cuadrar más uno u otro
En lo personal me encuentro casado con Angular (Desde la versión 9 hasta la actual versión 18). Team Angular ☝🤓
Angular > React. Sin embargo, en la mayoría de empresas trabajan con React. Una paradoja.
Angular es mucho más elegante
Angular está muy completo pero así mismo pesara en tanto react al ser "modular" su peso será menor,
En principio, cuando construyes la aplicación de Angular, únicamente se incluyen los módulos que estés utilizando
Conclusión, penal para Argentina!.
El resumen del video: angular lo tiene, react no, necesitas librerias o workarounds xd
Angular hasta la muerte
La diferencia es que React es una libreria y Angular es un framework, en todo caso mejor comparar Next con Angular
@@cristian_developerSi Next le pasa muy por encima a Angular 😂
No es cuestión quizá de determinar cuál es mejor o cuál peor. Cada uno tiene sus pros y sus contras y depende del proyecto y de la experiencia del desarrollador decantarse por uno o por otro
Y aún con librerías el código de React se ve más simple que Angular
Aqui el team React!
Like por React
Nunca hay que confiar en una libreria externa, por eso Angular es el mejor camino en el frontend.
Hay librerías súper establecidas. Por esa misma norma no podríamos confiar en ningún tipo de código que no estuviese generado por nosotros mismos
@@mariogiron las que todos combinan con react no son establecidas, solo son famosas, si se produce un cambio de paradigma van a quedar abandonadas o con poco mantenimiento como jQuery. Incluso el propio facebook e instagram no usan el mismo react que nosotros usamos y ademas lo combinan con herramientas que nosotros no podemos tener. Por eso hay que elegir un framework ya que es una gran inversion de los creadores, es muy dificil que queden obsoletos, mira .Net, Angular, Spring etc.. existen hace decadas y se van adaptando a cada cambio. Cuando usas angular practicamente no necesitas ninguna libreria externa.
Creo que ignoraste varias cosas de react en vez de clases ahora son hooks, creo que la comparativa no fue adecuada.
No he hablado de clases en ningún momento para React. Los componentes se crean a través de funciones, como se ve en el vídeo y se usan hooks para ciertas funcionalidades como useState, useEffect o incluso hooks externos como useForm
claramente el de la derecha es react:
"export default class EmpleadosService", eso claramente es una clase, los hooks pueden reemplazar las clases completamente.
@@mariogironpara algo existen los custom hooks, dices que no y en el video claramente usaste una clase para un servicio, por eso se que no aplicaste 100% el conocimiento en react moderno.
@@sebastianestrada1311 eso es un servicio, una clase totalmente justificada para manejar las peticiones externas. Tú prefieres hacer hooks para todo? Perfecto, son diferentes formas de trabajar, pero no hay una verdad absoluta sobre cómo generamos arquitecturas para nuestras aplicaciones
@@sebastianestrada1311 ok. Un saludo
No se que haces usando clases en react a estas alturas
No has visto el vídeo bien
@@mariogironcreaste un servicio para hacer un fetch en react con una clase.
Que horrible es angular, además vives con el miedo que google lo abandone
La próxima versión de ANGULAR es la fusión/integración con WIZ otro Framework interno que usa GOOGLE en la mayoría de sus plataformas, la intención de Google va por usarlo en todos sus productos para darle más firmeza de la que tiene. Afirmo que ANGULAR irá más sólido a partir de eso
Un framework que lo vienen actualizando cada 6 meses y que en su última actualización se fijaron para dentro de 10 años con angular y dices que viven con el miedo de que Google lo abandone? Cuánta incoherencia en tu comentario
@@sergioandresjaimespimiento6953 mira el cementerio de google entonces pibe
Los hooks hicieron de React un delicioso plato de spaghetti...