Entonces, como acabamos de aprender,
en el mundo real no solo escribimos aplicaciones React
en un único archivo JavaScript sin necesidad de herramientas.
Así que ahora conozcamos las opciones que tenemos.
para configurar un nuevo proyecto React.
Y por ahora, las dos opciones más importantes
son la herramienta Create-React-App
o una herramienta de construcción llamada Vite.
Primero, Create-React-App es básicamente
un kit de inicio completo para aplicaciones React
que fue desarrollado hace muchos años
para hacerlo realmente fácil
para que los desarrolladores creen nuevas aplicaciones React.
¿Y qué tiene de bueno esto?
es que todas las herramientas de desarrollo comunes
ya están preconfigurados desde el primer momento
específicamente para reaccionar.
Entonces una aplicación creada con Create-React-App
viene automáticamente con un paquete web del servidor de desarrollo
para agrupar módulos y, por supuesto,
importantes herramientas de desarrollo,
que incluyen un linter como ESLint,
un formateador de código como Prettier,
una biblioteca de pruebas como Jest y, por supuesto,
Fable para habilitar las últimas funciones de JavaScript.
Ahora todo esto suena genial
pero el problema con Create-React-App es que,
como dije al principio, se desarrolló hace muchos años.
Y por eso utiliza algunas tecnologías lentas y algo obsoletas.
bajo el capó y, en particular, el paquete webpack.
Entonces, el equipo detrás de Create-React-App
realmente ha dejado de innovar y, por lo tanto, ahora mismo,
la recomendación es no usar Create-React-App
para proyectos del mundo real.
Sin embargo, sigue siendo una manera perfecta
para comenzar rápidamente con una nueva aplicación React
para tutoriales, cursos o experimentos simples.
Por lo tanto, usaremos Create-React-App
durante la mayor parte del curso,
así que para todos los pequeños proyectos de aprendizaje
que vamos a construir juntos.
Entonces es posible que hayas leído todos los artículos.
diciendo que Create-React-App está muerta,
y que nunca deberías volver a usarlo.
Pero eso sólo es cierto para la creación de aplicaciones reales.
Nuevamente, para aprender, todavía está 100% bien.
porque no encontrarás los problemas
que enfrentarán las aplicaciones a gran escala, como tiempos de actualización lentos.
Ahora, si quieres construir
aplicaciones del mundo real con React,
como lo haremos al final del curso,
entonces Vite es la elección perfecta.
Ahora, Vite es bastante diferente de Create-React-App
ya que es básicamente una herramienta de construcción moderna.
Un poco como un paquete web moderno.
pero que también contiene una plantilla inicial
para configurar nuevas aplicaciones React.
Sin embargo, en una aplicación React creada con Vite,
tendrás que configurar manualmente
muchas herramientas de desarrollo importantes,
como ESLint, Prettier, una biblioteca de pruebas, etc.
Y el más molesto y doloroso de esos.
está configurando ESLint para que funcione bien con React.
Eso puede suponer un poco de trabajo y puede salir mal.
Y esta es la razón
por qué sigo recomendando usar Create-React-App
para tutoriales cuando solo queremos ponernos en marcha
lo más rápido posible.
Ahora, si tenemos todo este trabajo adicional
para configurar nuestras herramientas,
Entonces, ¿por qué utilizar Vite en primer lugar?
Bueno, la razón es que es extremadamente rápido.
para actualizar automáticamente la página cuando el código cambia
que es lo que llamamos reemplazo de módulo en caliente.
Además, la agrupación también es extremadamente rápida.
que para aplicaciones a gran escala
realmente puede marcar la diferencia
porque cuando hay que esperar uno o dos segundos
para cada actualización de página,
Puede volverse realmente molesto con el tiempo.
Pero con Vite, la página se actualizará casi al instante.
cada vez que guardamos nuestro código
y quieres ver los cambios en la pantalla.
En resumen, usaremos Create-React-App
para la mayoría de las aplicaciones pequeñas en este curso
y luego pasar a Vite para los últimos dos o tres proyectos
para hacerlos un mundo un poco más real
y más moderno también.
Ahora, si has pasado algún tiempo
mirando la documentación de React,
Es posible que hayas leído que el equipo de React
ahora recomienda a los desarrolladores que utilicen el llamado marco React
como Next.js o Remix para crear nuevos proyectos.
De hecho, tenemos aún más opciones.
para configurar un nuevo proyecto de React
que los que acabamos de hablar.
Ahora vamos a hablar sobre qué son los marcos de React.
A lo largo del curso,
pero por ahora, todo lo que necesitas saber
es que un framework como Next.js contiene soluciones
para cosas como enrutamiento, obtención de datos,
y renderizado del lado del servidor,
entonces cosas que React en sí no proporciona fácilmente
fuera de la caja.
Básicamente, un marco de React
es un marco construido sobre la biblioteca React
y que hará que sea aún más fácil crear aplicaciones
que con solo Vanilla React.
Y esto suena genial, ¿verdad?
Bueno, sí, en cierto modo lo hace.
pero sólo para algunas aplicaciones.
Sin embargo, muchas personas, y entre ellas yo,
Creo que decirle a los desarrolladores
optar siempre inmediatamente por un marco React
No es la mejor idea y no siempre es necesaria.
Aplicaciones Vanilla React, por lo que las aplicaciones creadas solo con React,
Todavía tenemos un lugar muy importante también.
Y así imponer esta opinión a todos.
parece un poco extraño,
pero nuevamente, discutiremos esto más adelante.
Ahora bien, en cualquier caso, este consejo sólo tiene sentido
para construir productos listos para la producción real,
pero no para aprender React,
que es, por supuesto, lo que estamos tratando de hacer
en este curso.
Así que incluso si en algún momento
quieres aprender Next.js también,
Por supuesto, primero aún necesitas aprender React.
Entonces todo esto es para decir
que no debes preocuparte por esta recomendación por ahora.
Por ahora, simplemente aprendamos a reaccionar.
y configure nuevos proyectos con Create-React-App primero
y luego con Vite en los proyectos más grandes.
Y dicho todo esto,
ahora vamos a crear
nuestra primera aplicación React real.