Skip to content
Dio Stania Adinata, home
Back to projects

Full-Stack & AI Systems · /book-it-quick

Book-it-quick

Personal Bookkeeping Web App with Exact Decimal Money Handling

Role:
Full-Stack Developer
Team:
SDUST exchange program: 10-day software production module

A personal bookkeeping web application built during a 10-day software production module at Shandong University of Science and Technology (SDUST), using Spring Boot, MyBatis, Vue 3, Element Plus, MySQL, and ECharts.

Book-it-quick

Overview

Book-it-quick is a personal bookkeeping (income and expense) web application built during a 10-day software production module of my Software Engineering exchange semester at Shandong University of Science and Technology (SDUST), China. A Spring Boot and MyBatis backend stores every monetary amount as BigDecimal in Java and DECIMAL(15,2) in MySQL, so totals never accumulate floating-point drift. The Vue 3 and Element Plus frontend adds recurring bills, multi-currency conversion, savings goals, ECharts dashboards, and JWT-based authentication.

Problem

Simple bookkeeping apps often store money as floating-point numbers, support only one currency, and handle sessions loosely. The challenge was building a complete bookkeeping app from scratch in 10 working days with exact decimal money handling, token-based authentication, and scheduled background jobs.

Solution

Decimal Money Handling: BigDecimal in Java and DECIMAL(15,2) columns in MySQL for every monetary amount (exchange rates use DECIMAL(20,8)), avoiding floating-point drift. Authentication: Stateless JWT authentication with rotating SHA-256-hashed refresh tokens, a token denylist, login rate limiting, and USER / ADMIN roles. Scheduled Jobs: Spring @Scheduled tasks for daily exchange-rate sync, recurring monthly bill generation, recycle-bin pruning, and token cleanup. Dashboard & i18n: Vue 3 + Element Plus UI with Apache ECharts charts, persistent dark mode, and runtime switching across 5 languages (English, Indonesian, Japanese, Simplified Chinese, Traditional Chinese).

Architecture & Core Systems

Layered Backend Architecture: Strict separation across Security Filters -> Controllers -> Services -> MyBatis Mappers -> MySQL with idempotent migration scripts. Multi-Currency Pipeline: Automated daily cron syncing live exchange rates via external API, dynamically recalculating dashboard totals across currencies. Soft-Delete & Audit Pattern: Non-destructive deletion flags with user-facing Recycle Bin recovery and automated retention cleanup.

Technical Implementation

Security Layer: BCrypt password hashing, HS256 JWT with role claims, refresh-token rotation chained via replaced_by, and denylist middleware. Query Indexing: a composite index on (user_id, bill_date) for paginated transaction queries. Data Visualization: category distribution pie charts and 7-day cash-flow trends with Apache ECharts.

Challenges

Keeping amounts exact across API serialization, database queries, and client-side aggregation. Building the API, authentication, database schema, background jobs, and frontend within the 10-day module.

Results

Completed within the 10-day module at SDUST. Open-source on GitHub with architecture documentation.

Lessons Learned

Money should be stored and calculated as decimals (BigDecimal / DECIMAL), never float or double. Patterns such as layered REST services, stateless authentication, and scheduled jobs carry over between game and web projects.

Screenshots & Preview

Visual assets and captures from Book-it-quick. Click any image to open the full-resolution preview.