
PANDUAN INSTALASI KEBUTUHAN DAY 1 DAN PENGATURAN AWAL REACT JS
===
>Wonderfull Adventure Of Website Season 5
[CODER Telkom University Surabaya] [color=#ff0000]
## Table of Contents
[TOC]
## Apa Yang Perlu Disiapkan?
1. **Laptop atau PC** dengan sistem operasi:
- Windows 10/11 (disarankan versi terbaru)
- macOS (versi terbaru)
- Linux (untuk guidebook ini menggunakan debian based distro)
2. **Editor Kode**: Kami merekomendasikan Visual Studio Code (VS Code).
3. **Browser Modern**: Chrome, Firefox, atau Edge.
4. ==**Koneksi internet yang stabil**==
Instalasi NodeJs & NPM
---
Sebelum mulai dengan ReactJS, ==kita perlu menginstal Node.js== karena ReactJS bergantung pada ekosistem Node.js untuk menjalankan aplikasi dan mengelola dependensi menggunakan npm (Node Package Manager).
Sebelum melanjutkan instalasi, pastikan anda sudah memenuhi persyaratan diatas dan memiliki ==koneksi internet yang stabil==
Berikut langkah-langkah instalasi berdasarkan sistem operasi Anda:
## Windows
>Installasi Node.js untuk Sistem Operasi Windows
1. Pergi ke web [NodeJs]("https://nodejs.org/en/download/prebuilt-installer")
2. Pilih versi node js yang kalian inginkan (minimum untuk create-react-app adalah 14.0.0 ) atau bisa memilih versi yang sama pada gambar

3. Klik download
4. Buka set up node js nya

5. Centang license & agreement lalu klik next

6. Pilih destinasi untuk tempat node js diinstal

7. Pada tampilan ini, anda bisa mengatur untuk instalasi node js nya. Pastikan opsi 'Add to PATH' tercentang agar Node.js, npm, dan modul yang terpasang secara global bisa dikenali oleh komputer. Jika sudah klik next

6. Pada tampilan ini, Anda diberikan pilihan untuk menambahkan tools pendukung seperti Python dan Visual Studio Build Tools. Namun, jika Anda tidak memerlukannya (misal untuk penggunaan Node.js dasar), Anda bisa melewati opsi ini dengan tidak mencentangnya

7. Jika sudah muncul tampilan seperti ini, maka anda siap untuk menginstal Node.js pada komputer anda

8. Jika sudah selesai proses instalasinya, anda bisa klik finish

9. Buka powershell atau cmd untuk memeriksa apakah Node.js dan NPM sudah terinstal pada komputer. Setelah itu ketikkan kedua command dibawah ini :
```
node –-version
```
```
npm –-version
```

## Mac OS
>Installasi Node.js untuk Sistem Operasi MacOS
### Instalasi Menggunakan Homebrew Package Manager (Disarankan)
:::info
#### Installasi Homebrew
> lewati langkah ini jika homebrew sudah terinstall di komputer anda
:::
1. Pergi ke webiste resmi dari homebrew : [:beer: Homebrew]("https://brew.sh").

2. Buka terminal di macos dengan menekan tombol `command (⌘) + space`. Lalu ketikan “terminal” dan tekan `return / enter`

3. Salin kode yang ada di website [:beer: Homebrew]("https://brew.sh").

Atau Salin kode dibawah ini:
```bash!
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
```
4. Tempelkan di terminal dan tekan enter

Masukkan password komputer anda dan tekan enter lagi
Setelah muncul seperti gambar dibawah, tekan enter lagi

5. Tunggu hingga proses download dan instalasi selesai & pastikan komputer anda terkoneksi dengan internet selama instalasi

6. Salin dan tempelkan perintah berikut di terminal, lalu tekan enter untuk menjalankan

> perintah dapat berbeda-beda sesuai komputer
7. Setelah itu jalankan perintah dibawah di terminal
```bash!
brew --version
```

Jika sudah persis seperti diatas, instalasi homebrew telah sepenuhnya berhasil
:::info
#### Installasi Node JS & NPM
:::
1. Buka terminal di macos dengan menekan tombol `command (⌘) + space`. Lalu ketikan “terminal” dan tekan `return / enter`

2. Ketikan perintah berikut di terminal dan tekan enter
```bash!
brew install node
```
Tunggu hingga instalasi selesai

3. Ketikan perintah berikut di terminal dan tekan enter
```bash!
node -v
npm -v
```

Jika sudah tampil seperti diatas maka instalasi sudah berhasil
### Instalasi Menggunakan Installer
1. Pergi ke halaman download resmi NodeJs : [Node.js — Download Node.js®](https://nodejs.org/en/download/package-manager)

2. Pastikan versi yang dipilih merupakan versi yang terbaru dan pilihan sudah seperti gambar dibawah

Jika sudah, klik tombol download
3. Jika download sudah selesai, double klik pada item yang baru di download

4. Pastikan setup instalasi tampil

Klik continue
5. Klik Continue di halaman lisensi

6. Klik Agree untuk melanjutkan

7. Klik Install

> Anda bisa melakukan kustomisasi instalasi di bagian ini, juga memilih lokasi instalasi. Namun untuk saat ini kita akan menggunakan instalasi default.

Anda akan diminta untuk memasukkan password ketika menginstall
Tunggu proses installasi selesai

Instalasi berhasil jika sudah tampil seperti ini

:::info
:bulb: Pengaturan tambahan
Buka terminal dan jalankan perintah
```bash!
export PATH=/usr/local/bin:$PATH
```
`Langkah ini dilakukan untuk menambahkan Node yang baru saja di instal kedalam path variable agar bisa diakses secara global`
:::
8. Jika sudah klik close, dan Klik move to trash untuk menghapus installer

9. Ketikan perintah berikut di terminal dan tekan enter
```bash!
node -v
npm -v
```

Jika sudah tampil seperti diatas maka instalasi sudah sepenuhnya berhasil
## Linux (Debian Based)
>Installasi Node.js untuk Sistem Operasi Linux
1. Pergi ke web [NodeJs]("https://nodejs.org/en/download/prebuilt-installer")

3. Buka terminal dengan menekan tombol window, lalu klik enter

5. Salin command yang ada dibagian paling atas pada web Node.js

atau copy command di bawah:
```
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.0/install.sh | bash
```
4. Paste pada terminal dan klik enter, lalu tunggu prosesnya hingga muncul sesuai yang tertera pada gambar

5. Restart terminal
6. Kembali pada halaman web Node.js lalu copy command yang tertera seperti pada gambar

atau copy command dibawah ini :
```
nvm install 22
```
7. Paste pada terminal dan klik enter, lalu tunggu prosesnya hingga muncul sesuai yang tertera pada gambar

7. Periksa apakah Node dan NPM sudah terinstal pada komputer, dengan mengetikkan kedua command di bawah ini :
```
node -v
```
```
npm -v
```

## Penutup
**Itu tadi teman - teman, hal - hal yang perlu dipersiapkan dari menyiapkan pc atau laptop sampai dengan instalasi Node.js untuk mengikuti workshop WAOW day 1** :+1:
Bila teman - teman memiliki kendala saat instalasi Node.js atau kendala lain, bisa didiskusikan di grup peserta :i_love_you_hand_sign:
Terimakasih, semangat menjalani workshop day 1 :smiley:
==**Love U All**== -anomali panitia WAOW Season 5