๐ Sedekah Rutin
Sedekah Rutin is a donation management system and campaign platform built to empower institutions in running transparent, impactful fundraising efforts. The backend is developed with Laravel and follows a RESTful API structure using transformers, while the admin panel is built with Vue.js as a single-page application. Key features include campaign creation with SEO-friendly slugs, donation processing via manual bank transfers and auto-verification through Moota.co, as well as user authentication using Firebase Google Sign-In. Campaign updates support rich content including images, and every donation can be synchronized with Sedekah Rutin BMI's external API for centralized tracking.
The platform supports multiple roles (admin, advertiser, manager) with scoped data visibility and control. The admin panel includes detailed dashboards, donation analytics, campaign performance charts, and institution-based access. Institutions can manage their own campaigns, track donations, and create embeddable donation forms. The system ensures transparency with campaign progress updates and withdrawal approvals. With a clean architecture and deeply integrated tools, Sedekah Rutin provides a reliable infrastructure for continuous charitable giving.
๐ง Role: Backend & Fullstack Webย
๐งฐ Tech Stack:
Backend: Laravel (API-Driven Development, Fractal Transformers, Firebase Auth Integration)
Frontend: Vue.js (Admin Panel SPA)
Database: MySQL / MariaDB (Custom-designed Schema)
Authentication: Firebase (Google Sign-In) โ Token Validation
3rd Party Integrations:
Moota.co: Real-time bank transaction monitoring & validation.ย
Sedekah Rutin BMI API: Donation synchronization
Rich Text: Global RichText Component with Image Upload
Infrastructure: RESTful API, Role-Based Access Control (ACL), Modular Component Structure
Integrated Google Sign-In using Firebase Auth; verified tokens on backend.
Managed user profile data and protected API routes with middleware based on roles (Admin, Advertiser, Manager).
Full campaign lifecycle management:
Creation, Editing, Hiding/Unhiding, Deletion
Set as Slider, Preferred, Popular, or Limited Version
RichText support for campaign content and campaign update posts (e.g., fund distribution progress).
SEO-Friendly campaign slugs and detailed views with related entities (institution, donor list, updates).
Featured Campaigns:
Show campaigns for sliders, preferred picks, or popular campaigns.
By Category or Institution:
Filter campaigns by category (e.g., education, disaster relief) or managing institution.
Campaign Details:
Get full details including goals, updates, donor lists, and SEO-friendly slugs.
Search & Pagination:
Search campaigns with keyword filtering and pagination support.
Campaign Updates:
Add progress or fund usage updates using RichText for transparency.
Two-mode donation processing:
Manual Bank Transfer: User uploads proof, admin verifies.
Automatic Bank Transfer Verification: Integrated with Moota.co to auto-fetch and verify bank transfers. Automatically confirm donation payments by matching unique last-three-digit amounts in bank transfers, using real-time webhooks to update donation status as Paid once verified.ย
Donation form generation for embedding (iFrame, script, link).
Pushed to Sedekah Rutin BMI API for centralized tracking.
Donation summary per campaign and user.
Multi-Role ACL System:
Role-based access enforced globally via ACL Rules.
Advertiser/Manager tied to specific institution campaigns.
Each role sees scoped statistics and data relevant to their institution only.
General Admin View:
Total Campaigns, Successful Campaigns, Live Campaigns
Campaign Progress Chart: % of fundraising targets reached.
Latest Donations with campaign references.
Institution/Advertiser View:
Filtered donation stats by date and campaign
Data Points:
Filled Forms, Successful Donations, Pending Donations
Total Donation Amount
Embedded form usage tracking
Admin panel allows:
Donation detail listing per campaign
Withdrawal request approval workflow
RichText-based fund utilization updates
Modular View-Based
Core Features:
Reusable Form Components
Global Axios Setup with Auth Handling
Vue Router for Navigation
Role-based UI logic and conditional rendering
๐๏ธ Database Design
Personally designed and implemented the relational database schema supporting all business logic.
Client Side Preview
Home Page
Home Page
Search Campaign
Detail Campaign Page
Donate Form Page
Donate Form Page
The Web App - Admin Panel
Login Page
Stats Page - Manager Advertiser Role
Stats Page - Admin Role
Manage Institution - Admin Role
Manage Donation Campaign - Admin Role
Approval Donation Payment - Admin
Withdrawal Approval - Admin Role
Manage Master Data - Admin Role
Manage Donation Campaign
Manage Donation Campaign
Custom Form or Button Builder (For Embed Purpose)
Manage Donate
Institution Donation Withdrawal
Manage Donate
Contributed to this project as part of my role at Kreasi Putra Hotama.
Jul 2021 - Oct 2021