#2 Instalasi— Seminggu Menjadi Master React JS — Seri Tingkat Dasar
Ini adalah artikel kedua dari serial Seminggu Menjadi Master React JS — Seri Tingkat Dasar. Pada artikel kedua ini kita akan mencoba bagaimana melakukan instalasi react js.
React js itu sangat flexibel bisa digunakan dalam berbagai proyek. Kita dapat membuat aplikasi baru full dengan react js, namun kita juga dapat menyisipkan react js pada project yang sudah kita kembangkan, tanpa perlu melakukan proses rewriting.
Jika kita baru ingin mencoba-coba saja, dan tidak mau melakukan instalasi apapun, kita bisa menggunakan codepen, disitu tinggal ubah-ubah sesuai keinginan. Ini adalah contoh menampilkan Hello Word dengan react js.
Ada 2 cara populer melakukan instalasi react js, antara lain :
#1 Package Manager
Kita bisa menggunakan npm
atau yarn
sebagai package manager, meskipun source package dari kedua package manager ini diambil dari source yang sama yaitu npm registry, namun saya sendiri lebih suka pake yarn
, karena merasa lebih kenceng,
Untuk membuat aplikasi baru full dengan react, kita bisa menggunakan bantuan package Create React App. Lakukan instalasi package create-react-app
dengan menjalankan perintah npm install -g create-react-app
pada command line.
Setelah proses instalasi package create-react-app
selesai, kita bisa langsung memulai membuat aplikasi react pertama kita.
Jalankan create-react-app my-app
pada command line.
Jika proses create react app berhasil maka akan tampil informasi success, seperti pada gambar dibawah ini:
Masuk kedalam folder nama aplikasi, kemudian jalan kan npm start
atau yarn start
untuk mencompile aplikasi.
Jika proses compile berhasil maka akan tampil seperti pada gambar dibawah ini, buka url L0cal atau On Your Network maka akan tampil halaman Welcome to React.
Ini adalah halaman welcome to react, jika sudah tampil halaman seperti ini maka create react projek pertama kita sudah berhasil!!!
#2 CDN
Jika kita tidak ingin menggunakan package manager seperti npm
atau yarn
, npm juga menyediakan distribusi file tunggal dalam folder dist:
<script crossorigin src=”https://unpkg.com/react@15/dist/react.js"></script> <script crossorigin src=”https://unpkg.com/react-dom@15/dist/react-dom.js"></script>
Versi diatas hanya untuk mode development
, untuk mode production
kita diharuskan menggunakan source yang sudah Minified and optimized:
<script crossorigin src=”https://unpkg.com/react@15/dist/react.min.js"></script><script crossorigin src=”https://unpkg.com/react-dom@15/dist/react-dom.min.js"></script>
# Kesimpulan
Untuk melakukan instalasi react js ada 2 cara yaitu:
- Menggunakan Package manager(npm, yarn)
- Menggunakan CDN(menyisipkan source react pada halaman web)
Happy Coding
Safei Muslim
Daftar isi >> Seminggu Menjadi Master React JS — Seri Tingkat Dasar
Sebelumnya >> #1 Pendahuluan — Seminggu Menjadi Master React JS — Seri Tingkat Dasar