KerahBiru Flutter Prototype

A Linkedin-like app.

Features:

• state management
• fake api
• form
• animations : Hero, container transformation, axis transition

Demo:

Architecture guideline

Convention and Pattern

• use Provided for state management. Guides:
  • Change Notifier + Provider Example.
  • Simple State Management
• model convention :
  • the model
  • entity : model used by repository
  • state : model used by view to store and manage state. State extends (ChangeNotifier)[https://flutter.dev/docs/development/data-and-backend/state-mgmt/simple] and broadcasts updates with notifyListeners
• page transitions
  • reserve MaterialPageRoute for main pages (pages listed on AppDrawer)
  • from main page to sub-pages, listview item click, fab, etc, use canned-animation package

Approach to REST

• semi-optimistic approach A
  • consider two pages: main, ephemeral
  • main pages fetch data from repo, stores it in local.
  • ephemeral pages use local data. any rest interaction here is assumed successful and modifies local data.
  • in main page, do reload to refetch data from API
  • requires back intercept positioning

  Profile -> sends a copy of experience list to -> Edit Profile -> opens a -> New Profile

  new Profile -> sends an REST patch, adds an item of list in -> Edit Profile Screen -> triggers reload in -> Profile

• semi-optimistic approach B
  • upload object with pending id
  • object is assumed live in app
  • on API callback, remove or preserve
• date in repo is stored as second, currently working date is stored as Integer.MAX
• reload page depending on new updates
  • updating state object in State (ChangeNotifier) triggers any Selector that monitors it
  • use WillPopScope to intercept device's back button
• pages that depend on same inheritance object should be generalized (see CommonItem)

Notes

• stateful widget : widget that changes on UI state, read this
  • setState will trigger rebuild on any widget that holds reference to the data.
  • parent-child relations : parent cannot call child but triggers change due to child using parent (widget.) read

Todo

• theme
• locale
• global keys
• global formats (date, currency, etc)
• onboarding user registration with stepper
• complete prototype of approach A (Experience item)
  • complete ir for the rest of the items
• reload if new updates
• page animation proto (profile -> edit)
• page animation (edit -> new)
• page animation (edit -> form)
• refactor edit returned models
• refactor extract views
• date picker for exp end date
  • has upper limit(a month before now) and lower limit
  • "currently working" checkbox will disable End Date and its date picker
  • validates start date < end date
• splash screen