ReadLedger is a manga collection tracker designed for collectors who want more than just a list of volumes.
It helps you understand your collection through reading progress, spending analysis, and savings insights.
ReadLedger started from a simple personal need.
While building my One Piece collection, I wanted to answer questions like:
- How many volumes do I own?
- Which ones have I read?
- How much money have I spent in total?
- How much have I saved buying second-hand?
Existing tools didn't fully address this workflow, so ReadLedger was built as a focused solution for manga collectors.
- 📚 Collection management — Track owned volumes, reading progress, and condition
- 🔍 MangaDex integration — Search and import series metadata and cover art
- 💰 Spending analytics — Monitor total spending, savings, and average price per volume
- 📊 Statistics dashboard — Visual breakdowns by publisher, store, status, and condition
- 📋 Wishlist — Track volumes you want to buy with estimated cost
- ⚡ Bulk operations — Mark multiple volumes as owned or read at once
- 📥 CSV import/export — Back up or migrate your collection data
- 🎨 Dark/light theme — System-aware with manual toggle
- Framework: Next.js 16 (App Router, Server Components, Server Actions)
- UI: React 19 + Tailwind CSS 4
- Database: PostgreSQL via Supabase
- ORM: Prisma 7
- Auth: Supabase Auth (email/password) with SSR session management
- Validation: Zod 4
- Charts: Recharts
- Language: TypeScript
app/ # Next.js App Router pages and layouts
actions/ # Server actions (thin wrappers: auth → validate → service → revalidate)
services/ # Business logic layer (testable, framework-agnostic)
components/ # React components (UI primitives, forms, charts, modals)
lib/ # Shared utilities (auth, cache, errors, logger, validations, manga API)
hooks/ # Custom React hooks
utils/ # Pure utility functions (currency, date formatting)
__tests__/ # Vitest test suite
Key design decisions:
- Service layer separates business logic from Next.js concerns (auth, caching, revalidation)
- Custom error classes (
NotFoundError,UnauthorizedError,ValidationError) for consistent error handling - Structured JSON logging via
lib/logger.ts - In-memory TTL cache for MangaDex API responses
- Security headers (CSP, HSTS, X-Frame-Options) applied via
proxy.tsmiddleware - Rate limiting on mutation actions (30 requests/min per user)
👉 https://github.com/hugoogb/readledger
git clone https://github.com/hugoogb/readledger.git
cd readledgerpnpm installcp .env.example .envUpdate with your Supabase project URL, anon key, and database connection string.
pnpm db:migrate
pnpm db:generatepnpm devpnpm test # Watch mode
pnpm test:run # Single runReadLedger is designed to evolve into:
- A richer analytics platform for collectors
- Support for multiple series & formats
- Advanced statistics & visualizations
- Improved UX & performance
Feedback, ideas, and contributions are welcome. If you'd like to improve ReadLedger:
- Fork the repo
- Create a feature branch
- Open a pull request
MIT