Description

Pendahuluan

Pertama-tama untuk memulai sebuah project ReactJS kita perlu menjalankan perintah:

Lalu, untuk memulai aplikasi React dapat dilakukan dengan menggunakan perintah:

Fetch API

Pada class App, didefinisikan sebuah state dengan nama "players" yang diberin nilai Array[ ] yang nantinya akan menyimpan value dari nama-nama NBA Players.

URL dari API akan di-set pada componentDidMount. async componentDidMount bekerja setiap fungsi atau perintah yang di tuliskan pada method atau function tersebut dijalankan setelah Component telah selesai melakukan render DOM. 

Dalam metode render(), kita dapat membaca props dan state serta mengembalikan kode JSX ke komponen root dari aplikasi kita. Pada metode render ini terdapat variabel bernama mappedArray, variabel ini adalah variabel yang menyimpan pemetaan pemain dan key valuenya (first_name, last_name, position). Fungsi map() digunakan untuk mengulangi array dan memanipulasi atau mengubah item data. Di React, fungsi map() paling sering digunakan untuk merender daftar data ke DOM. Untuk menggunakan fungsi map(), biasanya dilampirkan ke sebuah array.

Metode return ini yang akan menampilkan tampilan dari web. Berikut hasil dari tampilan Frontend Web sederhana hasil dari Fetching data NBA API: