Building Muhammadiyah Welfare Hub

About the Project

Our team was inspired to create a solution that addresses the unique needs of the Muhammadiyah Welfare Home (MWH). The problem statement challenged us to design and develop a web-based minimart and voucher system to empower residents and streamline administrative tasks. This project was an opportunity to leverage our technical skills to make a meaningful impact on the community.

The key features of the system aimed to:

• Enable Residents to request products, earn vouchers, and manage their accounts.
• Support Admins with robust tools for user management, voucher approvals, inventory tracking, and reporting.

How We Built It

We developed the system using a Next.js web application for the frontend, backed by a Spring Boot backend and MongoDB as the database.

Features Implemented:

• User-Friendly Dashboard: Residents can view voucher balances, transaction history, and available products.
• Secure Login System: Provides a secure login mechanism with an optional mobile password reset feature.
• Admin Management Tools: Enables administrators to manage users, approve voucher tasks, update inventory with audit logs, and generate reports.

Technology Stack:

• Frontend: Next.js with responsive design for an intuitive user interface.
• Backend: Spring Boot to handle business logic and API development.
• Database: MongoDB for efficient storage and retrieval of data.
• Authentication: Clerk SDK

Challenges Faced

While we successfully implemented most of the required features, we faced several challenges:

• Time Constraints: We couldn't implement the optional auction system due to limited time.
• Integration Complexity: Ensuring seamless communication between the frontend and backend required rigorous testing and debugging.
• User Experience: Designing a system that is intuitive for both residents and admins involved continuous iteration based on feedback.

Lessons Learned

This project taught us the importance of:

• Collaboration: Effective teamwork was crucial in tackling complex tasks and meeting deadlines.
• User-Centric Design: Prioritizing usability ensured that our system met the needs of its users.
• Scalability: Building a system that can scale and accommodate future features, such as the auction system.

Future Plans

Given more time, we plan to:

• Implement the auction feature to allow residents to bid for special items using voucher points.
• Enhance reporting tools with more detailed analytics.
• Integrate report exporting to allow users to export their reports into files.

Through this project, we hope to have contributed to MWH’s mission of fostering a nurturing environment for its residents, while also gaining valuable experience in designing impactful solutions.

Built With

• clerk
• java
• mongodb
• nextjs
• springboot
• typescript