DONATION PLATFORM

1
 CERTIFICATE
This is to certify that the report, entitled as “Donation platform” submitted to the
Bharathiar University, in partial fulfilment of the requirements for the award of the degree of
Bachelor of Computer Science in Artificial Intelligence and Data Science is a record of original
projects work done by “STUDENT NAME” during the period JUNE 2024 to NOVEMBER
2024 of his/her project in the department of COMPUTER SCIENCE at SHREE
VENKATESHWARA ARTS AND SCIENCE (CO-EDUCATION) COLLEGE,
OTHAKUTHIRAI, GOBICHETTIPALAYAM. (College/Research Institute/Bharathiar
University) under my supervision and guidance, the thesis has not formed the basis for the
award of any Degree/Diploma/Associate ship/Fellowship or other similar titles of any
candidate of any University. Countersigned Signature of the Guide.

Signature of the Guide Signature of the HOD

Signature of the Principal

Submitted to Bharathiar University Viva-voce Examination on ________________

Signature of the Internal Examiner Signature of the Internal Examiner

2
 DECLARATION
I student name hereby declare that the project report, entitled " Donation platform ",
submitted to the Bharathiar University, in partial fulfilment of the requirements for the award
of the Degree of B.SC COMPUTER SCIENCE IN ARTIFICIAL INTELLIGENCE AND
DATA SCIENCE is a record of original and Independent project work done by me during
JUNE 2024 to NOVEMBER 2024 under the Supervision and Guidance of Ms. S.
SANGEETHA MCA., M. Phil., (Ph.D.) Department of Computer Science and it has not
formed the basis for the award of any Degree Diploma/Associateship/Fellowship or other
similar titles to any candidate in any University.

Date: Signature of the Candidate)

Place: [STUDENT NAME]
(Reg. No: )

3
 ACKNOWLEDGEMENT
The completion of this project was not just because of my ability but there are some
well-wishers behind it I am always thankful to them. I would like to express my deep sense of
gratitude and obligation to college council for providing necessary facility and given me the
opportunity to do the entire college studies in SHREE VENKATESHWARA ARTS AND
SCIENCE (CO-EDUCATION) COLLEGE, Gobichettipalayam.

I wish to express my deep sense of gratitude and thankfulness to Secretary Thiru. K. C

KARUPANAN. Chairman Thiru. P. VENKATACHALAM. for providing which made me to
complete this project successfully.

I would like to express my deep sense of gratitude our beloved Principal, Dr. A.
MOHANASUNDARAM M. Com., M.Phil., MA., MBA., PGDHRM., PGDCA., Ph.D.
Shree Venkateshwara Arts and Science (Co-Education) College, Gobichettipalayam for his
inspiration which made me to complete this project successfully.

I would like to acknowledge my gratitude to our beloved Head of the Department,

Department of Computer Science, Ms. B. KANCHANADEVI M.Sc., M.Phil., (Ph.D.) Shree
Venkateshwara Arts and Science (Co-Education) College, Gobichettipalayam, cheerful
encouragement, and supporting me as a lot. Which this valuable guidance and constructive
suggestion, this project has been completed within the stipulated time.

I would like to express my sincere thanks and gratitude to my project guide, Ms. S.
SANGEETHA MCA., M.Phil., (Ph.D.) Assistant Professor, Department of Computer
Science. Shree Venkateshwara Arts and Science (Co-Education) College Gobichettipalayam
who are have given me overwhelming support, kind co-operation and encouragement
throughout the project.

Lastly, I thank almighty, my parents and friends for their constant encouragement
without which assignment would be possible. I wish to thank all the staff members of
Department of Computer Science and Applications, Shree Venkateshwara Arts and science
(Co-Education) College, for the kind assistance throughout the project

4
 CONTENT

S. No PARTICULARS PAGE NO
CERTIFICATE 2
DECLARATION 3
ACKNOWLEDGEMENT 4
SYNOPSIS 6
1 INTRODUCTION 7-10
1.1 About the project 7
1.2 System Specification 8
1.2.1 Hardware Specification 8
1.2.2 Software Specification 8
1.3 Software Description 9
2 SYSTEM STUDY 13-15
2.1 Existing System 13
2.1.1 Drawbacks 13
2.2 Proposed System 14
2.2.1 Features 14
3 SYSTEM DESIGN AND DEVELOPMENT 16-22
3.1 File Design 16
3.2 Input Design 17
3.3 Output Design 18
3.4 Database Design 20
3.5 System Development 21
3.5.1 Description of Modules 21
4 SOFTWARE TESTING AND IMPLEMENTATION 23-28
4.1 System Testing 23
4.2 Software Implementation 26
5 CONCLUSION AND FUTURE ENHANCEMENTS 29-30
5.1 Conclusion 29
5.2 Future Enhancement 30
6 BIBLIOGRAPHY 31
7 APPENDICES 32-
Data Flow Diagram 32
Sample Coding 33
Sample Input 42
Sample Output

5
SYNOPSIS
The Donation Platform is an online system designed to streamline and simplify the
process of donating to various charitable causes. The platform is developed using React for the
frontend, ensuring a dynamic and responsive user interface, while Node.js and Express handle
the backend, managing API requests, user authentication, and donation processing. MongoDB
serves as the database to store user profiles, donation records, and campaign details in a
flexible, scalable way.

The platform enables users to easily browse and donate to campaigns, track their
donation history, and securely make payments through integrated payment gateways such as
Stripe and PayPal. Non-profit organizations can create and manage campaigns, monitor
donations, and communicate with donors through an admin panel. The platform is designed to
be scalable, secure, and user-friendly, offering a seamless donation experience and supporting
the long-term goals of both donors and organizations.

6
 1. INTRODUCTION
1.1. ABOUT THE PROJECT

The Donation Platform is an online web application built to facilitate seamless

charitable donations through a user-friendly interface. It uses React for the frontend to create
an interactive and dynamic user experience, enabling users to browse through various donation
campaigns, make contributions, and track their donation history in real-time.

The backend is powered by Node.js and Express, providing a robust server-side

environment to handle API requests, user authentication, donation processing, and
communication between the platform and external services like payment gateways (e.g., Stripe
and PayPal). The data is stored in MongoDB, a NoSQL database that ensures flexibility and
scalability, handling data related to users, donations, and campaigns.

The platform allows non-profit organizations to create, manage, and track their
campaigns, ensuring transparency and encouraging greater community involvement. With
features such as secure payment processing, real-time updates on donation progress, and easy
campaign management, this donation platform aims to empower users and organizations in
making the process of charitable giving more efficient, transparent, and accessible.

7
1.2 SYSTEM SPECIFICATION

1.2.1 HARDWARE CONFIGURATION

• SERVER : DEDICATED SERVER

• PROCESSOR: INTEL XEON OR AMD EPYC

• STORAGE : SSD 1 TB

• RAM : 16 GB DDR4

• NETWORK : GIGABIT ETHERNET

1.2.2 SOFTWARE SPECIFICATION

• OPERATING SYSTEM : LINUX/UBUNTU

• FRAMEWORK : EXPRESS, REACT

• DATABASE : MONGODB

• BACKEND LANGUAGE : NODE.JS

• PACKAGE MANAGER : NPM

8
1.3 SOFTWARE DESCRIPTION

Frontend

REACT

For the Donation Platform project, React serves as the core technology for building the
frontend of the application. React provides an efficient way to build a dynamic and responsive
user interface that allows users to interact with the platform, browse organizations, and make
donations. By leveraging React's component-based architecture, the frontend is modular, easy
to manage, and scalable. It ensures a smooth user experience through real-time data updates,
without needing to reload the page. React's ability to handle complex state management and its
seamless integration with APIs makes it the perfect choice for building a donation platform that
requires user engagement and dynamic content loading, such as donation forms, user profiles,
and organization data.

Features

• Component-Based Architecture: React structures the application into small, self-

contained components that are easy to develop, test, and maintain. This modular
approach allows developers to build reusable components like donation forms, user
profiles, and organization cards.

• Virtual DOM: React utilizes a Virtual DOM to improve performance by minimizing

direct manipulation of the actual DOM. Changes to the UI are first made in the Virtual
DOM, and only the necessary updates are reflected in the real DOM, leading to faster
rendering and a more responsive interface.

• State Management with Hooks: React's useState and useEffect hooks enable the
management of component-level state and side effects. These hooks simplify handling
user input, fetching data (e.g., donation records), and synchronizing the UI with
backend data.

• React Router: React Router allows for seamless navigation within the platform by
managing routes and URLs. Users can navigate between pages like organization
profiles, donation forms, and donation history without reloading the page, enhancing
the user experience.

9
• Unidirectional Data Flow: React follows a one-way data flow model, meaning data
flows from parent components to child components through props. This makes it easier
to understand how data changes and ensures predictable behavior throughout the
application.

• Reusable Components: React promotes the creation of reusable components, reducing

redundancy and enhancing the maintainability of the platform. For example, a single
DonationButton component can be reused across various campaigns.

• Dynamic UI: React’s ability to update parts of the UI dynamically allows the donation
platform to reflect real-time changes, such as updating donation amounts or showing
progress bars for fundraising campaigns, without needing to reload the entire page.

• Context API/Redux: For managing global state across the application, React’s Context
API or external libraries like Redux are used to handle user authentication, donation
history, and campaign data, ensuring consistency across different components.

• Form Handling & Validation: React simplifies managing form inputs like donation
amounts or user details and performing validation (e.g., ensuring a valid email or
donation amount). Libraries like Formik or custom solutions can be integrated to
enhance form functionality.

• Responsive Design: React works well with CSS frameworks (e.g., Bootstrap, Material-
UI) to ensure that the donation platform is responsive and adapts to different screen
sizes, providing a smooth user experience on both desktop and mobile devices.

10
Backend
NODE.JS

In the Donation Platform project, Node.js serves as the backend environment for
building scalable and efficient server-side applications. It is a powerful JavaScript runtime built
on Chrome's V8 engine that allows for non-blocking, event-driven architecture. This makes it
well-suited for handling concurrent requests and real-time data, which is essential for platforms
requiring fast and dynamic interactions, such as processing donations and updating real-time
donation statistics.With its extensive npm (Node Package Manager) ecosystem, Node.js
integrates easily with various modules and libraries, such as Express.js for creating the REST
API, Mongoose for interacting with MongoDB, and Passport.js for user authentication.

The platform uses Node.js to handle tasks like managing user authentication,
processing payments, interacting with the database, and serving data to the frontend. Node.js
ensures that the backend can handle a high volume of simultaneous connections, providing a
smooth experience for users making donations or browsing campaigns.

EXPRESS

In the Donation Platform project, Express.js is used as the web framework for building
the backend API and handling HTTP requests. Built on top of Node.js, Express simplifies the
creation of server-side logic by providing a robust set of features for web and mobile
applications. It allows for the easy handling of routing, middleware integration, and
request/response management. Express facilitates the development of RESTful APIs that
interact with the database, process donations, manage user authentication, and deliver data to
the frontend React application.

By using Express, the project can efficiently handle various routes, such as user sign-
ups, login requests, donation processing, and retrieving organization details. Its minimalistic
design and extensibility make it ideal for building scalable and performance-optimized web
applications like the donation platform, ensuring smooth communication between the frontend
and backend systems.

11
MONGO DB

In the Donation Platform project, MongoDB serves as the NoSQL database used to
store and manage data in a flexible, scalable manner. MongoDB’s document-oriented structure,
based on BSON (Binary JSON), allows for storing data in a hierarchical format, which is ideal
for handling complex data such as user profiles, donation records, and campaign details. Unlike
traditional relational databases, MongoDB provides flexibility by allowing dynamic schema
design, making it easier to adapt as the platform evolves and new features are added.

In this project, MongoDB efficiently handles large volumes of data, such as tracking
donations, storing payment information, and managing organizational profiles. Using
Mongoose, an ODM (Object Data Modeling) library for MongoDB, ensures seamless
interaction between the backend (Node.js and Express) and the database. MongoDB's
scalability and ability to handle real-time data make it an ideal choice for the donation platform,
where quick data retrieval and storage are essential to providing a smooth, real-time user
experience.

12
 2. SYSTEM STUDY

2.1 EXISTING SYSTEM

The existing systems for online donation platforms generally consist of basic websites
or applications that allow users to donate to charitable causes or organizations. These platforms
often feature a simple user interface where individuals can choose the charity they want to
support, enter donation details (such as amount and payment method), and complete the
transaction. Most of these systems are typically built with traditional web technologies and
frameworks. They usually offer minimal interactivity, and data handling is mostly transactional
with limited real-time updates. The existing systems may rely on basic forms to collect
donation information and may not offer a streamlined or personalized user experience.
Additionally, these systems sometimes lack advanced security features or fail to offer
integration with modern payment gateways or social media channels to engage donors.

2.1.1 DRAWBACK

• Limited Interactivity – Existing systems often provide a basic user interface with
minimal user engagement.

• Lack of Real-Time Updates – Donation progress and campaign status are not updated
dynamically, which reduces donor motivation.

• Security Vulnerabilities – Older systems may not implement modern security

protocols, potentially exposing donor data to risks.

• Basic Payment Gateway Integration – Limited payment options or high transaction

fees due to outdated integration with payment gateways.

• Poor Mobile Optimization – Some platforms are not mobile-responsive, making it

difficult to donate via smartphones.

• Limited Personalization – Lack of personalized donation history, rewards, or

recurring donation options, reducing user retention.

• Cumbersome Donation Process – The donation flow can be long or complicated,

leading to abandoned transactions.

13
 • Lack of Campaign Management Tools – Organizations may not have effective tools
to track donations, manage campaigns, or engage donors.

• No Social Media Integration – Existing systems may lack social sharing features,
limiting community involvement and awareness.

• Limited Scalability – Older systems may struggle with high traffic volumes or a large
number of donations during fundraising events, affecting performance.

2.2 PROPOSED SYSTEM

The proposed donation platform aims to create a dynamic, user-friendly, and secure
environment for both donors and organizations. Built using modern technologies like React for
the frontend, Node.js with Express for the backend, and MongoDB for the database, this system
will provide real-time updates, a seamless donation process, and a highly interactive user
interface. Donors will be able to select causes, make payments securely, track donation
progress, and engage with the platform through features like social sharing and recurring
donations. Organizations will have advanced tools for managing campaigns, viewing donation
analytics, and interacting with donors. The platform will prioritize data security, mobile
responsiveness, and scalability, ensuring it can handle increasing donations and user traffic
over time.

2.2.1 FEATURES

• Real-Time Donation Tracking – Live updates on campaign progress and donation

goals, motivating users to contribute.

• Secure Payment Integration – Multiple secure payment gateway options (e.g., Stripe,
PayPal) for global and safe transactions.

• User Profiles and Donation History – Donors can view their donation history, manage
their profiles, and track recurring donations.

• Responsive Design – The platform will be fully mobile-responsive, ensuring a

seamless donation experience across all devices.

• Personalized Donor Experience – Personalized recommendations, rewards, and

certificates for donors to enhance engagement.

14
• Campaign Management Tools for Organizations – Easy-to-use dashboard for
organizations to create, manage, and track campaigns.

• Social Media Integration – Allow users to share their donations or campaigns on

social media, spreading awareness and increasing reach.

• Recurring Donation Options – Donors can opt for automatic recurring donations,
improving donor retention and consistent fundraising.

• Admin Dashboard – A backend panel for platform admins to manage users,

campaigns, payments, and overall platform performance.

• Data Security and Privacy – Enhanced security protocols to protect donor information
and ensure compliance with data privacy regulations.

15
 3. SYSTEM DESIGN AND DEVELOPMENT
3.1 FILE DESIGN
1. Static Files: These files include all the frontend assets that are publicly accessible and serve
to provide a smooth user experience. This includes the HTML, CSS, and JavaScript files
used by React to render the platform's interface. Additionally, static files such as images,
icons, fonts, and stylesheets are included to maintain the look and feel of the platform.
These files are served from the web server and cached to improve loading times. They also
include assets such as promotional banners, user profile images, and donation-related
media.
2. Dynamic Data: This includes user data, donation records, campaign details, and
transaction histories. The MongoDB database stores this dynamic data in a flexible,
NoSQL format. The platform organizes this data into collections such as:
• Users: Stores user information like name, email, password (encrypted), and donation
history.
• Campaigns: Stores details of ongoing and past donation campaigns, including goals,
descriptions, and progress.
• Donations: Stores individual donation records, including amounts, donors, campaign
IDs, and payment status.
• Transactions: Stores transaction details, such as payment method, status, and
timestamps.
These collections are interconnected, allowing for efficient querying and updating of
records. Data is structured for quick retrieval, such as querying the donations made to a
specific campaign or fetching the total amount donated by a user.
3. Backend Files (Node.js/Express): These files handle API endpoints and server logic. The
Express routes define the various HTTP methods (GET, POST, PUT, DELETE) for
interacting with the frontend, such as retrieving donation data or creating new donation
records. Controllers process these requests and interface with the MongoDB database using
Mongoose models, which define the structure and validation rules for the data stored in
collections like users, donations, and campaigns. Middleware files ensure that sensitive
data like passwords are securely handled, and authentication is managed via token-based
systems like JWT (JSON Web Tokens).

16
4. Configuration Files: These files store the environment-specific settings and configurations
needed to run the platform. Files like .env store sensitive information such as API keys,
database connection strings, and server configurations. These configuration files ensure
that the application can be easily deployed across different environments (development,
production) without hardcoding sensitive information.
5. Log Files: These files track the platform's activity, including system errors, user login
attempts, and donation transactions. They help in debugging issues, monitoring platform
health, and ensuring compliance with data regulations. Server-side logs are maintained for
monitoring backend operations, such as API request handling and database interactions.

3.2 INPUT DESIGN

The Input Design for the Donation Platform focuses on how data is collected from users
and entered into the system. It ensures that the data entry process is user-friendly, consistent,
and accurate, allowing the platform to process the input seamlessly and efficiently.

• User Registration: Users are required to input their personal details (name, email,
contact information) to create an account. The registration form utilizes text fields,
drop-down menus (for selecting location or country), and password fields to ensure
secure and complete information entry. Input validation checks ensure that fields such
as email addresses and passwords meet security requirements.
• Donation Form: Donors fill out a donation form to contribute to specific campaigns.
The form includes fields for donation amount (either custom or predefined), payment
details (such as credit card or PayPal), and the donor’s message or dedication (optional).
A secure payment gateway integration ensures that sensitive information like payment
details is handled safely.
• Campaign Creation (Admin Input): Administrators can input campaign details,
including campaign name, description, donation goals, and deadlines. These details are
entered through a backend interface where admins can fill out structured data forms to
create, edit, or delete campaigns. Input validation ensures that campaign data is
complete and follows the necessary formats.

17
 • User Profile Management: Registered users can update their personal information,
such as changing their contact details or resetting their passwords. Forms for profile
management are designed to be simple, with text fields for updating email, address, and
other user-specific information. Validation ensures that fields are filled correctly and
any updates are stored securely in the database.
• Admin Dashboard: Administrators have access to forms that allow them to manage
user roles, view donation history, and update campaign progress. These forms are
designed for easy data input, with search and filter options for effective management of
data. Admins can also modify platform settings and update payment processing
integrations.
• Feedback and Comments: Donors can leave feedback or messages for campaign
organizers. These inputs are gathered via a comment box or feedback form on the
campaign pages, which are processed and stored in the database.

The Input Design incorporates input validation to ensure data integrity and prevent errors. For
example, the system checks that all mandatory fields are filled, valid email formats are entered,
and that payment information is accurate. By focusing on simplicity and accuracy, the input
design ensures a smooth and efficient experience for both users and administrators on the
platform.

3.3 OUTPUT DESIGN

The Output Design for the Donation Platform focuses on how data is presented to the
user after being processed. It ensures that the information displayed is clear, relevant, and
tailored to the user’s needs, offering an intuitive and informative experience.
• Donation Summary: After users complete a donation, the platform displays a summary
of the transaction, including the amount donated, the campaign name, and the donor’s
message (if provided). This summary confirms the successful donation and provides
users with important details about their contribution.
• Real-Time Donation Tracking: Donors can view the progress of the campaigns
they’ve supported. The system shows real-time updates on the total amount donated,
the percentage of the goal achieved, and remaining time for the campaign. This keeps
donors informed and engaged with the campaign's progress.

18
 • Invoice/Receipt: Once the payment for a donation is successful, the system generates
a receipt that includes donation details, payment method (credit card or PayPal),
transaction ID, campaign information, and the donor’s contact information. This
ensures transparency and allows users to keep track of their donation history.
• Admin Dashboard: Administrators have access to a dashboard that displays reports
and analytics on campaigns, user activity, and donations. This includes graphs showing
total donations per campaign, user demographics, and campaign performance. The
admin dashboard helps manage donations effectively and make informed decisions.
• Error Messages: If there are issues such as invalid payment details, missing
information, or failed transactions, the platform displays clear and helpful error
messages. These messages guide users in resolving the issue, ensuring a seamless
experience. For instance, if a payment fails, a message will prompt the user to check
their payment information or try another payment method.
The Output Design is intended to ensure that users can easily interpret the data presented and
take the necessary actions without confusion. Whether it's confirming a successful donation,
tracking campaign progress, or addressing errors, the system displays outputs that are both
informative and user-friendly.

19
3.4 DATABASE DESIGN
The Database Design for the Donation Platform outlines the structure of the database
used to store all the system-related data. It defines the collections, relationships between them,
and how data is accessed and manipulated within the system. The design ensures that the data
is organized, scalable, and efficient for real-time transactions and interactions.

• User Table: Stores information about registered users, including personal details, login
credentials, and donation history.

o Fields: UserID, Name, Email, Password, Phone, Address, DonationHistory.

• Campaign Table: Stores details about each donation campaign, including its name,
description, donation goal, and current progress.

o Fields: CampaignID, CampaignName, Description, TargetAmount,

CurrentAmount, EndDate, Status.

• Donation Table: Tracks individual donation records, linking each donation to a user
and a campaign. This table also stores payment status and the transaction details.

o Fields: DonationID, UserID, CampaignID, DonationAmount, PaymentMethod,

PaymentStatus, TransactionID, DonationDate.

• Transaction Table: Stores information about each financial transaction made on the
platform, ensuring secure and accurate record-keeping.

o Fields: TransactionID, DonationID, TransactionAmount, PaymentDate,

TransactionStatus.

• Admin Table: Stores administrator details and access privileges to manage campaigns
and donations on the platform.

o Fields: AdminID, Name, Email, Role, LastLogin.

The relationships between these collections are key to efficient data retrieval. For instance,
the Donation Table references both the User Table and Campaign Table through UserID and
CampaignID, respectively. Similarly, the Transaction Table is linked to the Donation Table
via DonationID to ensure that every transaction is associated with the correct donation.

20
3.5 SYSTEM DEVELOPMENT

The System Development phase for the Donation Platform involves the creation,
implementation, and integration of various components to ensure the smooth functioning of
the platform. This process includes:

1. Front-End Development: The front end is built using React.js, providing an

interactive and responsive user interface. It enables users to navigate the platform, make
donations, view campaign progress, and track their donation history across all
devices—desktops, tablets, and mobile phones.

2. Back-End Development: The back-end is developed using Node.js and Express.js,

responsible for handling user requests, processing donations, managing campaigns, and
interacting with the database. It ensures secure donation processing and updates the
system with each transaction. APIs are created to support real-time data fetching and
user interaction.

3. Database Implementation: MongoDB is used as the database, providing a flexible,

scalable solution to store user information, campaign details, donation history, and
transaction records. The database schema is designed to handle large volumes of data
and support fast retrievals and updates, essential for a high-performance donation
platform.

4. Testing and Debugging: Thorough testing is conducted to ensure all system

components are functioning properly. This includes unit testing, integration testing, and
end-to-end testing. Additionally, performance and security testing is performed to
guarantee that the platform is secure, efficient, and user-friendly before deployment.
3.5.1 DESCRIPTION OF MODULES

• User Registration & Authentication: This module allows users to create accounts, log
in securely, and manage their profiles. It ensures that users’ data is protected using
authentication protocols such as JWT (JSON Web Token) and session management.
• Campaign Management: The module enables admins to create, update, and delete
donation campaigns. It allows admins to set donation goals, provide descriptions, and
monitor the campaign's progress. The module ensures that all campaign data is
accurately stored and displayed to the users.

21
• Donation Management: This module processes the donations made by users,
including calculating the total amount, verifying payment details, and updating the
donation history. It interacts with the payment gateway and stores donation records in
the database, including the campaign the donation is associated with.
• Payment Processing: The payment module securely processes transactions using
external payment gateways (e.g., Stripe, PayPal). It handles user payment details,
verifies transaction status, and updates the database to reflect successful donations. This
ensures the security and integrity of the payment process.
• Real-Time Campaign Tracking: Users can track the progress of their donations and
the status of the campaigns they support. This module provides real-time updates on
the total amount raised, remaining goal, and how much time is left for the campaign. It
sends notifications to users regarding significant milestones or campaign status
changes.
• Admin Dashboard: The admin dashboard provides admins with an overview of all
campaigns, donation statistics, user activity, and payment reports. This module helps
administrators monitor campaign performance, track donations, and generate reports to
make informed decisions.
• User Dashboard: This module allows users to view their donation history, update their
personal information, and track the campaigns they have supported. It also enables
users to share campaigns on social media or by email to encourage others to donate.
• Email Notification System: This module sends email notifications to users and admins
for various events, including successful donations, campaign progress updates, and
alerts for new campaigns. It helps keep all parties informed about activities on the
platform.

22
 4. TESTING AND IMPLEMENTATION

4.1 SOFTWARE TESTING

Software testing plays a critical role in ensuring the Donation Platform works as
expected and meets the functional, performance, and security standards. The testing process is
carried out in phases to validate the correctness of each part of the platform, ensuring that the
system performs efficiently and securely. Below is the systematic approach to software testing
in this project:

1. Unit Testing

• Objective: Verify that individual components of the system work correctly in isolation.

• Scope: Test functions such as donation processing, user registration, and campaign
creation.

• Method: Automated unit tests using tools like Jest or Mocha are conducted to check
if individual functions return the expected results.

• Example: Verify that when a user donates a specific amount, the system correctly
updates the donation history in MongoDB.

2. Integration Testing

• Objective: Ensure different modules or components of the system interact correctly

with each other.

• Scope: Focuses on testing interactions between the front-end (React), back-end

(Node.js/Express), and the database (MongoDB).

• Method: Integration tests validate that data flows properly between the user interface,
server, and database.

• Example: When a user inputs donation details, ensure that the backend stores the
donation in the database and the frontend updates in real-time to reflect the transaction.

23
3. System Testing

• Objective: Verify the system functions correctly under various real-world conditions.

• Scope: Tests the entire system, including front-end, back-end, database, and external
services.

• Method: Stress tests, performance tests, and security tests are performed to simulate
real-world usage, ensuring that the system can handle high traffic and user load.

• Example: Test if multiple users can make donations concurrently without the platform
crashing or becoming unresponsive.

4. User Acceptance Testing (UAT)

• Objective: Validate the system from the user's perspective and ensure it meets their
needs and expectations.

• Scope: Real users interact with the system in realistic scenarios to evaluate functionality
and usability.

• Method: Collect feedback from test users to identify issues related to user experience
and areas for improvement.

• Example: Ensure users can easily browse campaigns, donate, and receive confirmation
emails or notifications.

5. Regression Testing

• Objective: Ensure that new updates or features do not negatively impact existing
functionality.

• Scope: Retesting of previously tested functionalities to confirm no new issues were

introduced after updates.

• Method: Automated tests are run after each software update to ensure that core
functionalities are still working as expected.

• Example: Verify that adding new features like campaign tracking does not disrupt the
donation process or user registration.

24
6. Performance Testing

• Objective: Measure how well the system performs under high traffic and large datasets.

• Scope: Evaluate the system's response time, scalability, and reliability under stress
conditions.

• Method: Tools like JMeter are used to simulate heavy traffic and assess the system’s
speed and stability.

• Example: Measure how the platform handles hundreds of simultaneous donations or

when generating real-time progress reports for multiple campaigns.

Tools Used for Testing:

• Jest/Mocha: For unit and integration testing to ensure functionality of individual

modules.

• Postman: For API testing, ensuring that communication between the frontend and
backend works as expected.

• Selenium: For automated UI testing to ensure that the web interface behaves correctly
across different devices.

• JMeter: For performance testing, especially for simulating high traffic and testing how
well the platform performs under load.

25
4.2 SOFTWARE IMPLEMENTATION
Software implementation is the process of developing the core features of the
Donation Platform, building the user interface, and integrating all components into a cohesive
and working application.

1. Frontend Implementation (React.js)

• User Interface (UI): The frontend is built using React.js, a popular JavaScript library
for building user interfaces. It is designed to provide users with a seamless experience
when browsing campaigns, making donations, and viewing donation history. The
main features include:

o Home Page: Displays a list of active donation campaigns, with brief

information and a "Donate Now" button.

o Campaign Details: Provides detailed information about each donation

campaign, including the cause, goals, and donation options.

o User Profile Page: Allows users to view their donation history, manage their
account settings, and update personal details.

• State Management: React Hooks (e.g., useState, useEffect) are used to handle state
within the application. For instance, when a user donates to a campaign, the state is
updated to reflect the new donation data, which is then passed down through various
components.

• Routing: React Router is implemented to facilitate navigation between the various

pages of the platform without reloading the entire page. This creates a smooth, single-
page application (SPA) experience for users.

2. Backend Implementation (Node.js & Express.js)

• Server Setup: The backend is built using Node.js and Express.js. This combination
of technologies efficiently handles the HTTP requests from the frontend, processes the
logic, and communicates with the database.

26
 • API Endpoints:

o POST /api/donations: Allows users to make donations to specific campaigns.

It processes donation data and updates the database accordingly.

o GET /api/campaigns: Fetches a list of available donation campaigns,

including information such as the campaign name, target amount, and current
donations.

o GET /api/donations/:userId: Retrieves the donation history for a specific

user.

• Authentication: JWT (JSON Web Tokens) is used to implement secure

authentication. It ensures that only authenticated users can access sensitive
information, such as their donation history and profile details. Upon login, the user
receives a token that is required for performing actions like making donations.

3. Database Implementation (MongoDB)

• MongoDB serves as the database for storing all necessary data. The flexible schema
of MongoDB allows for easy management of user data, donation records, and
campaigns.

o Users Collection: Stores user information such as name, email, password

(hashed), and their donation history.

o Campaigns Collection: Contains details about donation campaigns, including

the name of the campaign, description, target goal, current donations, and the
campaign organizer’s contact information.

o Donations Collection: Records each donation made, including the user who
made the donation, the campaign they donated to, the amount, and the date of
donation.

• CRUD Operations:

o The backend supports Create, Read, Update, and Delete (CRUD)

operations. For example, users can create a new donation (Create), view their
donation history (Read), update their profile details (Update), and
administrators can manage campaigns (Delete or Update).

27
4. Integration of Frontend and Backend

• API Communication: The React frontend interacts with the Node.js backend
through API requests. Axios is used to send HTTP requests (GET, POST) to the
server, which processes the data and returns a response.

o Example: When a user selects a campaign to donate to, the frontend sends a
POST request with the donation details to the backend, which processes the
donation and updates the MongoDB database.

• Error Handling: The application handles errors gracefully, displaying user-friendly

error messages for issues like invalid data, failed donations, or network failures. For
example, if a user tries to donate an amount greater than their balance, the system will
notify them of the error.

5. Deployment

• Cloud Hosting: Once the development and testing are complete, the application is
deployed to a cloud platform like Heroku, AWS, or DigitalOcean. The deployment
ensures that the platform is accessible to users via the web.

• CI/CD Pipeline: A Continuous Integration and Continuous Deployment (CI/CD)

pipeline is set up to automatically build, test, and deploy the application whenever
changes are made to the codebase. This helps in maintaining smooth updates and
rollbacks if needed.

28
 5. CONCLUSION

In conclusion, the Donation Platform provides a secure and user-friendly space for
individuals to contribute to causes they care about. By using technologies like React, Node.js,
Express, and MongoDB, the platform ensures a responsive and scalable environment. Features
such as real-time donation tracking, secure payments, user authentication, and campaign
management enhance the donor experience while streamlining backend operations for admins.

The platform offers personalized user profiles, an admin dashboard, and tools for campaign
management. It is designed to grow with future enhancements like automatic receipts and
social media sharing. Overall, it offers an innovative solution for online philanthropy,
empowering users to contribute meaningfully while ensuring transparency and security.

29
5.1 FUTURE ENHANCEMENTS
As technology evolves, several future enhancements could improve the functionality and
user experience of the Donation Platform:

1. Mobile App Integration: Developing dedicated mobile apps for iOS and Android
could enhance user experience with faster performance, push notifications, and offline
access to donation history and campaigns.

2. AI-Powered Campaign Recommendations: Integrating machine learning algorithms

to suggest donation opportunities based on user preferences, past contributions, and
browsing history would increase engagement and improve user satisfaction.

3. Advanced Analytics & Reporting: Implementing more advanced analytics tools could
help admins track donation trends, user demographics, and campaign performance,
enabling data-driven decision-making.

4. Recurring Donations: Adding a feature for recurring donations would allow users to
set up automatic, regular contributions to their chosen causes, enhancing convenience
and long-term support.

5. Integration with More Payment Providers: Expanding payment gateway integrations

could provide users with more options for making donations, such as cryptocurrencies
or regional payment services.

6. Social Media Sharing: Enabling users to share their donations or supported causes on
social media platforms would help raise awareness and encourage more donations
through community engagement.

7. Donor Recognition & Badges: Introducing a system of badges or donor recognition

for users based on their contributions could foster a sense of community and encourage
larger donations.

8. Voice Assistance: Integrating voice-activated features would allow users to donate or

manage their accounts using voice commands, providing a hands-free and modern
approach to interacting with the platform.

30
 6. BIBILIOGRAPHY
Textbook References:

1. "Learning React: Functional Web Development with React and Redux"

o Author: Alex Banks, Eve Porcello

o Year: 2020

2. "Node.js Design Patterns"

o Author: Mario Casciaro

o Year: 2014

3. "Express.js Guide: The Comprehensive Book on Express.js"

o Author: Azat Mardan

o Year: 2014

4. "MongoDB: The Definitive Guide: Powerful and Scalable Data Storage"

o Author: Kristina Chodorow

o Year: 2013

5. "Full-Stack React, TypeScript, and Node: Build modern web apps with React,
TypeScript, and Node.js"

o Author: David Choi

o Year: 2021

Website References:

1. URL: https://reactjs.org/docs/getting-started.html
2. URL: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide
3. URL: https://nodejs.org/en/docs/
4. URL: https://expressjs.com/en/starter/installing.html
5. URL: https://www.mongodb.com/docs/

31
 7. APPENDICES

A) DATA FLOW DIAGRAM

32
B) TABLE STRUCTURE

1. Users Collection (users)

Stores information about all users, including donors, recipients, and administrators.

Field Data Type Description

_id ObjectId Unique identifier for the user

name String Full name of the user

email String User's email address (unique)

password String Hashed password for authentication

role String User role: 'donor', 'recipient', 'admin'

contactNumber String User's contact number

address String User's physical address

createdAt Date Account creation date

updatedAt Date Last profile update date

2. Blood Donations Collection (bloodDonations)

Manages blood donation records.

Field Data Type Description

_id ObjectId Unique identifier for the blood donation

donorId ObjectId Reference to the donor in the users collection

bloodType String Blood type (e.g., A+, O-)

donationDate Date Date of blood donation

quantity Number Amount of blood donated (in milliliters)

location String Location where the donation took place

status String 'available', 'used', or 'expired'

createdAt Date Record creation date

updatedAt Date Last record update date

33
3. Organ Donations Collection (organDonations)

Manages organ donation records.

Field Data Type Description

_id ObjectId Unique identifier for the organ donation

donorId ObjectId Reference to the donor in the users collection

organType String Type of organ donated (e.g., kidney, liver)

donationDate Date Date of organ donation

recipientId ObjectId Reference to the recipient in the users collection (nullable)

hospital String Hospital where the procedure took place

status String 'pending', 'completed', or 'canceled'

createdAt Date Record creation date

updatedAt Date Last record update date

4. Monetary Donations Collection (monetaryDonations)

Manages monetary donation records.

Field Data Description

Type

_id ObjectId Unique identifier for the monetary donation

donorId ObjectId Reference to the donor in the users collection

amount Number Donation amount

currency String Currency type (e.g., USD, EUR)

donationDate Date Date of monetary donation

recipientId ObjectId Reference to the recipient organization/user in the users

collection

paymentMethod String Method of payment (e.g., credit card, PayPal)

status String 'completed', 'pending', or 'failed'

createdAt Date Record creation date

updatedAt Date Last record update date

34
5. Requests Collection (requests)

Manages requests for blood or organ donations.

Field Data Description

Type

_id ObjectId Unique identifier for the request

requesterId ObjectId Reference to the requester in the users collection

type String 'blood' or 'organ'

details String Specific details about the request (e.g., blood type, organ
needed)

status String 'open', 'fulfilled', or 'closed'

createdAt Date Request creation date

updatedAt Date Last request update date

6. Notifications Collection (notifications)

Manages system notifications for users.

Field Data Type Description

_id ObjectId Unique identifier for the notification

userId ObjectId Reference to the user in the users collection

message String Notification message content

isRead Boolean Read status of the notification

createdAt Date Notification creation date

35
C) SAMPLE CODING

Backend (Node.js + Express + MongoDB)

1. Install dependencies:

npm init -y

npm install express mongoose cors bcryptjs jsonwebtoken body-parser

2. Create a server.js file:

const express = require('express');

const mongoose = require('mongoose');

const cors = require('cors');

const bodyParser = require('body-parser');

const jwt = require('jsonwebtoken');

const bcrypt = require('bcryptjs');

// Initialize express app

const app = express();

app.use(cors());

app.use(bodyParser.json());

// MongoDB connection

mongoose.connect('mongodb://localhost:27017/donation-platform', {

useNewUrlParser: true,

useUnifiedTopology: true

}).then(() => {

36
 console.log('MongoDB connected');

}).catch(err => {

console.log(err);

});

// Models

const User = mongoose.model('User', new mongoose.Schema({

name: String,

email: String,

password: String

}));

const Donation = mongoose.model('Donation', new mongoose.Schema({

donorName: String,

amount: Number,

message: String,

date: { type: Date, default: Date.now }

}));

// Routes

app.post('/register', async (req, res) => {

const { name, email, password } = req.body;

const hashedPassword = await bcrypt.hash(password, 10);

37
 const newUser = new User({ name, email, password: hashedPassword });

await newUser.save();

res.status(201).send('User registered');

});

app.post('/login', async (req, res) => {

const { email, password } = req.body;

const user = await User.findOne({ email });

if (!user) {

return res.status(400).send('User not found');

const isMatch = await bcrypt.compare(password, user.password);

if (!isMatch) {

return res.status(400).send('Invalid credentials');

const token = jwt.sign({ id: user._id }, 'secret', { expiresIn: '1h' });

res.json({ token });

});

app.post('/donate', async (req, res) => {

const { donorName, amount, message } = req.body;

38
 const newDonation = new Donation({ donorName, amount, message });

await newDonation.save();

res.status(201).send('Donation received');

});

app.get('/donations', async (req, res) => {

const donations = await Donation.find();

res.json(donations);

});

// Server listening on port 5000

app.listen(5000, () => {

console.log('Server running on port 5000');

});

Frontend (React)

1. Install dependencies:

npx create-react-app donation-platform

cd donation-platform

npm install axios

2. Create a DonationForm.js file in src/components/DonationForm.js:

import React, { useState } from 'react';

import axios from 'axios';

function DonationForm() {

39
const [donorName, setDonorName] = useState('');

const [amount, setAmount] = useState('');

const [message, setMessage] = useState('');

const handleSubmit = async (e) => {

e.preventDefault();

const donationData = { donorName, amount, message };

try {

const response = await axios.post('http://localhost:5000/donate', donationData);

alert('Donation successful');

setDonorName('');

setAmount('');

setMessage('');

} catch (error) {

console.error('Error making donation', error);

alert('Donation failed');

};

return (

<div>

<h2>Make a Donation</h2>

40
 <form onSubmit={handleSubmit}>

<input

type="text"

placeholder="Your Name"

value={donorName}

onChange={(e) => setDonorName(e.target.value)}

required

/>

<input

type="number"

placeholder="Amount"

value={amount}

onChange={(e) => setAmount(e.target.value)}

required

/>

<textarea

placeholder="Message (Optional)"

value={message}

onChange={(e) => setMessage(e.target.value)}

/>

<button type="submit">Donate</button>

</form>

</div>

);

41
}

export default DonationForm;

3. Create a DonationsList.js file in src/components/DonationsList.js:

import React, { useEffect, useState } from 'react';

import axios from 'axios';

function DonationsList() {

const [donations, setDonations] = useState([]);

useEffect(() => {

const fetchDonations = async () => {

const response = await axios.get('http://localhost:5000/donations');

setDonations(response.data);

};

fetchDonations();

}, []);

return (

<div>

<h2>All Donations</h2>

<ul>

42
 {donations.map((donation, index) => (

<li key={index}>

<h3>{donation.donorName}</h3>

<p>Amount: ${donation.amount}</p>

<p>Message: {donation.message}</p>

</li>

))}

</ul>

</div>

);

export default DonationsList;

4. Modify App.js to display the donation form and list of donations:

import React from 'react';

import DonationForm from './components/DonationForm';

import DonationsList from './components/DonationsList';

function App() {

return (

<div className="App">

<h1>Donation Platform</h1>

<DonationForm />

<DonationsList />

43
 </div>

);

export default App;

44
C) SAMPLE INPUT

HOME SCREEN

45
ADD CATEGORY

46
ADD ORGANS

47
DASHBOARD

48
REGISTER HOSPITAL

49
BLOOD DONATION

50
DONATE BLOOD

51
REQUEST BLOOD

52
BLOOD DRIVE

53
MONEY DONATION

54
E. SAMPLE OUTPUT

REPORT

55
BLOOD REPORT

56