ReactJS es una biblioteca de JavaScript de código abierto de front-end muy poderosa que se utiliza para construir la interfaz de usuario y los componentes relacionados. Es mantenido por Facebook y la comunidad de desarrolladores. ReactJS se puede utilizar en el desarrollo de aplicaciones web o aplicaciones móviles.
En este tutorial, le mostraremos cómo instalar ReactJS en su servidor Ubuntu 20.04.
Requisitos
- Un VPS Ubuntu 20.04 con acceso raíz habilitado o un usuario con privilegios de Sudo.
- 4 GB de RAM (mínimo 2 GB)
- 10 GB de espacio libre
Paso 1:Inicie sesión a través de SSH y actualice su sistema
Primero, deberá iniciar sesión en su servidor Ubuntu 20.04 a través de SSH como usuario raíz:
ssh root@IP_Address -p Port_number
Deberá reemplazar 'IP_Address' y 'Port_number' con la dirección IP y el número de puerto SSH respectivos de su servidor. Además, reemplace 'root' con el nombre de usuario sudo si es necesario.
Debe asegurarse de que todos los paquetes del sistema operativo Ubuntu instalados en el servidor estén actualizados. Ejecute los siguientes comandos para actualizar todos los paquetes instalados en su servidor:
apt-get update apt-get upgrade
Paso 2. Instalar Nodejs y NPM
Primero, debe instalar NodeJS, ya que una aplicación ReactJS solo puede ejecutarse si NodeJS está instalado en su servidor. Node.js es un entorno de tiempo de ejecución de JavaScript multiplataforma y de código abierto creado en el motor de JavaScript V8 de Chrome.
La forma más sencilla y sencilla de instalar Node.js y npm es instalarlos desde el repositorio predeterminado de Ubuntu.
De forma predeterminada, la última versión de Node.js no está disponible en el repositorio predeterminado de Ubuntu 20.04. Por lo tanto, deberá agregar el repositorio oficial de Node.js a su sistema.
Agrega el repositorio de Node.js con el siguiente comando:
curl -sL https://deb.nodesource.com/setup_14.x | bash -
E instale Node.js desde los repositorios agregados ejecutando el siguiente comando:
sudo apt-get install nodejs
Una vez que se haya instalado NodeJS, puede verificar la versión instalada de Node.js con el siguiente comando:
node -v
Deberías obtener el siguiente resultado:
v14.17.1
Una vez que Node.js esté instalado, actualice el NPM a la última versión usando el siguiente comando:
npm install npm@latest -g
Ahora puede verificar la versión de npm con el siguiente comando:
npm -v
Deberías obtener el siguiente resultado:
7.19.0
Paso 3. Instale la herramienta Create-React-App
Ahora instala la create-react-app herramienta usando NPM. Esta herramienta ayuda a configurar todas las herramientas necesarias para crear un nuevo proyecto en React.
npm install -g create-react-app
Verifique la versión con:
create-react-app --version
Deberías obtener el siguiente resultado:
4.0.3
Paso 4:crea tu aplicación ReactJS
Puede crear su aplicación ReactJS con el siguiente comando:
create-react-app my-project
Una vez finalizada la instalación, debería ver el siguiente resultado:
Success! Created my-project at /root/my-project Inside that directory, you can run several commands: npm start Starts the development server. npm run build Bundles the app into static files for production. npm test Starts the test runner. npm run eject Removes this tool and copies build dependencies, configuration files and scripts into the app directory. If you do this, you can’t go back! We suggest that you begin by typing: cd my-project npm start Happy hacking!
Una vez que haya creado su proyecto, cambie el directorio a la aplicación ReactJS:
cd my-project
Ahora necesita iniciar su aplicación ReactJS con el siguiente comando:
npm start
Deberías obtener el siguiente resultado:
Compiled successfully! You can now view my-project in the browser. Local: http://localhost:3000 On Your Network: http://192.168.1.101:3000 Note that the development build is not optimized. To create a production build, use npm run build.
De forma predeterminada, la aplicación ReactJS se inicia en el puerto 3000.
Paso 5:Cree un archivo de servicio Systemd para la aplicación ReactJS
A continuación, debe crear un archivo de servicio systemd para administrar el servicio ReactJS. Puedes crearlo con el siguiente comando:
nano /lib/systemd/system/reactjs.service
Agregue las siguientes líneas:
[Service] Type=simple User=root Restart=on-failure WorkingDirectory=/root/my-project ExecStart=npm start -- --port=3000
Guarde y cierre el archivo, luego vuelva a cargar el servicio systemd con el siguiente comando:
systemctl daemon-reload
A continuación, inicie el servicio ReactJS y habilítelo para que se inicie al reiniciar el sistema con el siguiente comando:
systemctl start reactjs systemctl enable reactjs
Puede verificar el estado del servicio ReactJS con el siguiente comando:
systemctl status reactjs
Deberías obtener el siguiente resultado:
● reactjs.service Loaded: loaded (/lib/systemd/system/reactjs.service; static; vendor preset: enabled) Active: active (running) Main PID: 66390 (npm start --por) Tasks: 30 (limit: 2248) Memory: 188.7M CGroup: /system.slice/reactjs.service ├─66390 npm start --port=3000 ├─66401 sh -c react-scripts start "--port=3000" ├─66402 node /root/my-project/node_modules/.bin/react-scripts start --port=3000 └─66409 /usr/bin/node /root/my-project/node_modules/react-scripts/scripts/start.js --port=3000
Paso 6:Acceda a la interfaz de usuario web de ReactJS
Ahora, abra su navegador web y escriba la URL http://your-server-ip-address . Debería ver su aplicación ReactJS en la siguiente pantalla:
¡Felicidades! ha instalado con éxito la aplicación ReactJS en Ubuntu 20.04.
Por supuesto, no es necesario que instale ReactJS en Ubuntu si usa uno de nuestros servicios de alojamiento administrado, en cuyo caso simplemente puede pedirle a nuestros administradores expertos de Linux que lo instalen por usted. Están disponibles las 24 horas del día, los 7 días de la semana y atenderán su solicitud de inmediato.
PD . Si le gustó esta publicación sobre cómo instalar ReactJS en Ubuntu, compártala con sus amigos en las redes sociales usando los botones a la izquierda o simplemente deje una respuesta a continuación. Gracias.