Tutorial React Native Hooks : Get API Axios

Di tutorial sebelumnya kita telah mempelajari mengenai fundamental dan lifecycle React Native Hooks dan di tutorial-tutorial Konsep Koding yang sebelumnya kita juga telah mempelajari bagaiamana cara Get API menggunakan Axios di Class Component, nah pada tutorial kali ini kita akan belajar bersama bagaiaman cara Get Data API di React Native Hooks, dan mencoba untuk mengimplimentasi Hooks state.

Tutorial React Native Hooks : Get API Axios

Apa Yang Akan Kita Pelajari?

1. Menggunakan Lifecycle Hooks

2. Basic Component

3. Get API dan Menampilkannya

Memulai Project

Silahkan buat sebuah project baru npx react-native init hook_api

Kemudian cd hook_api

Setelah itu silahkan install library Axios sebagai http request di project kamu

npm i axios 

Setelah itu kita akan menggunakan enpoint API online jsonPlaceholder

https://jsonplaceholder.typicode.com/todos/2

Untuk result json nya seperti gambar di bawah ini :

Kemudian ubah kode App.js menjadi seperti kode di bawah ini:

Setelah itu silahkan run project anda dengan perintah

npx react-native run-android atau npx react-native run-ios

Jika anda berhasil maka kode React Native Hooks yang anda tulis akan seperti gambar pada di bawah ini :

Tutorial React Native Hooks : Get API Axios

Sekian semoga tutorial dari Konsep Koding dapat bermanfaat dan membantu kamu yang sedang mempelajari React Native, khususnya React Native menggunakan Hooks. Karena hooks sekarang sudah stable dan banyak library yang support dan yang paling penting Hooks lebih simple kode nya dan lebih mudah di baca oleh manusia dan mesin.

Baca Tutorial Lainnya:

#1 Pengenelan React Native Dan Cara Instalasinya Lengkap

#2 Tutorial React Native State Dan Props Serta Penjelasannya

#3 Tutorial Menampilkan Gambar React Native Yang Baik & Benar

#4 Tutorial React Native Alert, Beserta Jenis-Jenisnya Lengkap

#5 Tutorial ClickListener Pada React Native Serta Penggunaannya

#6 Tutorial React Native: Text Italic, Bold, Underline dan Styling

#7 Tutorial Membuat Custom TextArea Pada React Native

#8 Tutorial React Native Mengubah Warna Pada Placeholder
#9 Tutorial React Native : Advanced Webview Dengan Loader

#10 Tutorial Open Link Url Website Di React Native

#11 Tutorial React Native WhatsApp Direct Send Link

#12 Tutorial React Native Modal Dengan Desain Gambar

#13 Tutorial React Native : React Navigation 5 Untuk Navigasi

#14 Tutorial React Native : Mengirim Data Pada React Navigation

#15 Tutorial React Native Top TabView Gesture Lengkap

#16 Tutorial React Native : Animation JSON Lottie

#17 Tutorial Dan Penjelasan Lifecycle Pada Classes React Native

#18 Tutorial Get API React Native Yang Baik Dengan Axios

#19 Tutorial Get Detail Data React Native Axios Github API

#20 Tutorial Date Time React Native Membuat Aplikasi Stopwatch

#21 Tutorial React Native State Management Redux Lengkap

#22 Tutorial React Native : Redux Thunk Get API

#23 Tutorial In-App Browser Modern Dengan React Native

#24 Tutorial React Native AsyncStorage React Native Lengkap
#25 Tutorial Push Notification Firebase Cloud Messaging React Native V6
#26 Tutorial React Native : Pengenalan React Native Hooks Dan Lifecycle