Cómo instalar reactjs en 2023

Aprende cómo instalar ReactJS en 2023 con este tutorial paso a paso. Empieza a desarrollar tus proyectos con la tecnología más actualizada.

Verifica que estén instalados nodejs y npm

Para poder llevar a cabo satisfactoriamente la instalación de un proyecto de react debemos tener instalado node, Para este tutorial necesitaremos una versión de node superior a 8.10 y de npm superior a la 6 ya que usaremos la herramienta de ejecución de paquetes npx.

Copiarshell
node -v

## debería retornar algo como v13.12.0

npm -v

## 6.14.4

¿Qué hacer si nodejs no esta instalado?

En caso de que el comando anterior no regrese una versión valida de nodejs, necesitaremos instalar node para proceder con la instalación de react, aprende a instalar node en windows en este enlace, si estas usando un sistema ubuntu o derivado escribí un artículo en el que aprenderás a instalar nodejs en un sistema basado en ubuntu.

A continuación aprenderás a instalar react para iniciar una nueva aplicación.

Instalar React con vite

Ejecuta el siguiente comando para iniciar un proyecto con vite js

Copiarshell
npm create  [email protected]

A continuación asigna un nombre al proyecto y selecciona react como el framework que deseas instalar la aplicación

Copiarshell
Need to  install  the  following  packages:

[email protected]

Ok to  proceed? (y) y

✔ Project  name:  …  vite-react

? Select a framework: › - Use arrow-keys. Return to submit.

  Vanilla
  Vue
❯ React
  Preact
  Lit
  Svelte
  Others

Selecciona el lenguaje con el que deseas usar React

Copiarshell
? Select a variant: › - Use arrow-keys. Return to submit.
  ❯ JavaScript
    TypeScript

Con los pasos anteriores ya tienes la configuración del proyecto ahora navega hasta la carpeta creada y ejecuta el comando npm install para instalar las dependencias de tu proyecto.

Copiarshell
cd  vite-react

npm install

npm run  dev

Luego ejecuta npm run dev para levantar tu aplicación react ve al navegador y abre el puerto http://localhost:5173/ para ver tu app de react

Copiarshell
VITE v4.2.1  ready  in  560  ms

➜ Local:  http://localhost:5173/

➜ Network:  use  --host  to  expose

➜ press  h  to  show  help

Recomendaciones para proyectos de react de producción

En la nueva documentación de react para iniciar un proyecto se se recomienda el uso de frameworks Como nextJs, Remix o gatsby.

Para una aplicación que se va a utilizar en la vida real como un ecommerce o un blog lo mejor es usar directamente un framework, pero si solo necesitas probar, estudiar y aprender a utilizar react basta con instalar react usando vite como hicimos anteriormente.