ReactJS adalah pustaka JavaScript open-source front-end yang sangat kuat yang digunakan untuk membangun antarmuka pengguna dan komponen terkait. Itu dikelola oleh Facebook dan komunitas pengembang. ReactJS dapat digunakan dalam pengembangan Aplikasi Web atau Aplikasi Seluler.
Dalam tutorial ini, kami akan menunjukkan cara menginstal ReactJS di server Ubuntu 20.04 Anda.
Prasyarat
- VPS Ubuntu 20.04 dengan akses root diaktifkan atau pengguna dengan hak istimewa Sudo.
- RAM 4 GB (Minimal 2 GB)
- Ruang Kosong 10 GB
Langkah 1:Masuk melalui SSH dan Perbarui Sistem Anda
Pertama, Anda harus masuk ke server Ubuntu 20.04 Anda melalui SSH sebagai pengguna root:
ssh root@IP_Address -p Port_number
Anda harus mengganti 'IP_Address' dan 'Port_number' dengan alamat IP dan nomor port SSH masing-masing server Anda. Selain itu, ganti 'root' dengan nama pengguna sudo jika perlu.
Anda harus memastikan bahwa semua paket OS Ubuntu yang terinstal di server adalah yang terbaru. Jalankan perintah berikut untuk memutakhirkan semua paket yang diinstal di server Anda:
apt-get update apt-get upgrade
Langkah 2. Instal Nodejs dan NPM
Pertama, Anda perlu menginstal NodeJS karena aplikasi ReactJS hanya dapat berjalan jika NodeJS diinstal pada server Anda. Node.js adalah lingkungan runtime JavaScript open-source dan lintas platform yang dibangun di mesin JavaScript V8 Chrome.
Cara sederhana dan termudah untuk menginstal Node.js dan npm adalah menginstalnya dari repositori default Ubuntu.
Secara default, versi terbaru Node.js tidak tersedia di repositori default Ubuntu 20.04. Jadi, Anda perlu menambahkan repositori resmi Node.js ke sistem Anda.
Tambahkan repositori Node.js dengan perintah berikut:
curl -sL https://deb.nodesource.com/setup_14.x | bash -
Dan instal Node.js dari repositori yang ditambahkan dengan menjalankan perintah berikut:
sudo apt-get install nodejs
Setelah NodeJS diinstal, Anda dapat memverifikasi versi Node.js yang diinstal dengan perintah berikut:
node -v
Anda akan mendapatkan output berikut:
v14.17.1
Setelah Node.js diinstal, perbarui NPM ke versi terbaru menggunakan perintah berikut:
npm install npm@latest -g
Anda sekarang dapat memverifikasi versi npm dengan perintah berikut:
npm -v
Anda akan mendapatkan output berikut:
7.19.0
Langkah 3. Instal Create-React-App Tool
Sekarang instal create-react-app alat menggunakan NPM. Alat ini membantu mengatur semua alat yang diperlukan untuk membuat proyek baru di React.
npm install -g create-react-app
Periksa versinya dengan:
create-react-app --version
Anda akan mendapatkan output berikut:
4.0.3
Langkah 4:Buat Aplikasi ReactJS Anda
Anda dapat membuat aplikasi ReactJS Anda dengan perintah berikut:
create-react-app my-project
Setelah instalasi selesai, Anda akan melihat output berikut:
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!
Setelah proyek Anda dibuat, ubah direktori ke aplikasi ReactJS:
cd my-project
Sekarang Anda perlu memulai aplikasi ReactJS Anda dengan perintah berikut:
npm start
Anda akan mendapatkan output berikut:
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.
Secara default, aplikasi ReactJS dimulai pada port 3000.
Langkah 5:Buat File Layanan Systemd untuk Aplikasi ReactJS
Selanjutnya, Anda perlu membuat file layanan systemd untuk mengelola layanan ReactJS. Anda dapat membuatnya dengan perintah berikut:
nano /lib/systemd/system/reactjs.service
Tambahkan baris berikut:
[Service] Type=simple User=root Restart=on-failure WorkingDirectory=/root/my-project ExecStart=npm start -- --port=3000
Simpan dan tutup file, lalu muat ulang layanan systemd dengan perintah berikut:
systemctl daemon-reload
Selanjutnya, mulai layanan ReactJS dan aktifkan untuk memulai pada sistem reboot dengan perintah berikut:
systemctl start reactjs systemctl enable reactjs
Anda dapat memverifikasi status layanan ReactJS dengan perintah berikut:
systemctl status reactjs
Anda akan mendapatkan output berikut:
● 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
Langkah 6:Akses UI Web ReactJS
Sekarang, buka browser web Anda dan ketik URL http://your-server-ip-address . Anda akan melihat Aplikasi ReactJS Anda pada layar berikut:
Selamat! Anda telah berhasil menginstal Aplikasi ReactJS di Ubuntu 20.04.
Tentu saja, Anda tidak perlu menginstal ReactJS di Ubuntu jika Anda menggunakan salah satu layanan hosting Terkelola kami, dalam hal ini Anda dapat meminta admin ahli Linux kami untuk menginstal ini untuk Anda. Mereka tersedia 24×7 dan akan segera memenuhi permintaan Anda.
PS . Jika Anda menyukai posting ini tentang cara menginstal ReactJS di Ubuntu, silakan bagikan dengan teman-teman Anda di jejaring sosial menggunakan tombol di sebelah kiri atau cukup tinggalkan balasan di bawah. Terima kasih.