Pada kesempatan kali ini pada Tutorial ReactJS Bahasa Indonesia series, Konsep Koding akan berbagi tutorial mengenai bagaimana caranya Fetch API atau Consume API dengan ReactJS lengkap, nah pada tutorial ReactJS ini kita akan mempelajari mengenai bagaimana caranya GET API dan menampilkannya menggunakan API Github dan Menangani proses loading ketika data di get/diambil serta menangani handling error pada ReactJS. Jadi handling error disini maksudnya apabila ketika user/web app React yang kita buat mengalami kegagalan, seperti tidak ada koneksi internet, server down dan sebagainya hal itu perlu di tangani.
Apa Yang Akan Kita Pelajari?
1. Get API Fetch
2. Handling Ketika Data Diambil
3. Menangani Jika Terjadi Error
Pertama silahkan buat project baru Reactjs jika anda belum memilikinya, jika anda sudah memiliki project React JS silahkan buka Text Editor kesayangan anda dan ubah file App.js, menjadi seperti kode React di bawah ini :
Setelah itu jalankan project anda
npm run start
Maka hasilnya akan seperti di bawah ini :
Kesimpulan
Jadi ketika data sedang di ambil maka yang akan ditampilan adalah UI/Text loading dan ketika data berhasil maka JSON API nya akan di tampilkan dan jika terjadi error maka akan ditampilkan UI Error. Silahkan di kembangkan dan di imrpve untuk Learn Project atau Bahkan Real Project anda semoga dpat bermanfaat dan membantu teman-teman sekalian. Terimakasih. Keep Coding And Always Sharing.
Baca Juga Tutorial ReactJS lainnya :
0 Comments