Mina Finansial

Speed Code Aplikasi Dev Test - Study Case: Mina Finansial + CRUD

• PWA Version: View Demo
• PWA Repository: View Repository

Results and Demo in Flutter (1 Day Development)

Demo (.GIF)	Home Screen	Add Tranasctions

Result in PWA Version (built directly using Flutter)

Notes

Pada Apps sederhana kali ini, Layer Repository tidak digunakan untuk mempercepat proses development, terlebih apps ini hanya memiliki akses ke local storage saja dan tidak membutuhkan interface ke Backend (Server).

Getting Started

Project ini dibuat menggunakan Flutter+Dart dengan BLOC Pattern untuk State Management dan Reactive Approach.

IDE Recommendation

Untuk mempermudah proses development dan cocok untuk spesifikasi hardware development yang minim, disarankan menggunakan Visual Code.

VSCODE Extension

Beberapa extensi yang wajib dan optional untuk Flutter Development.

Required:

• dart-code.dart-code
• dart-code.flutter
• felixangelov.bloc
• jeroen-meijer.pubspec-assist
• luanpotter.dart-import

Optional:

• nash.awesome-flutter-snippets
• coenraads.bracket-pair-colorizer-2
• wmaurer.change-case
• circlecodesolution.ccs-flutter-color
• gruntfuggly.todo-tree
• shan.code-settings-sync

Supporting Tools

• Convert Json to Dart Classes https://javiercbk.github.io/json_to_dart/

BLOC Pattern

BLOC Pattern terdiri diri 4 layer utama dan flow yang terintegrasi:

Layer 1 : User Interface

Pada layer ini, berisi semua Additional Widget dan User Interface Widget yang dapat dilihat oleh User. Pada layer ini juga terjadi interaksi terhadap User

Layer 2 : BLOC, Cubit | Presenter

Semua Business Logic berada pada Layer ini. Perlu diperhatikan bahwa layer ini tidak boleh mengkonsumsi UI, karena justru layer ini yang akan dikonsumsi oleh UI.

• BLOC: Digunakan untuk Logic yang Kompleks dan ingin mengelola Event yang dikirimkan untuk melakukan sebuah proses
• Cubit: Digunakan untuk Logic yang sederhana, Cubit tidak membutuhkan event.

Layer 3 : Domain | Data Handler

Pengelolaan Data yang didapatkan dari Data Provider. Layer ini digunakan untuk membantu pengelolaan data antara server dan local storage

Layer 4 : Dao, Repository | Data Provider

Layer ini akan melakukan request dan terhubung ke Backend.

• Dao: Data Access Object. Bertugas untuk mengelola data pada local storage. Contoh: Sqlite atau Hive (NoSql).
• Repository: Helper untuk melakukan request ke Network / Restful API

Project Architecture

... Continue

Layer Pattern for Test

3 Tahapan untuk Pengujian:

• Widget Test: Pengujian terhadap Widget dan User interface. Pengujian ini memungkinkan developer untuk mengotomatisasi proses pengujian terhadap User Interface

• Integration Testing: Pengujian antara business logic dan data handler

• Unit Testing: Pengujian untuk setiap fungsi yang ada pada Data Provider