Playing Dart #3 : Flutter Indonesia

Muhamad Alamsyah
Flutter Developer Indonesia
3 min readOct 21, 2019

Parsing JSON Form API Web Service

Asslamu’alaikum Wr. Wb.

Hallo sobat medium semangat pagi pada kesempatan kali ini saya akan update postingan melanjutkan tutorial Flutter minggu kemarin dan pada postingan kali ini saya akan membahas tentang Parsing JSON Form API Web Service, oke ayo kita mulai sebelmunya silahkan kalian catat alamat site ini terlebih dahulu untuk mendapatkan sample jsonnya https://jsonplaceholder.typicode.com/users,

setelah itu kita gunakan postman untuk mendapat request ya seperti gambar dibawah ini :

Lalu copykann semua hasil request json tadi dan taruh kita generate model POJO nya pada website ini https://app.quicktype.io/ seperti gambar dibawah ini dengan namannya yaitu Model User dan Language nya kita pilih Dart :

Lalu kita copy kan hasil generate tadi kemudian kita buat project baru pada android studio kita dengan dengan nama project bebas :

  1. Setelah itu kita buat package baru dengan nama modeldata dan ui_view dan 1 file baru dengan nama data didalam package modeldata dan didalam package ui_view kita buat 2 file baru dengan nama page_list.dart dan detail_page.dart maka kurang lebih seperti ini :

2. Kemudian kita tempelkan pada data.dart tersebut maka kurang lebih code nya akan seperti ini :

3. Kemudian kita pindah ke file main.dart lalu kita edit file tadi dengan mengetikan code berikut ini :

4. Kemudian kita pada file pubspec.yaml kita tambahkan package baru yaitu http pada bagian dependenciesnya seperti gambar dibawah ini :

5. Kemudian kita edit file page_list.dart dengan mengetikan source code berikut ini :

6. Kemudian pada detail_page.dart kita edit file nya dengan mengetikan code berikut ini :

Kemudian Coba kita run maka kurang lebih hasilnya seperti ini :

Kalian juga bisa mendapat source code full nya dengan mengunjungi github ku pada link dibawah ini

https://github.com/alamsyahh15/Flutter_ParsingJson

--

--