Giter VIP home page Giter VIP logo

faiyyazs / flutter_registration_form Goto Github PK

View Code? Open in Web Editor NEW
9.0 1.0 2.0 412 KB

A simple Flutter Registration Form Application to demonstrate the usage for MVVM design pattern using ChangeNotifiers, RxDart, Providers (Dependency Injection),Retrofit-Dio along with Test Cases & isolation of UI, business logic and data sources.

Kotlin 0.13% Swift 0.43% Objective-C 0.04% Dart 98.17% HTML 1.22%
mvvm flutter flutter-examples clean-architecture clean-code dependency-injection providers provider-architecture testcases mokito

flutter_registration_form's Introduction

Flutter Registration Form

About App

A simple Flutter Registration Form Application to demonstrate the usage for MVVM design pattern using ChangeNotifiers, RxDart, Providers (Dependency Injection),Retrofit-Dio along with Test Cases & isolation of UI, business logic and data sources.

The application demonstrates the best practices which can be adopted in flutter application development to avoid code maintaince issues overtime.

Components Used

  • MVVM Architecture - Robust, testable, and maintainable app with classes for managing your UI component lifecycle and handling data persistence.
  • Isolating of UI, business logic and data sources responsibilities creating a Testable system
  • Provider - A pragmatic lightweight dependency injection framework [MultiProvider] for flutter which also is helpful in State Management.
  • ChangeNotifier - a simple class included in the Flutter SDK which provides change notification to its listeners
  • RxDart - Build data objects that notify views when the underlying data changes.
  • Mockito - An Flutter testing framework for unit and runtime UI tests.
  • Internationalizing - Flutter provides widgets and classes that help with internationalization and the Flutter libraries themselves are internationalized.
  • Retrofit-Dio - Retrofit.dart is an dio client generator using source_gen and inspired by Chopper and Retrofit.

Screenshots

drawingdrawingdrawingdrawing

Data Flow

Let’s start explaining Data Flow in Clean Architecture as follows,

  1. UI calls method from ViewModel.
  2. ViewModel executes Use case.
  3. Use case combines data from Multiple Repositories.
  4. Each Repository returns data from a Data Source (Cached or Remote). [ In current scope only Remote ]
  5. Information flows back to the UI where we display the list of requested information.

Architecture

In the Architecture adopted, relationship that exists between the different layers is very crucial.

Different layers & their boundaries are explained below,

Presentation/App Layer contains UI (Views)_ that are coordinated by ViewModels which execute one or more Use cases._ Presentation layer depends on Domain Layer.

Domain Layer It contains Entities, Use cases & Repository Interfaces. Use cases combine data from one or more Repository Interfaces.

Data Layer contains Repository Implementations and one or more Data Sources. Repositories are responsible to coordinate data from the different Data Sources. Data Layer depends on Domain Layer.

The Architecture helps Isolates UI, business logic and data sources' responsibilities creating a Testable system.

Other components include,

Providers which are used for state management adopting Producer & Consumer design patterns.

ProxyProviders are useful to create dependent providers helping to achieve constructor dependency injection.

Mockito used to mock dependencies which are useful to during test cases.

Support

Support

If you've found an error in this sample, please file an issue: https://github.com/faiyyazs/flutter_registration_form/issues

Patches are encouraged, and may be submitted by forking this project and submitting a pull request through GitHub.

flutter_registration_form's People

Contributors

faiyyazs avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

Forkers

naikdp7 kenlock

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.