Tutorial Flutter Dependency Injection Menggunakan Package Get_It

Tutorial Flutter Dependency Injection Menggunakan Package Get_It

 
 
Halo semuanya! Pada tutorial kali ini kita akan membahas mengenai dependency injection pada Flutter. Di sini kita akan menggunakan package get_it. Kalian dapat melihatnya di sini. Selain itu, kita juga akan menggunakan package http. Kalian dapat melihatnya di sini.

Jadi, apa itu dependency injection? In software engineering, dependency injection is a technique in which an object receives other objects that it depends on, called dependencies (Wikipedia).
 
Err ... Maksudnya gimana tuh? Jadi, mudahnya, dependency injection adalah sebuah teknik di mana sebuah objek menerima objek lain yang dibutuhkannya, disebut ketergantungan.

Sulit dimengerti? Silakan lihat contoh di bawah ini.



 
Bisa dilihat melalui contoh di atas. Di mana kita menciptakan kelas Client, memanggilnya pada Api, lalu memanggil kelas Api tersebut di HomeScreen. Pemanggilan ini dilakukan melalui constructor.

Lalu, apa masalahnya? Masalahnya adalah pemanggilan dependency ini akan menyebabkan nested. Secara terpaksa kita harus menggunakan kelas-kelas tertentu pada constructor hanya agar kita bisa memanggil dan menggunakannya.

Bukankah lebih baik jika kita dapat memanggil dan menggunakan services/fungsi tertentu tanpa harus bergantung kepada constructor? Nah, di situlah kegunaan get_it.
 
Baik, di sini kita akan membuat sebuah aplikasi sederhana menggunakan Flutter, di mana kita dapat melihat sekumpulan users.

Di sini kita akan menggunakan data dari jsonplaceholder. Kita akan menampilkan semua users menggunakan listview. Oke langsung saja, silakan buat folder dan file menjadi seperti di bawah ini.

Struktur Folder dan File

Pertama, kita akan membuat model. Sebetulnya, ada cara cepat untuk membuat model di Flutter. Silakan buka JSON to Dart. Website ini dapat melakukan konversi dari json menjadi class dengan mudah.

Copy data dari jsonplaceholder ke website di atas, lalu akan tercipta seperti ini.



Selanjutnya kita akan membuat users repository dan users controller. Repository berguna untuk berhadapan dengan API secara langsung, sedangkan controller untuk mendapatkan resultnya secara bersih. Secara teknis, seperti itu struktur projek kita pada aplikasi ini. Jika kalian memiliki ide lain, silakan saja.
 
 
Users controller.


Sekarang, kita fokus ke locator.dart dan main.dart.



Jadi, apa saja yang sudah kita lakukan? Kita baru saja membuat instance GetIt dengan nama locator, kemudian kita daftarkan apa saja services yang kita gunakan, lalu kemudian kita panggil locator tersebut di main.dart. Mudah kan?

Sekarang, buka home_view dan buat menjadi seperti ini.


Apa yang kita lakukan pada code di atas? Kita akan melakukan request untuk mendapatkan users dan menampilkan users tersebut menggunakan listview. Tidak lupa, selama proses request terjadi, kita tampilkan loading.

Sebelum melihat hasil akhirnya, coba buka users controller. Bisa dilihat, di situ kita tidak memanggil users repository dengan menggunakan constrctor, tetapi kita dapat langsung menggunakannya dengan menggunakan locator.

Hal yang sama juga terjadi di home view pada bagian did change dependencies. Kita dapat langsung memanggil users controller tanpa harus menggunakan constructor. Sehingga perkara nested tidak terjadi.

Oke, langsung saja kita lihat hasil akhirnya. Jika program dijalankan, maka akan tampil seperti ini.

Hasil


Memang terlihat biasa saja. Namun sebenarnya ini konsep yang penting untuk dipelajari. Apalagi pada Flutter.

Kita tahu Flutter menggunakan nested widget, sehingga ketergantungan atau dependencies akan terjadi dengan sangat mudah. Maka, keberadaan Get_It ini menjadi semakin relevan.

Sekian tutorial kali ini, semoga bermanfaat.

Post a Comment

0 Comments