Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Dicoding Developer Coaching #55: Flutter | Kelola State Aplikasi dengan Pendekatan State Management

Dicoding Developer Coaching #55: Flutter | Kelola State Aplikasi dengan Pendekatan State Management

sesuai dengan kondisi aplikasi saat ini. Hal ini berbeda jika menggunakan framework Android atau iOS UIKit yang bersifat imperatif. Lalu bagaimana kita dapat merubah tampilan aplikasi jika framework bersifat deklaratif?

Kita dapat memanfaatkan State Management untuk mengelola state agar lebih mudah dalam mengembangkan aplikasi. Perubahan state dapat mengubah tampilan aplikasi. Dengan begitu, tampilan aplikasi akan lebih fleksibel menyesuaikan state saat ini. Untuk lebih lengkapnya akan dibahas pada Developer Coaching dengan poin pembahasan seperti berikut:

- Declarative UI
- Pengenalan State
- Pendekatan State Management
- Penerapan State Management

Dicoding Indonesia

July 27, 2022
Tweet

More Decks by Dicoding Indonesia

Other Decks in Education

Transcript

  1. Kelola State Aplikasi dengan Pendekatan State Management Dicoding Developer Coaching

    #55 Achmad Ilham Curriculum Developer Dicoding
  2. None
  3. Imperative vs Declarative UI Pada Imperative UI, kita bisa langsung

    mengubah tampilan berdasarkan id atau identifier lain. // Imperative style b.setColor(red) b.clearChildren () ViewC c3 = new ViewC(...) b.add(c3)
  4. Imperative vs Declarative UI Sementara pada UI deklaratif, UI akan

    dibangun ulang berdasarkan state saat itu. // Declarative style return ViewB( color: red, child: ViewC(...), )
  5. Declarative UI f(x)=2x+1 f(4)= ? f(0)= ? f(-5)= ? f(4)=

    9 f(0)= 1 f(-5)= -9 • Initial • Loading • Loaded • Error
  6. None
  7. State Ephemeral state App state • Index Tab pada TabBar

    atau BottomNavigationBar. • Nilai boolean pada Switch. • Nilai progres pada animasi. • Informasi User saat Login. • Preferensi tema. • Fitur cart pada aplikasi e-commerce.
  8. State Management • setState • Provider • InheritedWidget & InheritedModel

    • Riverpod • BLoC • ...
  9. State Management • setState • Provider • InheritedWidget & InheritedModel

    • Riverpod • BLoC • ...
  10. setState • State Management sederhana. • Bawaan Flutter SDK. •

    Cocok digunakan untuk ephemeral state.
  11. setState

  12. Let’s Code

  13. Provider • Menggunakan package provider. • Salah satu package yang

    direkomendasikan oleh tim Flutter.
  14. Provider

  15. Let’s Code

  16. Dicoding Dicoding Dicoding Dicoding Indonesia Contact us : Contact me

    : ilham@dicoding.com