Cómo instalar React.js con create-react-app

React es una de las bibliotecas de JavaScript más populares en el campo del desarrollo web en la actualidad.

Como desarrollador frontend, he trabajado personalmente con React en mis proyectos y probablemente continuaré trabajando con él en el futuro. Uno de los pasos con los que muchas personas luchan es el proceso de instalación / configuración de React.

Así que comencemos con lo básico. En esta publicación, aprenderá cómo instalar y ejecutar una aplicación React de manera fácil.

Dado que el interés en aprender React también aumenta rápidamente día a día, también he decidido crear videos tutoriales sobre React en mi canal de YouTube. Aquí hay una versión en video de este tutorial:

Cómo descargar e instalar Node.js

En primer lugar, necesitará NPM (o Yarn, alternativamente). Usemos NPM para este ejemplo.

Si no lo tiene instalado en su sistema, debe dirigirse al sitio web oficial de Node.js para descargar e instalar Node, que también incluye NPM (Node Package Manager).

Seleccione el botón "Recomendado para la mayoría de los usuarios" y descargue la versión actual para su sistema operativo.

Después de descargar e instalar nodo, inicie el comando / terminal de pronta y ejecutar node -vy npm -vpara ver qué versiones que tiene.

Su versión de NPM debe ser al menos 5.2.0 o más reciente porque create-react-app requiere que tengamos NPX instalado. Si tiene una versión anterior de NPM, ejecute este comando para actualizarla:

npm install -g npm

¿Qué es create-react-app?

Dado que es complicado y lleva mucho tiempo, no queremos configurar React manualmente. create-react-app es una forma mucho más fácil que hace toda la configuración y las instalaciones de paquetes necesarias para nosotros automáticamente e inicia una nueva aplicación React localmente, lista para el desarrollo.

Otra ventaja de usar create-react-app es que no tiene que lidiar con configuraciones de Babel o Webpack. Create-react-app realizará todas las configuraciones necesarias para usted.

Según la documentación de React, create-react-app es una de las formas oficialmente admitidas para crear aplicaciones de una sola página en React. Puedes encontrar otras formas aquí.

Cómo instalar la aplicación Create-React

Para instalar su aplicación, primero vaya a su espacio de trabajo (escritorio o carpeta) y ejecute el siguiente comando:

npx create-react-app my-app

El proceso de instalación puede tardar unos minutos. Una vez hecho esto, debería ver una carpeta que aparece en su espacio de trabajo con el nombre que le dio a su aplicación.

Nota: Si está en Mac y recibe errores de permisos, no olvide ser un superusuario primero con el comando sudo.

Cómo ejecutar la aplicación que creó con Create-React-App

Una vez completada la instalación, cambie al directorio donde se instaló su aplicación:

cd my-app

y finalmente ejecute npm startpara ver su aplicación en vivo en localhost:

npm start

Si ve algo como esto en su navegador, está listo para trabajar con React. ¡Felicidades! :)

¡Gracias por leer!