This web application allows users to view, interact with, and donate to various campaigns. It provides features for campaign browsing, donation management, and statistics tracking.
- Home Page: The home page displays a list of available campaigns.
- Campaign Details: Users can click on individual campaign cards to view detailed information, including campaign name, description, category, and an image.
- Donations Page: A dedicated page shows a list of campaigns the user has previously donated to, providing an overview of their contribution history.
- Responsive Design: The site is designed to be responsive, ensuring a consistent user experience across different devices.
- Donation Handling: Users can make donations to campaigns by clicking the "Donate" button on campaign detail pages.
- Duplicate Donation Prevention: The system prevents duplicate donations to the same campaign to ensure fair and accurate donation tracking.
- Statistics Page: A dedicated statistics page offers visual insights into the user's donation habits. It uses a pie chart to display the percentage of campaigns donated to versus campaigns available for donation.
- Local Storage: User data, including donated campaigns, is stored in local storage. This ensures that users can access their donation history even after leaving and returning to the site.
- Feedback Messages: Users receive feedback messages when making a donation, providing a clear and interactive experience.
- Navigation: The site offers easy navigation between different sections, such as the home page, campaign details, donations page, and statistics page.
- Linking: React Router is used for navigation management, allowing users to click on campaign cards to view details with updated URLs.