reactjsreact

Crear una app fácil con create-react-app 2.0

2 oct. 2018|Lectura de 2 minutos

Una de las mejores, sino la mejor manera de crear una aplicación en React es con el paquete create-react-app. Dicho paquete nos permite crear la estructura base de un proyecto en React con un simple comando.

Una de las mejores, sino la mejor manera de crear una aplicación en React es con el paquete create-react-app. Dicho paquete nos permite crear la estructura base de un proyecto en React con un simple comando.

A la fecha que escribo este artículo, este paquete ha sido actualizado a su versión 2.0 lo cual incluye novedades bastante interesantes que mencionaremos en este artículo.

Para obtener la última versión del paquete, basta con ejecutar el siguiente comando en tu terminal:

npm install -g create-react-app

o

yarn global add create-react-app

Creando mi app

Luego de tener instalado y/o actualizado tu paquete creat-react-app podrás iniciar tu proyecto con el comando:

creat-react-app ed-app

Siendo ed-app el nombre de la carpeta que se generará. No se permiten mayúsculas ni espacios para este nombre.

Una vez el proceso haya sido completado debes ingresar a tu carpeta y ejecutar el script start para levantar el proyecto en tu navegador.

cd ed-app
yarn start

Esta será la primera pantalla que visualizarás en tu navegador:

create react app

Cómo puedes ver, ya tienes un proyecto React listo para que puedas trabajar en él. Cada vez que edites el código el navegador actualizará el proyecto sin necesidad que tú tengas que actualizarlo manualmente para ver los cambios.

Novedades de la v2.0 de create-react-app

  • Se utiliza nuevas versiones de Babel (7), webpack (4) y Jest (23)
  • Más opción para los estilos. Puedes utilizar SASS y CSS Modules out-of-the-box.
  • La versión 6 de Node ya no es soportada.
  • Se mueve el soporte para IE 9 hasta IE11 a un paquete separado.
  • Puedes importar fácilmente un SVG como un componente de React y utilizarlo en JSX.
  • Puedes utilizar paquetes escritos con las últimas versiones de Node sin romper el build.
  • ... y más.

Puedes consultar todas las novedades en el Blog Post oficial o en el Changelog del proyecto en GitHub.

Espero que este post haya sido de ayuda. Estaré compartiendo nuevamente muy pronto por aquí. Disfruten probando este y muchos otros proyectos para que sea mucho más fácil para ustedes decidir cuál usar cuando estén delante de un proyecto real.

Un abrazo de su amigo Beto Quiroga.