Simple Invoice System

A simple system that allows viewing invoices.

The goal of this project is to build a system using Flutter as the frontend, Dart as the backend, MariaDB as the database, and GitLab as the CI/CD pipeline.

Screenshots

UI

Login

Invoice List

Invoice Detail

CI/CD

Pipeline Runs

Pipeline Run Detail

Pipeline Artifacts

Components

• Frontend: Flutter
• Backend: Dart + shell
• Database: MariaDB
• CI/CD: GitLab

Tables

Invoice

• invoice id
• company name
• company number
• date
• total

Invoice Line Item

• invoice line item id
• invoice id
• product
• price

User

• user id
• email
• password

Screens

• Login
• List Invoices
• Invoice Detail
• Create Invoice

API Endpoints

• Login
• List Invoices
• Invoice Detail
• Create Invoice
• Delete Invoice

Deployment Diagram

flowchart LR
    subgraph Docker [Docker]
    Frontend -- Call API --> Backend
    end

    Backend -- Connect --> MariaDB([MariaDB])

    subgraph GitLab [GitLab]
    TestFrontend[Test Frontend] --> BuildFrontend[Build Frontend]

    TestBackend[Test Backend] --> BuildBackend[Build Backend]
    end

    BuildFrontend -- Move image --> Frontend
    BuildBackend -- Move image --> Backend

Loading

Project Structure

backend
├── bin                  # Program entry point
├── dockerfiles          # Dockerfiles for building and testing
├── lib
│   ├── data             # Data models
│   ├── endpoints        # API endpoints
│   ├── middlewares      # Request handling middlewares
│   └── services         # External service abstractions
├── migrations           # Database migrations
├── scripts              # Utility scripts
└── test                 # Unit tests

database
└── scripts              # Database scripts

frontend
├── dockerfiles          # Dockerfiles for building and testing
├── lib
│   ├── data             # Data models
│   ├── screens          # Pages
│   └── services         # External service abstractions
├── scripts              # Utility scripts
├── test                 # Unit tests
└── web                  # Web files

gitlab                   # Code repository and CI/CD pipeline

Backend

flowchart LR
    server[bin/server.dart]
    api[lib/endpoints/api.dart]
    error_handler[lib/middlewares/error_handler.dart]
    database[lib/services/database.dart]
    base_response[lib/data/base_response.dart]
    json_exception[lib/data/json_exception.dart]
    auth_endpoint[lib/endpoints/auth.dart]
    invoice_endpoint[lib/endpoints/invoice.dart]
    auth_data[lib/data/auth.dart]
    invoice_data[lib/data/invoice.dart]

    server --> error_handler
    server --> api
    server --> database
    error_handler --> base_response
    error_handler --> json_exception
    api --> auth_endpoint
    api --> invoice_endpoint
    auth_endpoint --> database
    auth_endpoint --> auth_data
    invoice_endpoint --> database
    invoice_endpoint --> invoice_data

Loading

Frontend

flowchart LR
    main[lib/main.dart]
    router[lib/router.dart]
    login[lib/screens/login.dart]
    invoice_list[lib/screens/invoice_list.dart]
    invoice_detail[lib/screens/invoice_detail.dart]
    auth_service[lib/services/auth_service.dart]
    invoice_service[lib/services/invoice_service.dart]
    auth_data[lib/data/auth.dart]
    invoice_data[lib/data/invoice.dart]
    base_response[lib/data/base_response.dart]

    main --> router
    router --> login
    router --> invoice_list
    router --> invoice_detail
    login --> auth_data
    login --> auth_service
    invoice_list --> invoice_data
    invoice_list --> invoice_service
    invoice_detail --> invoice_data
    invoice_detail --> invoice_service
    auth_service --> auth_data
    invoice_service --> invoice_data
    auth_data --> base_response
    invoice_data --> base_response

Loading

Setup

See SETUP.md.