ReactJS je velmi výkonná front-endová open-source JavaScriptová knihovna používaná pro vytváření uživatelského rozhraní a souvisejících komponent. Je spravován Facebookem a komunitou vývojářů. ReactJS lze použít při vývoji webových aplikací nebo mobilních aplikací.
V tomto tutoriálu vám ukážeme, jak nainstalovat ReactJS na váš server Ubuntu 20.04.
Předpoklady
- Ubuntu 20.04 VPS s povoleným přístupem root nebo uživatelem s oprávněními Sudo.
- 4 GB RAM (minimálně 2 GB)
- 10 GB volného místa
Krok 1:Přihlaste se přes SSH a aktualizujte svůj systém
Nejprve se budete muset přihlásit ke svému serveru Ubuntu 20.04 přes SSH jako uživatel root:
ssh root@IP_Address -p Port_number
„IP_Address“ a „Port_number“ budete muset nahradit příslušnou IP adresou vašeho serveru a číslem portu SSH. V případě potřeby navíc nahraďte „root“ uživatelským jménem sudo.
Musíte se ujistit, že všechny balíčky Ubuntu OS nainstalované na serveru jsou aktuální. Chcete-li upgradovat všechny nainstalované balíčky na vašem serveru, spusťte následující příkazy:
apt-get update apt-get upgrade
Krok 2. Instalace Nodejs a NPM
Nejprve musíte nainstalovat NodeJS, protože aplikace ReactJS může běžet pouze v případě, že je na vašem serveru nainstalován NodeJS. Node.js je open-source a multiplatformní běhové prostředí JavaScriptu postavené na JavaScriptovém enginu Chrome V8.
Jednoduchý a nejjednodušší způsob, jak nainstalovat Node.js a npm, je nainstalovat je z výchozího úložiště Ubuntu.
Ve výchozím nastavení není nejnovější verze Node.js k dispozici ve výchozím úložišti Ubuntu 20.04. Budete tedy muset do svého systému přidat oficiální úložiště Node.js.
Přidejte úložiště Node.js pomocí následujícího příkazu:
curl -sL https://deb.nodesource.com/setup_14.x | bash -
A nainstalujte Node.js z přidaných úložišť pomocí následujícího příkazu:
sudo apt-get install nodejs
Po instalaci NodeJS můžete ověřit nainstalovanou verzi Node.js pomocí následujícího příkazu:
node -v
Měli byste získat následující výstup:
v14.17.1
Jakmile je Node.js nainstalován, aktualizujte NPM na nejnovější verzi pomocí následujícího příkazu:
npm install npm@latest -g
Nyní můžete ověřit verzi npm pomocí následujícího příkazu:
npm -v
Měli byste získat následující výstup:
7.19.0
Krok 3. Nainstalujte nástroj Create-React-App
Nyní nainstalujte aplikaci create-react-app
nástroj pomocí NPM. Tento nástroj pomáhá nastavit všechny nástroje potřebné k vytvoření nového projektu v Reactu.
npm install -g create-react-app
Zkontrolujte verzi pomocí:
create-react-app --version
Měli byste získat následující výstup:
4.0.3
Krok 4:Vytvořte si aplikaci ReactJS
Svou aplikaci ReactJS můžete vytvořit pomocí následujícího příkazu:
create-react-app my-project
Po dokončení instalace byste měli vidět následující výstup:
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!
Jakmile je váš projekt vytvořen, změňte adresář na aplikaci ReactJS:
cd my-project
Nyní musíte spustit aplikaci ReactJS pomocí následujícího příkazu:
npm start
Měli byste získat následující výstup:
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.
Ve výchozím nastavení se aplikace ReactJS spouští na portu 3000.
Krok 5:Vytvoření souboru Systemd Service pro aplikaci ReactJS
Dále musíte vytvořit soubor služby systemd pro správu služby ReactJS. Můžete jej vytvořit pomocí následujícího příkazu:
nano /lib/systemd/system/reactjs.service
Přidejte následující řádky:
[Service] Type=simple User=root Restart=on-failure WorkingDirectory=/root/my-project ExecStart=npm start -- --port=3000
Uložte a zavřete soubor a poté znovu načtěte službu systemd pomocí následujícího příkazu:
systemctl daemon-reload
Dále spusťte službu ReactJS a povolte její spuštění při restartu systému pomocí následujícího příkazu:
systemctl start reactjs systemctl enable reactjs
Stav služby ReactJS můžete ověřit pomocí následujícího příkazu:
systemctl status reactjs
Měli byste získat následující výstup:
● 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
Krok 6:Přístup k webovému uživatelskému rozhraní ReactJS
Nyní otevřete webový prohlížeč a zadejte adresu URL http://ip-adresa-vašeho-serveru . Svou aplikaci ReactJS byste měli vidět na následující obrazovce:
Gratulujeme! úspěšně jste nainstalovali aplikaci ReactJS na Ubuntu 20.04.
Samozřejmě nemusíte instalovat ReactJS na Ubuntu, pokud používáte jednu z našich spravovaných hostingových služeb, v takovém případě můžete jednoduše požádat naše zkušené administrátory Linuxu, aby vám to nainstalovali. Jsou k dispozici 24×7 a okamžitě se postarají o váš požadavek.
PS . Pokud se vám líbil tento příspěvek o tom, jak nainstalovat ReactJS na Ubuntu, sdílejte jej se svými přáteli na sociálních sítích pomocí tlačítek vlevo nebo jednoduše zanechte odpověď níže. Děkuji.