Dwitku

Dwitku adalah aplikasi web yang dirancang untuk membantu pengguna mencatat, memantau, dan menganalisis keuangan pribadi maupun bisnis secara efisien. Sistem ini mendukung konsep workspace sehingga pengguna dapat mengelola beberapa ruang keuangan, baik secara personal maupun kolaboratif bersama anggota lain.

Fitur Utama

• Pencatatan pemasukan dan pengeluaran berdasarkan kategori

• Dashboard ringkasan saldo, total pemasukan, total pengeluaran, dan saldo bersih

• Riwayat transaksi dengan pencarian, filter, pagination, edit, hapus, dan export Excel

• Manajemen kategori transaksi dengan emoji, warna, serta tipe pemasukan/pengeluaran

• Workspace kolaboratif dengan role anggota seperti Owner, Editor, dan Viewer

• Undangan anggota melalui email

• Laporan keuangan berupa grafik bulanan, perbandingan bulan ini vs bulan lalu, dan pengeluaran per kategori

• Modul penjualan untuk mencatat produk, omzet, HPP, biaya operasional, laba kotor, dan laba bersih

• Sistem autentikasi menggunakan email/password dan Google OAuth

• Verifikasi email, reset password, serta proteksi akses halaman

• Sistem billing dan langganan dengan integrasi pembayaran Midtrans

• Panel admin untuk mengelola user, paket, dan subscription

Antarmuka Dwitku dibuat modern, responsif, dan mudah digunakan dengan pendekatan dashboard yang ringkas. Desainnya berfokus pada kemudahan pencatatan harian, pemantauan kondisi keuangan, serta kolaborasi dalam satu workspace.

Implementasi Teknis

• Menggunakan Next.js App Router dengan Server Components dan Server Actions

• Prisma ORM untuk pengelolaan database PostgreSQL

• NextAuth/Auth.js untuk autentikasi dan manajemen session

• TanStack Query untuk data fetching client-side yang responsif

• TanStack Table untuk pengelolaan tabel data

• Zod dan React Hook Form untuk validasi form

• Role-based access control untuk membatasi aksi berdasarkan peran anggota

• Integrasi Resend untuk pengiriman email verifikasi, reset password, dan undangan

• Integrasi Midtrans untuk pembayaran paket langganan

• UI dibangun dengan Tailwind CSS, Radix UI, dan Lucide React

Aplikasi ini menunjukkan kemampuan dalam membangun sistem keuangan berbasis web yang modern, kolaboratif, aman, dan mudah dikembangkan untuk kebutuhan personal maupun bisnis kecil.

Tech Stack: Next.js 16, React 19, TypeScript, Tailwind CSS 4, Prisma, PostgreSQL/Neon, NextAuth/Auth.js, TanStack Query, TanStack Table, Radix UI, Zod, React Hook Form, Midtrans, Resend.