[React Js](https://id.wikipedia.org/wiki/React.js) merupakan library *JavaScript* yang populer untuk membangun antarmuka pengguna* (UI) interaktif*. Berkat kemudahan React Js dalam penggunaan dan *fleksibilitas nya*, kini *library* ini menjadi pilihan banyak developer untuk berbagai macam proyek web. 

Namun, sebelum kamu bisa bertualang ke dunia pengembangan web, kita akan coba telusuri cara install React Js pada beberapa sistem operasi yaitu Windows, MacOS, dan Linux. 

Sebelum masuk ke detail nya, mari kita ulas terlebih dahulu apa itu React Js. Fungsi React Js dan kemudian kita bahas instalasinya. 

## Apa itu React JS?

React JS adalah pustaka JavaScript yang di gunakan untuk membangun antarmuka pengguna yang *interaktif*. Di kembangkan oleh [Jordan Walke](https://twitter.com/jordwalke?lang=id) seorang *Software Engineer Facebook*, React JS telah menjadi salah satu alat terkemuka dalam pengembangan aplikasi web modern. Dengan pendekatan berbasis komponen, React JS memungkinkan pengembang untuk membuat aplikasi yang efisien dan mudah dikelola.

**Baca Juga :** [*Yuk Belajar React Js dari Pemula sampai Mahir!*](https://www.codepolitan.com/blog/cara-belajar-react-js-dari-pemula-sampai-mahir/)


### Siapa yang menggunakan React JS?

React JS memiliki *popularitas* yang tinggi khususnya di antara berbagai developer karena menyediakan cara yang efisien dan kuat untuk membangun *situs web* dan *aplikasi web*. Para web developer sangat terbantu dengan adanya React JS. Yang mana hal ini membuat para web developer dapat membangun situs web yang *menarik* dan *responsive* serta dapat membangun aplikasi standar yang lebih mudah di perbarui. 

React  JS juga bisa menyederhanakan proses pembuatan UI user yang kompleks serta membuat komponen dapat di lihat user yang berinteraksi dengan *Backend dan API*. Terlebih lagi bagi seorang *fullstack developer*, dengan menggunakan React JS di barengi dengan teknologi *Node Js*, *Express* dan *MongoDB* menunjang dan mengoptimalkan fitur lengkap pada aplikasi web serta memudahkan integrasi dengan berbagai sistem *backend*.

Banyak perusahaan besar menggunakan React JS dalam pengembangan aplikasi mereka. Perusahaan seperti **Facebook**, **Instagram**, **Netflix**, dan **Airbnb** telah mengadopsi React JS untuk membangun antarmuka pengguna yang *responsif* dan dinamis. Keberhasilan React JS dalam industri teknologi menjadikannya salah satu alat yang paling di cari dalam pengembangan aplikasi web.

## Prasyarat Instalasi React Js

Sebelum memulai instalasi, pastikan perangkat kamu telah memenuhi prasyarat berikut:

Node.js dan npm: React Js bergantung pada Node.js dan Node Package Manager (npm) untuk menjalankan dan mengelola dependensi. Kamu  bisa mengunduhnya dari situs resmi Node.js [https://nodejs.org/en/download](https://nodejs.org/en/download). 

![](https://apps.codepolitan.com/sites/learn/uploads/original/202308/nodejs.png)

Setelah instalasi selesai, kamu bisa memverifikasi Node JS. Jika sudah terinstall dengan membuka *command prompt* dan menjalankan perintah berikut:

<pre><code>Node -v npm -v</code></pre>

### Install React Js di Windows

Tahukah kamu ders cara install React Js di windows itu ada dua cara utama. Yaitu dengan menggunakan perintah create-react-app dan instalasi manual. Berikut ini cara simpel yang bisa kamu coba nih ders.

#### 1. Menggunakan create-react-app:

*Buka Command Prompt*.

Navigasi ke direktori tempat Anda ingin membuat proyek React Js.

Jalankan perintah berikut:

<pre><code>npx create-react-app my-app</code></pre>

(*Ganti my-app dengan nama proyek kamu yang diinginkan*)

Setelah proyek dibuat, buka direktori proyek dengan menjalankan perintah sebagai berikut di command prompt:

<pre><code>cd my-app</code></pre>

sekarang, mulai server pengembangan dengan menjalankan perintah sebagai berikut:

<pre><code>npm start</code></pre>

perintah tersebut meluncurkan server pengembangan, mengawasi perubahan pada file proyek kamu secara otomatis memuat ulang ketika ada perubahan. Jendela browser akan terbuka dengan aplikasi React kamu berjalan [http://localhost:3000/](http://localhost:3000/) seperti di bawah ini

![](https://apps.codepolitan.com/sites/learn/uploads/original/202308/react_js.png)

Perintah ini akan membuat struktur [*direktori*](https://id.wikipedia.org/wiki/Direktori) proyek React Js dasar dan menginstal semua dependensi yang diperlukan.

##### 2. Instal React Js Manual:

Instal Node.js dan npm seperti yang dijelaskan pada bagian prasyarat.

Buka Command Prompt.

Jalankan perintah berikut untuk menginstal React secara global:

<pre><code>npm install -g react react-dom</code></pre>

Untuk membuat proyek baru, navigasi ke direktori yang diinginkan dan jalankan perintah:

<pre><code>npx create-react-app my-app</code></pre>

Setelah proyek dibuat, buka direktori proyek dengan menjalankan perintah sebagai berikut di command prompt:

<pre><code>cd my-app</code></pre>

sekarang, mulai server pengembangan dengan menjalankan perintah sebagai berikut:

<pre><code>npm start</code></pre>

perintah tersebut meluncurkan server pengembangan, mengawasi perubahan pada file proyek kamu secara otomatis memuat ulang ketika ada perubahan. Jendela browser akan terbuka dengan aplikasi React kamu berjalan http://localhost:3000/ seperti di bawah ini

![](https://apps.codepolitan.com/sites/learn/uploads/original/202308/react_js.png)

**Catatan:** Menggunakan create-react-app adalah pendekatan yang lebih disarankan untuk pemula karena kemudahannya dan konfigurasi default yang sudah lengkap.

### Install React Js di MacOS
Nah sama hal nya dengan instalasi di windows, jika instal react js di MacOs juga ada dua cara. Begini cara simpel yang bisa kamu coba nih ders jangan lupa di praktekkan ya.

#### 1. Menggunakan Homebrew:
Instal Homebrew jika belum ada. Anda bisa mengikuti petunjuk instalasi di https://brew.sh/.

![](https://apps.codepolitan.com/sites/learn/uploads/original/202308/homebrew.png)

Buka Terminal.

Jalankan perintah di bawah ini untuk menginstal Node.JS dan npm melalui Homebrew:

<pre><code>brew install node</code></pre>

Setelah instalasi selesai, jalankan perintah:

<pre><code>npx create-react-app my-app</code></pre>

Setelah proyek dibuat, buka direktori proyek dengan menjalankan perintah sebagai berikut di command prompt:

<pre><code>cd my-app</code></pre>

sekarang, mulai server pengembangan dengan menjalankan perintah sebagai berikut:

<pre><code>npm start</code></pre>

perintah tersebut meluncurkan server pengembangan, mengawasi perubahan pada file proyek kamu secara otomatis memuat ulang ketika ada perubahan. Jendela browser akan terbuka dengan aplikasi React kamu berjalan http://localhost:3000/ seperti di bawah ini

![](https://apps.codepolitan.com/sites/learn/uploads/original/202308/react_js.png)

#### 2. Install React Js Manual

Instal Node.js dan npm secara langsung dari situs resmi Node.js.

Buka Terminal.

Jalankan perintah berikut untuk menginstal React secara global:

<pre><code>npm install -g react react-dom</code></pre>

Untuk membuat proyek baru, navigasi ke direktori yang diinginkan dan jalankan perintah:

<pre><code>npx create-react-app my-app</code></pre>

Setelah proyek dibuat, buka direktori proyek dengan menjalankan perintah sebagai berikut di command prompt:

<pre><code>cd my-app</code></pre>

sekarang, mulai server pengembangan dengan menjalankan perintah sebagai berikut:

<pre><code>npm start</code></pre>

perintah tersebut meluncurkan server pengembangan, mengawasi perubahan pada file proyek kamu secara otomatis memuat ulang ketika ada perubahan. Jendela browser akan terbuka dengan aplikasi React kamu berjalan http://localhost:3000/ seperti di bawah ini

![](https://apps.codepolitan.com/sites/learn/uploads/original/202308/react_js.png)

**Catatan:** Menggunakan Homebrew adalah cara yang populer untuk mengelola dependensi di MacOS, namun Anda tetap bisa menggunakan instalasi manual Node.js jika lebih nyaman.

**Baca Juga :** [*Mau Jadi Web Programming? Belajar React Js Yuk!*](https://www.codepolitan.com/blog/mau-jadi-web-programming-belajar-reactjs-yuk/)


### Install React Js di Linux

Proses instalasi React Js di Linux sedikit berbeda antar distribusi. Berikut contoh untuk Ubuntu/Debian:

Buka Terminal.

Perbarui daftar paket dengan perintah:

<pre><code>sudo apt-get update</code></pre>

Instal Node.js dan npm dengan perintah:

<pre><code>sudo apt-get install nodejs npm</code></pre>

Setelah instalasi selesai, jalankan perintah:

<pre><code>npx create-react-app my-app</code></pre>

Untuk *distribusi* Linux lainnya, Anda bisa mencari petunjuk spesifik instalasi Node.js dan npm di dokumentasi resmi distribusi tersebut.

**Catatan:** Setelah install react js selesai, Anda bisa menjalankan aplikasi nya di command prompt:

<pre><code>cd my-app</code></pre>

sekarang, mulai server pengembangan dengan menjalankan perintah sebagai berikut:

<pre><code>npm start</code></pre>

perintah tersebut meluncurkan server pengembangan, mengawasi perubahan pada file proyek kamu secara otomatis memuat ulang ketika ada perubahan. Jendela browser akan terbuka dengan aplikasi React kamu berjalan http://localhost:3000/ seperti di bawah ini

![](https://apps.codepolitan.com/sites/learn/uploads/original/202308/react_js.png)

Selamat! Anda telah berhasil menginstal React Js!

Sekarang Anda siap untuk mulai belajar dan membangun aplikasi web menggunakan React Js. Selamat mencoba dan happy coding!
[![](https://image.web.id/images/belajar-coding-gratis.png)](https://www.codepolitan.com/roadmap/)

### Announcement

Dokumentasi resmi React Js https://react.dev/ merupakan sumber yang baik untuk mempelajari lebih lanjut tentang React Js.

Ada banyak tutorial dan kursus online di [CODEPOLITAN](https://www.codepolitan.com/) yang tersedia untuk membantu Anda belajar React Js dengan mudah. Ayo coba kelasnya dan jangan ragu untuk menjelajahi dunia react js lebih dalam dengan expert nya.

Cara Install React Js di Windows, MacOS, dan Linux

GenAI Video Fest adalah ajang kompetisi video kreatif yang diselenggarakan oleh CODEPOLITAN bekerjasama dengan Alibaba Cloud.

Kami menantang kreator, tech-enthusiast, dan siapa saja untuk mendobrak batas imajinasi menggunakan teknologi Generative AI terbaru. Di sini, kamu wajib menggunakan WAN Model Studio dari Alibaba Cloud sebagai tools utama untuk menghasilkan karya videomu (bisa dikombinasikan dengan tools editing lainnya).

Tunjukkan pada dunia bagaimana teknologi dan kreativitas bisa bersatu menciptakan karya visual yang berdampak!

Kategori Kompetisi
Pilih satu dari empat tema besar ini untuk karyamu:
* Humanity (Kemanusiaan): Cerita yang menyentuh hati, sosial, dan kepedulian antar sesama.
* Sports (Olahraga): Energi, semangat juang, dan dinamika dunia olahraga.
* Entertainment (Hiburan): Komedi, musik, video klip, atau parodi yang menghibur.
* Science (Sains): Visualisasi masa depan, teknologi, alam semesta, atau penemuan ilmiah.

Total Prize Pool senilai Rp 250.000.000 menunggu para pemenang!
* Top Winners Rewards: Uang Tunai, Alibaba Cloud Credits (hingga $500), Merchandise Eksklusif, dan SWAG CODEPOLITAN.
* Lucky Draw Event: Kesempatan menang hadiah tambahan bagi peserta yang beruntung.
* Massive Exposure: Karya terbaik akan di-highlight di media sosial CODEPOLITAN, Alibaba Cloud, dan channel industri kreatif lainnya.
* Special Access (Khusus Alumni RuangAI): Dapatkan 2 Token untuk klaim Kelas Spesialisasi di RuangAI secara gratis.

Jangan sampai ketinggalan tanggal penting ini:
* Pendaftaran & Submission: 23 Desember 2024 - 23 Januari 2025
* Penjurian (Judging Phase): 24 - 26 Januari 2025
* Pengumuman Pemenang: 27 Januari 2025

Cara Ikutan:
1. Daftar: Klik tombol "Daftar Sekarang" dan pastikan kamu punya akun RuangAI.
2. Join Discord: Masuk ke server Discord komunitas untuk info teknis dan diskusi.
3. Create: Buat video kreatifmu menggunakan WAN Model Studio (Alibaba Cloud) sesuai kategori pilihan.
4. Upload & Submit: Unggah videomu ke media sosial (IG/TikTok/YouTube) dan submit link karyamu di halaman submission RuangAI.

Ikuti kompetisi video Generative AI terbesar dari CODEPOLITAN dan Alibaba Cloud! Gunakan teknologi WAN Model Studio untuk menyulap ide liarmu menjadi visual memukau. Rebut total hadiah senilai Rp 250.000.000!

GenAI Video Fest

Beasiswa Basic Cybersecurity adalah program inisiatif dari JagoanSiber yang dirancang untuk membuka wawasan masyarakat luas tentang dunia keamanan digital. Program ini hadir untuk menjawab kebutuhan talenta keamanan siber yang tinggi, dimulai dengan membangun pemahaman fundamental yang kokoh.

Program ini berbentuk Kelas Online Belajar Mandiri (Self-Paced Learning) berbasis video. Peserta diberikan keleluasaan penuh untuk mengakses materi kapan saja dan di mana saja tanpa terikat jadwal, sehingga sangat fleksibel bagi pelajar, mahasiswa, maupun pekerja profesional.

Kelebihan utama program ini adalah aksesnya yang 100% GRATIS dan terbuka untuk siapa saja tanpa syarat latar belakang IT. Peserta akan dibimbing langsung oleh Mahrus Qusaery, seorang praktisi keamanan siber berpengalaman, yang akan mengupas tuntas materi dasar yang krusial.

Program beasiswa kelas online gratis untuk mempelajari dasar keamanan siber dari nol. Belajar mandiri berbasis video langsung dari praktisi ahli, Mahrus Qusaery.

Cara Install React Js di Windows, MacOS, dan Linux

Learning

KelasFullstack

RuangAI

JagoanSiber

Baca Artikel Lainnya

ChatGPT adalah Kawan atau Lawan Bagi Programmer?

Belajar Membangun Proyek Open Source, Emang bisa?

13+ Rahasia Dibalik Skills Frontend Developer di Buru Perusahaan

10 Tips & Trik Penggunaan Shortcut Vscode, Pelajari Yuk!

Cara Menghapus Commit Git: Panduan Praktis dan Terbaik!

Tingkatkan Teknologi AI, Indonesia Jalin Kerjasama dengan AS