Atlas — App Quản Lý Cuộc Sống Cá Nhân
App cá nhân mình tự làm để quản lý tài chính và công việc freelance. Thiết kế theo module, bắt đầu với Tài chính và Công việc, các module khác sẽ thêm dần.
- Năm
- 2026
- Bộ công nghệ
- 14 công nghệ
Phạm vi & vai trò của mình
Fullstack Developer (Solo / End-to-End)
Phạm vi sản phẩm
Module Tài chính: giao dịch, danh mục, ngân sách, khoản định kỳ chờ xác nhận, nợ và tài sản, thẻ chi cố định, lọc và tìm kiếm.
Thẻ tín dụng và ví trả sau: trả thẻ, đối chiếu dư nợ với ngân hàng, nhắc hạn trả.
Màn Tổng quan với các biểu đồ thu chi, cơ cấu theo danh mục và số dư cộng dồn.
Module Công việc: danh sách dự án dạng bảng có lọc, sắp xếp, ẩn cột; khách hàng; đợt thanh toán; thông tin truy cập có PIN; đợt feedback kèm checklist; hỏi đáp với khách.
Đăng nhập Google, sao lưu và khôi phục dữ liệu bằng file JSON.
Công nghệ
- React
- Hono
- PostgreSQL
- Drizzle ORM
- TanStack Query
- Playwright
- Vite
- TypeScript
- Tailwind CSS
- TanStack Table
- React Router
- Zod
- Vitest
- pnpm
Cách mình giải quyết
Bài toán cần giải quyết
Mình muốn một app duy nhất để quản lý thu chi, ngân sách, nợ thẻ và các dự án freelance, làm đúng theo nhu cầu của riêng mình. Đặc tả ban đầu có 9 module, nên kiến trúc phải cho phép thêm từng module một mà không phải làm lại phần đã có. Vì là dữ liệu tài chính cá nhân, số tiền phải luôn đúng và dữ liệu nhạy cảm phải được mã hoá.
Quyết định kỹ thuật
Mỗi module là một thư mục riêng trong features, thêm module mới chỉ cần thêm route và một mục trong danh sách module.
Bộ chuyển module là dropdown thay vì hàng nút, để vẫn gọn khi số module tăng lên.
Màu và cỡ chữ khai báo bằng design token đặt tên theo vai trò (thu, chi) thay vì theo màu.
Bảng màu biểu đồ chọn để người mù màu vẫn phân biệt được các nhóm.
Danh mục không xoá mà chỉ ẩn, để giao dịch cũ vẫn trỏ đúng.
Bài toán phức tạp
Số dư cộng dồn phải tính cả nợ thẻ tới hết tháng đang xem, và được tính ra mỗi lần thay vì lưu sẵn để không bị lệch.
Đối chiếu thẻ với sao kê ngân hàng: chênh nhỏ thì bỏ qua, chênh lớn thì liệt kê giao dịch thẻ và cho ghi phần lệch là phí hoặc hoàn tiền.
Kết quả đạt được
Một web app và hệ thống phía sau dùng chung một bộ quy tắc kiểm tra dữ liệu. Phần Tài chính đã dùng hằng ngày: giao dịch, danh mục, ngân sách, khoản định kỳ, nợ và tài sản, biểu đồ, giao dịch ngoại tệ, thẻ tín dụng kèm đối chiếu với ngân hàng, sao lưu dữ liệu. Phần Công việc đang làm: dự án, khách hàng, đợt thanh toán, thông tin truy cập được mã hoá, đợt feedback và hỏi đáp với khách.
Điểm nổi bật
Schema Zod trong một package dùng chung: sửa một chỗ, cả web lẫn API báo lỗi nếu lệch.
Tiền lưu dạng số nguyên đồng, luôn dương, chiều tiền nằm ở loại giao dịch. Ngày giao dịch lưu dạng ngày trên lịch để không lệch khi đổi múi giờ.
Giao dịch ngoại tệ quy đổi theo tỷ giá của ngày phát sinh.
Test e2e bằng Playwright cho các luồng ghi tiền, chạy với một tài khoản test riêng nên không đụng dữ liệu thật.
Kết nối với mình
Cảm ơn bạn đã ghé thăm góc nhỏ của mình. Rất mong chúng ta sẽ có dịp trò chuyện và hợp tác!
Mình luôn cởi mở với những cuộc trò chuyện về phát triển sản phẩm, ứng dụng AI hay các ý tưởng khởi nghiệp. Cứ thoải mái ném thẳng một tin nhắn cho mình nhé!
Nhận hợp tác chọn lọc · trả lời trong ngày