Initekno.com – Assalamualaikum developing, selamat datang di tutorial reactjs pertama di situs initekno.com, situs yang membahasa seputar pemrograman anak bangsa. Kita tentu pernah mendengar kata reactjs dalam forum-forum pemrograman atau pun dalam artikel yang bertebaran di internet. Nah.. kali ini kita akan membahsa reactjs dasar. Lalu saya harus mulai dari mana?.. kita mulai dari pengertian reactjs dulu deh.
Daftar Isi
Pengertian ReactJS
React js adalah sebuah library javascript yang di gunakan untuk membangun sebuah user interface, dan reactjs bukan framework atau pun bahasa pemrograman. React js di buat, di kembangkan oleh facebook dan bersifat open source, yang artinya semua orang bebas untuk merubah kodenya sesuka hati mereka.
Sesuai dengan yang tertera di situs reactjs, bahawasanya library ini menawarkan beberapa macam fitur yang akan membuat kamu terkagum-kagum, yaitu :
- Simpel komponen
- Berbasis Komponen
- Rendering Application
- Menggunakan Komponen Plugin External
- Belajar Sekali Tulis di Mana Saja artinya kode bisa di gunakan di project manapun
Cara Install ReactJS
Untuk menjalankan reactjs pada komputer kamu, ada beberapa hal yang harus kamu persiapkan, tetapi sebelumnya pastikan komputer atau laptop kamu sudah terkoneksi internet. Karenan nantinya kita akan mendownload paket reactjs dan node modul yang di butuhkan.
- Download dan instal terlebih dahulu Git. Kenapa git? ya, untuk belajar pemrograman di tahun 2019 ini, rasanya sudah ketinggalan jaman jika kita tidak langsung menyimpan project kita di repository server. maka dari itu, mulai sekarang kita akan mulai membiasakan dengan repository .
- Install yarn. Apa lagi ini?.. yarn adalah sebuah manajemen dependensi yang cepat handal dan aman, yarn berfungsi untuk mendownload paket-paket yang nantinya di butuhkan untuk menjalankan reactjs. Selain yarn kamu juga bisa menggunakan npm tetapi saya lebih suka menggunakan yarn karena lebih kencang.
Membuat Project Awal Reactjs
Untuk mulai membuat aplikasi dalam reacjs silahkan buka command line kamu dan tuliskan
|
1 |
npm install -g create-react-app |
setelah selesai mendownload paketnya maka sekarang kita bisa langsung membuat aplikasi react untuk yang pertama kali, maka silahkan tulis lagi pada command line
|
1 |
create-react-app namaaplikasikamu |
namaaplikasi bebas kamu ubah sesuai dengan nama project yang sedang kamu buat. seperti contoh :
|
1 |
create-react-app crud-reactjs |
Jika berhasil maka kamu akan mendapati tampilan seperti berikut ini :
Menjalankan ReactJS Pada Browser
Setelah semua hal di atas kamu lakukan, maka sekarang tinggal menjalankan project react yang kamu buat, kamu bisa menjalankannya seperti berikut
|
1 2 |
cd crud-reactjs yarn start |
Maka hasilnya akan nampak seperti berikut ini pada command line kamu.
Selanjutnya buka browser dan jalankan di url localhost:3000
Hasilnya akan nampak seperti berikut ini :
Jika kamu mendapati hasil seperti gambar di atas maka kamu sudah berhasil membuat project react pertama
Dorong Ke Repository Github
Pada kesempatan kali ini tentunya kamu sudah bisa mengguanakan repositori git dan menyimpan file-file kode kamu ke github dengan bantuan git. tapi sebelumnya konfigurasi dulu seperti berikut ini :
|
1 2 |
$ git config --global user.name "namausergithubkamu" $ git config --global user.email "emailkamu@example.com" |
pada root folder project reactjs kita, klik kanan kemudian pilih Git Base Here kemudian ketikkan perintah berikut :
|
1 2 3 4 5 |
$ git init $ git add . -f $ git commit -m "Step 1: Init react app" $ git remote add origin https://github.com/namaakun-github-kamu/namarepositorykamu.git $ git push -f origin master |
Kode diatas akan meng-upload file project kamu ke github sesuai dengan link diatas
Contoh situs yang menggunakan Reactjs
Baik, sekarang kita akan coba bahas, sebenarnya situs apa saja si yang sudah menggunakan teknologi reactjs?.. berikut saya paparkan contoh beebrapa situs yang mengguanakan teknolog reactjs di dalamnya :
- Yarn
- Traveloka
- Tiket.com
- Lazada
- Airbnb
- Instagram.com
- Worpress juga sebagian fiturnya telah menggunakan teknologi reactjs
dan tentunya masih banyak lagi website yang mengguanakan teklogi reactjs di dalamnya.
Jadi sudah saatnya kamu tidak perlu lagi ragu sekarang untuk melungkan waktu mendalami reactjs.
Ringkasan Tutorial
Harapan saya ketika kamu sudah membaca artikel ini kamu akan memahami tentang poin-poin di bawah ini :
- Mengetahui apa itu reactjs
- Untuk apa reactjs di buat
- Bagimana cara instalasinya
- Cara menjalankan reacjs pada browser
- Contoh situs yang menggunakan reactjs
Tutorial ReactJS Bagian2 : Membuat Tulisan Halo Dunia