Overview
The School Funding Management Platform is a web application for managing and distributing operational assistance to schools under the Ministry of Religious Affairs of Indonesia. It handles user management, fund allocation, verification, and reporting.
Features
- Multi-level User Management: Different user roles including central, province, district, executive, and school levels, each with specific permissions and access.
- Fund Allocation and Distribution: Manages the allocation and distribution of funds to eligible schools based on various criteria.
- Verification Process: Verification system for submitted documents and fund requests.
- Reporting and Analytics: Reporting for different administrative levels, including fund utilization, verification status, and overall program progress.
- Document Management: Users can upload, manage, and verify various documents required for the assistance program.
- Dashboard and Visualizations: Dashboards with data visualizations for quick insights into program status and progress.
- Announcement System: A system for publishing and managing announcements for users.
- Configurable Settings: Administrative controls to configure various system settings and parameters.
Tech Stack
- React: For the frontend UI.
- Next.js: For server-side rendering and routing.
- TypeScript: For type safety.
- Chakra UI: For UI components.
- React Query: For server state management and data fetching.
- Axios: For HTTP requests.
- React Table: For dynamic tables.
- React Hook Form: For form handling.
- File-Saver: For file downloads.
- Date-fns: For date formatting.
- React Icons: For icons.
Key Components
- User Authentication: JWT-based authentication system.
- Role-based Access Control: Access control based on user roles and permissions.
- Dynamic Form Generation: Dynamic forms for various data input scenarios.
- File Upload and Management: File uploads for documents and reports.
- Data Visualization: Charts and graphs for data representation.
- Pagination: Custom pagination for large datasets.
- Modular Component Structure: Components organized in a modular fashion for maintainability.
Lessons Learned
- Scalability: Designing a system to handle data for many schools across different administrative levels required careful planning.
- User Experience: The interface needed to work for users with varying levels of technical expertise.
- Data Integrity: Accurate fund allocation and distribution depends on solid verification at each step.
- Performance: Efficient data fetching and state management strategies were needed for handling large datasets.
- Security: Strict access controls and data protection are critical for sensitive financial information.
- Flexibility: The system needed to adapt to changing regulations and requirements in government assistance programs.
Screenshots

