Keyboard shortcuts

Press or to navigate between chapters

Press S or / to search in the book

Press ? to show this help

Press Esc to hide this help

Mobile Application Development with Flutter

Flutter Personal Finance Tracker Course Outline

Lab 1: Introduction to Flutter

  • Set up Flutter development environment
  • Create the initial app with AppBar and basic scaffold
  • Introduce "Hello World" and hot reload concepts
  • Project component: App shell with title "My Finance Tracker"

Lab 2: Widgets and Layout

  • Understand the basics layout widgets (Padding, Container, Column, Row, etc.)
  • Design the dashboard layout with cards for summary info
  • Implement balance overview section with static data
  • Project component: Main dashboard with balance, income/expense cards

Lab 3: Lists and UI Components

  • Create transaction list with ListTile widgets
  • Add transaction item UI with amount, date, category
  • Implement custom transaction card design
  • Project component: Scrollable transaction history list

Lab 4: State Management

  • Implement adding/removing transactions
  • Create transaction model class
  • Use setState for UI updates after transactions change
  • Project component: Working "Add Transaction" button with state updates

Lab 5: Forms and Input

  • Build transaction entry form with validation
  • Add category selection dropdown
  • Implement date picker integration
  • Project component: Complete transaction entry form with validation

Lab 6: Navigation

  • Create transaction detail screen
  • Implement bottom navigation bar for different views
  • Add settings/profile screen
  • Project component: Multi-screen navigation structure

Lab 7: Local Storage

  • Design SQLite database schema for transactions
  • Implement CRUD operations for transactions
  • Add persistent storage for user preferences
  • Project component: Full local data persistence

Lab 8: RESTful APIs

  • Integrate currency conversion API (https://frankfurter.dev/)
  • Implement loading indicators and error handling
  • Project component: Currency conversion feature

Lab 9: Firebase Integration

  • Add user authentication
  • Implement cloud backup of transactions
  • Create data synchronization between devices
  • Project component: User account system with cloud sync

Lab 10: Polish and Deployment

  • Implement theming and dark mode
  • Add app icons and splash screens
  • Optimize performance and run tests
  • Project component: Production-ready app with deployment preparation