Actualizar una aplicación de create-react-app

Contenido del Bootcamp Dirigido por: | Última modificación: 8 de abril de 2024 | Tiempo de Lectura: 2 minutos

Algunos de nuestros reconocimientos:

Premios KeepCoding

Hacer una aplicación o un proyecto de programación con herramientas nos ahorra los pasos iniciales del desarrollo. Al arrancar con create-react-app, nuestra aplicación tiene a su disposición muchas dependencias para desarrollar y estilizar. En este post, te enseñaremos cómo actualizar una aplicación de create-react-app para que sus dependencias se mantengan al día en proyectos a largo plazo.

¿Cómo actualizar una aplicación de create-react-app?

Create-react-app es una herramienta que nos permite crear una aplicación web. A diferencia de crear una aplicación únicamente con React, esta herramienta create-react-app nos da un proyecto con dependencias ya relacionadas, carpetas ordenadas y un código básico. Es decir, create-react-app tiene configuradas las dependencias de React, webPack, Babel y muchas otras antes de que hayamos escrito siquiera una línea de código.

Por lo tanto, cuando hablamos de actualizar una aplicación de create-react-app, nos referimos a actualizar las dependencias, relaciones y códigos que esta herramienta trae predeterminados. Dentro de estas dependencias se encuentra el propio React. Para conocer más sobre ellas, te recomendamos ver el package.json que viene con tu aplicación.

Ten presente que actualizar una aplicación de create-react-app no es un proceso obligatorio y depende de lo que necesite tu proyecto. Para ello, tienes dos opciones: puedes actualizar la dependencia de create-react-app específica que quieres o actualizar todas las dependencias. Esto significa que podrías, por ejemplo, actualizar solo React y ReactDOM. Para ello, deberás ir a tu terminal e insertar el npm install de la versión más reciente de React con un número más alto.

Te aconsejamos revisar la documentación de React antes de efectuar cualquier actualización. Esto te permitirá comprobar que no haya ninguna incompatibilidad antes de modificar el código de tu proyecto. Si no haces esto, puede que le des npm start a tu aplicación y no funcione, perdiendo muchos datos y horas de trabajo.

Si, en cambio, quieres actualizar react-scripts, que es la dependencia detrás de create-react-app, deberás llevar a cabo un proceso más complejo. Para ello, te invitamos a leer el post updating to new releases en reactjs.org. Allí encontrarás lo que debes hacer en cada situación. Además, encontrarás un changelog en el que mencionan qué aspectos han cambiado con las nuevas versiones y cómo migrar de una versión a otra.

Por ejemplo, si estabas en una versión 4.0 de create-react-app, verás que se actualizarán webPack, postCSS, Jest y más. Esto te lo dicen para que revises si quieres o no ejecutar la actualización de create-react-app, pues puede que genere conflictos con tu código presente.

En este momento, te estamos guiando al paquete de create-react-app 5.0. Si estás leyendo este post con una versión mayor, te invitamos a consultar la documentación de ese paquete en específico. De esta manera, sabes cómo actualizar una aplicación de create-react-app.

Ahora que sabes cómo actualizar una aplicación de create-react-app, ¡es el momento de crear tu propia aplicación web! Por ello, te invitamos a seguir aprendiendo con nosotros sobre el mundo del desarrollo web en nuestro Desarrollo Web Full Stack Bootcamp, un programa de formación intensiva donde aprenderás a desarrollar con lenguajes como JSX, JavaScript, HTML y CSS. ¡No esperes más e inscríbete!

Posts más leídos

¡CONVOCATORIA ABIERTA!

Desarrollo Web

Full Stack Bootcamp

Clases en Directo | Profesores en Activo | Temario 100% actualizado