Flutter Under the UI

Flutter app fejlesztőként a UI feladatok mellett foglalkoznunk kell alkalmazás állapot kezeléssel, dependency injectionnel, hálózati hívások összeállításával, stb., mint minden más alkalmazás fejlesztési domainben. Ez az előadás bemutat néhány Flutter architektúrát és package-et, amiket a Flutter közösség előszeretettel alkalmaz és amikkel hosszú távon készíthetünk karbantartható alkalmazásokat.
Az előadás a 2022. májusi HWSW free! online meetupon hangzott el magyarul.
https://rendezveny.hwsw.hu/free/74/flutter-mobil-web-fejlesztes-meetup

As Flutter app developers, we should take care of much more than UI tasks while developing applications for supported platforms. UI and app state handling, dependency injection, networking, and so on are all on the menu, just as in any other app development domain. This talk highlights some frequently used architectures and packages preferred by the Flutter community itself.
Presented at the May 2022 installment of the HWSW free! meetup series (online) in Hungarian.
https://rendezveny.hwsw.hu/free/74/flutter-mobil-web-fejlesztes-meetup

Transcript

1. View Slide

2. HWSW meetup – @stewemetal
   Flutter 3 apps run on...
   https://docs.flutter.dev/development/
   tools/sdk/release-notes/supported-platforms
   

   View Slide

3. HWSW meetup – @stewemetal
   One codebase to implement...
   • UI
   • State handling
   • Network communication
   • Persistent data storage
   • Accessibility
   • Testing
   • Etc.
   

   View Slide

4. HWSW meetup – @stewemetal
   One codebase to implement...
   ...the same app for multiple platforms!
   

   View Slide

5. HWSW meetup – @stewemetal
   UI
   

   View Slide

6. HWSW meetup – @stewemetal
   UI
   Flutter apps are not just
   

   View Slide

7. HWSW meetup – @stewemetal
   Preferences Database Network APIs
   DiskDataSources NetworkDataSources
   Use-cases
   App state handling
   UI
   

   View Slide

8. HWSW meetup – @stewemetal
   Flutter app architectures
   App state handling
   

   View Slide

9. HWSW meetup – @stewemetal
   Flutter app architectures
   BLoC
   MobX
   Redux
   

   View Slide

10. HWSW meetup – @stewemetal
    BLoC
    UI BLoC Use-cases
    States
    Events Async queries
    Async responses
    https://pub.dev/packages/flutter_bloc/
    

    View Slide

11. HWSW meetup – @stewemetal
    Flutter app architectures
    BLoC
    MobX
    Redux
    

    View Slide

12. HWSW meetup – @stewemetal
    MobX
    https://mobx.js.org/
    https://pub.dev/packages/mobx
    

    View Slide

13. HWSW meetup – @stewemetal
    Flutter app architectures
    BLoC
    MobX
    Redux
    

    View Slide

14. HWSW meetup – @stewemetal
    Redux
    https://pub.dev/packages/redux
    https://pub.dev/packages/flutter_redux
    https://redux.js.org/
    

    View Slide

15. HWSW meetup – @stewemetal
    Flutter app architectures
    BLoC
    MobX
    Redux
    

    View Slide

16. HWSW meetup – @stewemetal
    Preferences Database Network APIs
    DiskDataSources NetworkDataSources
    Use-cases
    App state handling
    UI
    

    View Slide

17. HWSW meetup – @stewemetal
    Database handling
    JSON serialization
    Dependency injection
    Network calls
    Packages for lower layers
    HWSW meetup – @stewemetal
    

    View Slide

18. HWSW meetup – @stewemetal
    Database handling
    JSON serialization
    Network calls
    http
    Dio + Retrofit
    Chopper
    Packages for lower layers
    HWSW meetup – @stewemetal
    

    View Slide

19. HWSW meetup – @stewemetal
    Network calls
    Database handling
    JSON serialization
    Dependency injection
    sqflite
    moor
    sembast
    Packages for lower layers
    HWSW meetup – @stewemetal
    

    View Slide

20. HWSW meetup – @stewemetal
    Network calls
    Database handling
    JSON serialization
    Dependency injection
    json_serializable
    json_annotation
    dart:convert
    Packages for lower layers
    HWSW meetup – @stewemetal
    

    View Slide

21. HWSW meetup – @stewemetal
    JSON serialization
    Dependency injection
    Provider
    GetIt
    Modular
    Packages for lower layers
    HWSW meetup – @stewemetal
    

    View Slide

22. HWSW meetup – @stewemetal
    Preferences Database Network APIs
    DiskDataSources NetworkDataSources
    Use-cases
    App state handling
    UI
    

    View Slide

23. HWSW meetup – @stewemetal
    docs.flutter.dev/get-started/codelab
    docs.flutter.dev/get-started/codelab-web
    pub.dev/packages/flutter_bloc
    pub.dev/packages/mobx
    pub.dev/packages/flutter_redux
    Resources
    

    View Slide

24. HWSW meetup – @stewemetal
    stewemetal
    Flutter App Architectures
    István Juhos
    Flutter apps are not just about UI
    Concepts from supported platforms
    made it into Flutter
    More and more packages support all
    available target platforms
    

    View Slide