1

A Project Report On

FINANCE MANAGER

Submitted By
SHEKHAR SUMAN (16900120137.)
KAUSHIK SAMANTA 16900120142.)
SAYAN KUNDU (16900120148.)
SHREYANKA DAN (16900120155.)
MAYUKH GHOSH (16900120176.)

Department- CSE, Semester- 7th

Subject: Project-II(PROJ-CS781)

Under the guidance of

Prof. BAPPADITYA MONDAL

A Project Report
To be submitted in the partial fulfillment of the requirements
For the degree of
Bachelor of Technology in Computer Science and Engineering

Department of Computer Science and Engineering,

Academy Of Technology

Affiliated to

Maulana Abul Kalam Azad University of Technology, West Bengal

2023
2

CERTIFICATE

This is to certify that the project entitled: FINANCE MANAGER submitted

to MAULANA ABUL KALAM AZAD UNIVERSITY OF TECHNOLOGY in the
partial fulfillment of the requirement for the award of the [Link] degree in
COMPUTER SCIENCE AND ENGINEERING of Project-II(PROJ-CS781) is
carried out by

SHEKHAR SUMAN (16900120137.)

KAUSHIK SAMANTA 16900120142.)
SAYAN KUNDU (16900120148.)
SHREYANKA DAN (16900120155.)
MAYUKH GHOSH (16900120176.)

under my guidance. The matter embodied in this project is genuine work done by
the students and has not been submitted whether to this University or to any other
University/Institute for the fulfillment of the requirement of any course of study.

Prof. Bappaditya Mondal (Guide)

Department of CSE,
Academy of Technology, Aedconagar,
Hooghly-712121, West Bengal, India

Dated:

Countersigned By

Head, Department of Computer Science and Engg.

Academy of Technology, Aedconagar,
Hooghly-712121, West Bengal, India
3

STATEMENT BY THE CANDIDATES

SHEKHAR SUMAN (16900120137.)

KAUSHIK SAMANTA 16900120142.)
SAYAN KUNDU (16900120148.)
SHREYANKA DAN (16900120155.)
MAYUKH GHOSH (16900120176.)

B. Tech 7th Semester

Dept. of COMPUTER SCIENCE AND ENGINEERING,
Academy of Technology

We hereby state that the Project Report entitled FINANCE MANAGER has been
prepared by us to fulfill the requirements of Project-II (PROJ-CS781) during the
period JULY 2023 to November 2023.

_______________

_______________

_______________

_______________

_______________

Signature of the students

4

LIST OF FIGURES
Contents Page No

1. Figure 1 Context Level DFD………………………………………... 21

2. Figure 2 Level - 1 DFD……………………….…....……………….. 21

3. Figure 3 Entity Relationship Diagram……………………………… 33

4. Figure 4 Sign Up Page……………………………………………… 20

5. Figure 5 Log In Page……..….. …………………………………….. 20

6. Figure 6 Transaction History Page………………………………….. 21

7. Figure 7 Dashboard………………………………………………….. 21
5

Abstract
In the rapidly evolving domain of financial technology, the integration of robust,
secure, and user-friendly digital solutions is critical. This project revolves around
the development of "Finance Manager," an advanced online banking platform
designed using [Link], a leading React framework. The proposed application goes
beyond conventional financial trackers by offering real-time transaction updates,
multi-bank connectivity, and seamless money transfer capabilities, all underpinned
by server-side rendering (SSR) for enhanced performance and security.

The platform leverages cutting-edge technologies including React for its

component-driven architecture, [Link] for server-side operations and static
generation, and Plaid for secure bank integrations. To ensure an intuitive user
experience, the app utilizes Tailwind CSS for streamlined, responsive designs, and
components from Shat CN for consistent and scalable user interfaces.

A core feature of the Finance Manager is its emphasis on security practices.

Utilizing tools like Sentry, the app provides essential monitoring and security
checks, crucial for maintaining data integrity and user trust in financial applications.
The inclusion of comprehensive transaction history, spending categorization, and
interactive financial charts using [Link] is aimed at providing users with insightful
financial management tools.

This project not only aims to introduce a technically sound banking platform but
also contributes to the field of financial technology by addressing crucial needs for
accessibility, security, and user engagement. By documenting the process, from
ideation through development, this endeavor serves as an instructive exemplar for
the development of future fintech solutions, emphasizing the practical
implementation of theoretical knowledge and modern programming paradigms.
6

TABLE OF CONTENTS
Contents Page No

8. Chapter 1 Introduction………………………………………... 6

8.1. Purpose of This Study………………………………………… 7

8.2. Brief Overview of the Project Report………………………… 8

9. Chapter 2 Literature Overview……………………….…....…. 9

10. Chapter 3 Problem Definition & Objectives…………………. 12

11. Chapter 4 Feasibility Study ………………………………….. 15

12. Chapter 5 System Analysis/Proposed Scheme ………………. 20

13. Chapter 6 Software Engineering Paradigm Applied ……..….. 23

14. Chapter 7 Software and Hardware Requirements Specifications.. 26

15. Chapter 8 System Design (if any)………………………………

16. Chapter 9 Database Design ……………………………………. 29

17. Chapter 10 Results…………………………………………….... 37

18. Chapter 11 Conclusion………………………………………….. 40

19. Chapter 12 Future Works……………………………………….. 42

20. Appendices 46
A. List of technical terms ……………………………………………... 47
B. Abbreviations used………………………………………………….. 48

21. Bibliography …………………………………………………………….. 49

 7

FINANCE MANAGER

CHAPTER 1

INTRODUCTION
 8

Introduction

The focal theme of this project is the development of a comprehensive digital banking
application named "Finance Manager." This application aims to revolutionize traditional
banking approaches by integrating advanced web technologies such as [Link] for server-side
rendering and React for its intuitive user interface. The overarching goal is to provide a
seamless, efficient, and secure online banking experience to users.

1.1 Purpose of this study

The primary purpose of this project is to develop a comprehensive, next-generation digital

banking application called "Finance Manager" that aims to revolutionize the traditional
banking experience through the seamless integration of modern web technologies and
advanced finance management capabilities.

The key objectives of this project are:

● Digital Transformation in Banking: To address the growing demand for secure, efficient,
and user-friendly online banking services by leveraging the power of digital technologies.

● Innovative User Experience: To provide users with an intuitive and engaging finance
management dashboard that offers a clear, real-time view of their financial activities,
including transactions, account details, and spending insights.

● Robust Security and Maintainability: To incorporate TypeScript for enhanced type safety
and ESLint for maintaining clean, error-free code, ensuring the application's overall
integrity and reliability in handling sensitive user data.

● Real-world Applicability: To create a digital banking solution that can be seamlessly

integrated into existing financial infrastructure and easily adopted by users, offering a
practical and innovative alternative to traditional banking systems.

● Technological Advancement: To utilize the capabilities of [Link] 14 for server-side

rendering and React for building a responsive user interface, thereby enhancing the
application's performance and user experience.

This project is not just about creating a functional digital banking application but also about pushing
the envelope in how banking systems can incorporate modern web technologies to deliver enhanced
and secure services. The real-world application allows users not only to perform standard banking
operations but also to interact with innovative features such as multiple account management and
real-time financial analysis within a single platform.

1.2 Brief Overview of the Project Report

In the context of creating a comprehensive report akin to the structure and content seen in the
JavaScript Mastery video, the "Brief Overview of the Report" would be a concise introduction
to each chapter's contents, allowing readers to get a quick snapshot of what each part of the
9

report will cover. For the banking app development project, this overview might go as
follows:

● Introduction: Introduces the technologies used, the project scope, and the relevance of
creating a banking app using [Link].

● Literature Review: Discusses existing banking app technologies, areas these apps excel
in, and where they lack, leading the way to identifying gaps the project aims to fill.

● Problem Definition & Objectives: Outlines the specific issues users face with current
banking apps and lists the objectives the new app development project aims to achieve.

● System Design and Architecture: Details the architectural design, front-end, and back-
end technology choices, with a focus on performance optimization and user interface
design.

● Implementation: Covers the coding, integration of different technologies ([Link],

Tailwind CSS, TypeScript), and the realization of front-end and back-end functionalities.

● Testing and Validation: Describes the methods and processes used to ensure the app is
secure, functional, and meets user needs based on predetermined criteria.

● User Feedback and Future Enhancements: Features feedback from initial users and
discusses potential future updates and functionalities based on this feedback.
 10

FINANCE MANAGER

CHAPTER 2
Literature
Overview
11

Literature Overview

In the literature overview section of the project report, a detailed analysis of various key
topics related to the banking app project is provided. Here is a breakdown of the
comprehensive literature review that covers essential aspects for a thorough understanding:

1. Online Banking & Financial Management:

● Explored the evolution of online banking systems and their crucial role in offering
convenient and secure financial services to users.
● Emphasized the impact of technological advancements on the financial industry,
highlighting the transition to digital platforms for banking activities.

2. [Link] 14 Framework:
● Introduced [Link] framework, outlining its features and advantages in developing
modern web applications with server-side rendering capabilities.
● Discussed the utility of [Link] for building applications with React components and
its suitability for complex application architectures.

3. Server-Side Rendering & Group Routes:

● Defined server-side rendering (SSR) and its benefits in improving performance and
user experience in web applications.
● Explored the concept of group routes in [Link], demonstrating how nested layouts
and route groups aid in organizing routes and implementing intricate application
layouts.

4. Advanced Form Management using TypeScript and React Hook Form:

● Detailed the advantages of using TypeScript and React Hook Form library to
manage intricate forms in web applications, focusing on type safety, validation, and
reusability.
● Highlighted the importance of advanced form management techniques in
developing secure and user-friendly banking applications.

5. Tailwind CSS for Modern UI Development:

● Discussed the role of Tailwind CSS in styling contemporary and responsive user
interfaces, streamlining the UI development process.
● Explored the benefits of utility-first CSS frameworks in constructing consistent and
scalable UI components for web applications.

6. Financial APIs & Secure Data Synchronization:

● Examined the significance of financial APIs such as Plaid in securely synchronizing
data from multiple bank accounts, stressing API security and user consent.
● Addressed challenges and best practices in integrating financial APIs to establish a
comprehensive banking platform.
12

7. Application Monitoring & User Experience:

● Discussed the importance of application monitoring tools like Sentry in evaluating
performance and ensuring enhanced security in banking applications.
● Highlighted the need for a seamless user experience encompassing error handling,
performance optimization, and security measures.

8. Open Source Development & Collaborative Learning:

● Explored the advantages of open-source development, focusing on accessible
resources, collaborative learning, and community-driven innovation in building
modern web applications.
● Underlined the significance of transparent and easily accessible codebases in
promoting continuous learning and skill development within the development
community.

This comprehensive literature overview provides a deep dive into essential topics,
technologies, and concepts vital for understanding the banking app project's scope and
significance in the realm of modern web application development and financial
management.
 13
FINANCE MANAGER

CHAPTER 3

Problem
Definition and
Objective
14

Problem Definition and Objective

"Despite the ubiquity of digital banking applications, many still suffer from limitations in terms
of real-time performance, user interface complexity, and inadequate integration of comprehensive
financial management features. These issues often lead to user dissatisfaction and reduced
efficiency in financial management."

This statement highlights the core issues that the banking app developed aims to solve—
performance issues, complex user interfaces, and poor feature integration.

The detailed objectives outline what the project specifically aims to achieve or investigate. These
can be considered as the goals that guide the development process of the banking app., the
objectives include:

● Enhance Application Performance: Improve the load times and responsiveness of the
banking application by leveraging the capabilities of [Link], aiming for a performance
increase over traditional SPA (Single Page Application) architectures.

● Improve User Interface: Develop a clean, intuitive, and easy-to-navigate user interface
that simplifies the user experience. Utilize Tailwind CSS for customizable and responsive
design to cater to various user needs and device formats.

● Integrate Robust Financial Management Tools: Incorporate comprehensive tools in the

dashboard that allow users to efficiently manage and track their financial activities, such
as real-time transaction updates, budgeting tools, and financial analytics.

● Secure Financial Transactions: Ensure the security of user data and financial
transactions through the implementation of advanced security protocols and encryption
methods.

● Automate Common Tasks: Utilize AI tools, like ChatGPT, to automate repetitive tasks
(like date formatting, parsing strings) and enhance the software development process,
thereby reducing the potential for human error and increasing overall efficiency.

● Study User Interaction and Feedback: Analyze user interaction with the application to
further refine functionality and user interface. This objective involves gathering user
feedback through integrated feedback tools or A/B testing methods.

These objectives translate the broad aims of the project into specific targets, guiding the
development team in addressing the articulated problem. Each objective is aligned with the overall
project goal of creating a superior banking application by addressing key areas like performance,
functionality, user experience, and security.
 15
FINANCE MANAGER

CHAPTER 4

Feasibility Study
 16

Feasibility Study

In conducting a preliminary investigation of the proposed Personal Finance Management Web

Application, three key tests of feasibility have been thoroughly examined:

4.1 Technical Feasibility:

The concept of "Technical Feasibility" primarily revolves around evaluating whether the
necessary technical resources — both software and hardware — are available and adequate to
successfully develop and deploy the banking application.

1. Analysis of Software Capabilities ::

Frameworks and Libraries:

● [Link] : The video extensively utilizes [Link], a React framework that allows server-side
rendering, improving the performance of web applications, which is crucial for processing
real-time data such as financial transactions.

● Tailwind CSS : For styling, the video leverages Tailwind CSS, which is known for its
utility-first approach allowing highly customizable and responsive designs,
accommodating various device formats and user interfaces.

● TypeScript: This is used for adding strong typing to JavaScript, enhancing the code
quality and robustness, crucial for handling financial data securely and accurately.

● ChatGPT and other AI tools: For automation of routine coding tasks, enhancing
developer productivity and reducing errors in mundane tasks like string parsing.

Integration Tools:

● The use of various APIs and third-party services such as banking APIs for transaction
data, which are crucial for the app to function as intended in a real-world scenario.

Development and Deployment Platforms:

● Vercel: Deployment is handled through Vercel, a platform optimized for [Link]

applications, which supports features essential for CI/CD workflows, ensuring
continuous integration and smooth deployment processes.

2. Analysis of Hardware Capabilities :

For a project like this, the hardware feasibility would be considered adequate under standard
development and deployment conditions:
 17

● Development Environment:

o Servers: Adequate server support for development and testing, which in the case
of applications like these, can largely be handled via cloud platforms that Vercel
integrates with.

o Local Development Machine: Standard development machines that can run the
required software stack smoothly — typically any modern computer system
capable of handling development environments like JavaScript and its
frameworks.

● Target User Devices:

The application is designed to be responsive and adaptive, ensuring it can operate

effectively across a wide range of devices including smartphones, tablets, and desktop
computers, underpinning the hardware feasibility from an end-user perspective.

In essence, the "Technical Feasibility" analysis in this scenario involves ensuring that all software
and minimal hardware requirements are met to support the advanced functionalities and user
experience goals of the banking application. The video substantiates that current technology
stacks like [Link], alongside supportive tools and platforms like Vercel, ensure that the technical
resources available are more than capable of successfully implementing and deploying the
application as intended. This analysis confirms the project's feasibility, indicating that both the
development environment and the deployment strategy align well with the project's technical
demands.

4.2 Economic Feasibility:

The economic feasibility of the financial manager project depends on a comprehensive analysis
of costs, revenue potential, and market dynamics. A well-thought-out business model, coupled
with effective user acquisition and retention strategies, will be crucial for achieving economic
success. Additionally, staying attuned to economic trends and being agile in adapting to changing
market conditions will contribute to the sustained economic viability of the project. Continuous
monitoring and adjustments based on user feedback and market developments will be essential
for long-term success.
The economic feasibility of developing the Finance Manager banking application is crucial in
determining its viability from a financial perspective. This assessment includes analyzing costs,
potential revenues, and the economic impact of implementing the application.

Cost Considerations
● Development Costs: These include the expense of technical resources like software
tools and development platforms. As per the video, the deployment is discussed using
Vercel, which could imply costs related to deployment and server management,
depending on the scale of the

● Maintenance Costs: Post-deployment, the application will require regular updates and
maintenance to ensure security and functionality. This involves the cost of managing a
development team, server costs, and other operational expenses.
 18

● Marketing and Distribution: Introducing a new banking application into the market
requires a substantial budget allocation for marketing to ensure user acquisition and
competitive standing.

Revenue Streams

● Premium Services: Offering advanced features through a subscription model could be a

plausible revenue stream.

● Transactional Fees: Small fees for high-value transactions, foreign currency exchanges,
or cross-platform transfers could generate revenue.

● Partnerships: Collaborations with financial institutions or fintech services might provide

additional revenue channels.

4.3 Operational Feasibility:

Operational feasibility examines the practicality of the Finance Manager application in a real-
world environment, assessing how the features and services can be implemented effectively.

Implementation Strategy

● Real-time Data Handling: The application will handle real-time transaction data and user
interactions, needing robust server-side management, as facilitated by [Link], ensuring
swift data processing and rendering.

● Security Protocols: Critical for banking applications due to the sensitive nature of
financial data. The use of TypeScript for static type checking helps prevent many common
bugs that can lead to security vulnerabilities. Tools like ESLint aid in maintaining clean,
secure code.

● Scalability: With the underlying technology stack including [Link] and Vercel, the
application is built to be scalable, managing varying loads of user activities efficiently,
which is critical as the user base grows.

Deployment and Integration

● Easy Deployment and Updates: As outlined in the video, deployment on Vercel allows
for seamless updates and rollbacks, which is essential for maintaining application integrity
under real-world operating conditions.

● Integration with Existing Systems: For a banking application, integrating with existing
financial infrastructures like banking APIs, a payment gateway (in this case played – a
payment gateway alternative used), is vital for operational validity.
19

User Adoption

● User Experience: User-centric features, such as a dashboard for financial management,

real-time transaction displays, and interaction features, cater directly to modern
consumers’ expectations.

● Accessibility: A responsive design ensures that the application is usable across different
devices, enhancing user accessibility and experience.

These feasibility aspects justify the development of the Finance Manager application not just from
a technical standpoint but also from a business and operational perspective. They provide a
concrete plan for how the application will be developed, maintained, marketed, and integrated
into the existing ecological system of digital banking solutions.
 20

FINANCE MANAGER

CHAPTER 5

System Analysis
21

System Analysis

Data Flow Diagram:

Figure:1

Figure:2
22

Feature List :

● Authentication: An ultra-secure SSR authentication with proper validations and

authorization

● Connect Banks: Integrates with Plaid for multiple bank account linking

● Home Page: Shows general overview of user account with total balance from all
connected banks, recent transactions, money spent on different categories, etc

● My Banks: Check the complete list of all connected banks with respective balances,
account details

● Transaction History: Includes pagination and filtering options for viewing transaction
history of different banks

● Real-time Updates: Reflects changes across all relevant pages upon connecting new bank
accounts.

● Funds Transfer: Allows users to transfer funds using Dwolla to other accounts with
required fields and recipient bank ID.

● Responsiveness: Ensures the application adapts seamlessly to various screen sizes and
devices, providing a consistent user experience across desktop, tablet, and mobile
platforms.
 23
FINANCE MANAGER

CHAPTER 6

Software
Engineering
Paradigm Applied
 24

Software Engineering Paradigm Applied

The approach to software development greatly influences not only how the project is
managed but also the flexibility and adaptability of the development process. Based on the
nature of the project as explained in the video, here's an insight into the Software
Development Lifecycle (SDLC) Model used and the rationale behind this choice:

● Software Development Lifecycle (SDLC) Model Used :

Agile Methodology is prominently applied in the project. Agile is favored in projects that
require flexibility, iterative progress, and substantial client or user interaction.

Characteristics of the Agile Model in the Project :

1. Iterative Development: The project is developed through repeated cycles (iterative) and
incremental steps (incremental), allowing flexibility in responding to changes in user
requirements or project scope.
-Feedback-Oriented: Regular feedback from user interactions with early prototypes or
versions of the application enables continual improvement and adaptation, enhancing the
overall quality and user satisfaction of the final product.

2. Collaborative Approach: Emphasizes teamwork and collaboration among the

developers and other stakeholders. Given the comprehensive nature of the app, involving
financial transactions, security, and user interface design, collaboration is crucial.

● Justification for Choice:

The choice of Agile over other SDLC models like Waterfall or Spiral is driven by several
factors specific to the nature and requirements of the banking application project:

1. Changing Requirements: In developing a sophisticated application that deals with

financial data and user interactions, requirements can evolve based on user feedback and
testing phases. Agile allows for such flexibility whereas models like Waterfall are too rigid,
requiring complete specification upfront.

2. User-Centric Design: Given the focus on user experience in banking apps, the Agile
model supports frequent revisions based on real user feedback obtained from testing UI/UX
elements in iterative cycles, ensuring the end product is highly user-friendly and meets
actual user needs.

3. Risk Management: Agile provides a continuous assessment of risks throughout the

development cycle. This is critical in financial applications where new security threats can
emerge, necessitating quick and effective responses that Agile supports better than
sequential approaches like Waterfall.

4. Speed to Market: The Agile methodology facilitates faster development and release of
functional components, which is essential for staying competitive in the fast-paced tech
25

landscape. This rapid deployment capability is less feasible with the Waterfall model,
which progresses in a linear, sequential phase and doesn’t suit projects needing quick
market entry.

5. Collaboration and Communication: The engaging, collaborative nature of Agile—

with daily stand-ups, sprint planning, reviews, and retrospectives—ensures all team
members are aligned and can contribute effectively, which is crucial given the
interdisciplinary nature of app development involving designers, developers, and
financiers.

In summary, the choice of Agile is highly aligned with the dynamic, user-centered, and
collaborative needs of developing a modern banking app. It accommodates continual
improvement, adapts to evolving project requirements, and ensures the product is both
high-quality and relevant upon release. This methodology not only drives the development
process but also enhances project outcomes through structured yet flexible practices.
 26
FINANCE MANAGER

CHAPTER 7

Software and
Hardware
Requirement
Specifications
27

Software and Hardware Requirement Specifications

7.1 Hardware Requirements:

The workstations should at least have the following configurations:

I. PENTIUM – III
II. 32 MB RAM

III. 40 GB HDD
Operating system required: Microsoft Windows 95 or 98 onwards.

7.2 Software Requirements:

The technologies required for the development of the banking application include:

Front-end Technologies:

● [Link]: A React framework that enables server-side rendering, improving the

performance and SEO of the web application.

● TypeScript: Used to add strong typing to the JavaScript codebase, enhancing code quality
and robustness.

● Tailwind CSS: A utility-first CSS framework that allows for highly customizable and
responsive UI design.

Back-end Technologies:

● Played: A leading banking API platform that allows the application to connect to real
banking services and functionalities, such as account linking, transaction retrieval, and
fund transfers.

● Airtable: An open-source platform used to build the application's backend, including the
database, functions, and storage, in a serverless manner.

Deployment and Monitoring:

● Vercel: A platform optimized for [Link] applications, which supports features essential
for CI/CD workflows and smooth deployment processes.

● Sentry: An enterprise-level application monitoring software that provides session replay

and performance analysis capabilities, ensuring the security and reliability of the banking
application.
28

Data Visualization:

● [Link]: A popular charting library used to create the various financial dashboards and
data visualizations within the banking application.

UI Components and Styling:

● Shadcn/ui: A component library built on top of Tailwind CSS, providing a wide range of
pre-built components for the application's user interface.

Development Tools:

● Visual Studio Code: A popular code editor used for the development of the application.

● Git and GitHub: Version control and collaboration tools used for managing the codebase.

● [Link] and npm: The JavaScript runtime and package manager used for installing and
managing the project dependencies.

This technology stack covers the essential components required for building a modern, secure,
and feature-rich banking application, including the front-end framework, styling, data
visualization, backend integration, deployment, and monitoring. The use of these software tools
and technologies ensures that the application can provide a seamless and reliable user experience
while also adhering to industry best practices and security standards.
 29
FINANCE MANAGER

CHAPTER 9

DATABASE
DESIGN
30

Database Design

9.1 Data Dictionary

The database design comprehensively addresses various essential features like user management,
bank account connectivity, transaction handling, and general application monitoring. Below is a
detailed look at the database schema, including the relationships between tables and the specific
types of data stored in each.

Database Schema Overview

1. Users Table

⮚ Purpose: Stores information about users who register on the platform.

⮚ Columns:
● `UserID`: Primary Key, uniquely identifies each user.
● `Username`: User's chosen username.
● `Password`: Hashed password for secure authentication.
● `Email`: User's email address for contact and recovery.
● `FullName`: User's full legal name.
● `AccountCreatedTimestamp`: Timestamp when the account was created.
⮚ Relationships:
● Primary relationship with the `BankAccounts`, `Transactions`, `ConnectedBanks`,
and `Logs` tables via `UserID`.

2. BankAccounts Table

⮚ Purpose: Contains details about each user's bank accounts stored or linked through the app.
⮚ Columns:
● `AccountID`: Primary Key, uniquely identifies each bank account.
● `UserID`: Foreign Key, links to the `Users` table to identify the account holder.
● `BankName`: Name of the bank.
● `AccountNumber`: Bank account number.
● `Balance`: Current balance in the account.
● `AccountType`: Type of account (e.g., checking, savings).
● `LastTransactionTimestamp`: Timestamp of the last transaction made.

⮚ Relationships:
● Direct relationship with the `Transactions` and `Transfers` tables for recording
transactions.
31

3. Transactions Table

⮚ Purpose: Tracks all transactions across all accounts.

⮚ Columns:
● `TransactionID`: Primary Key, a unique identifier for each transaction.
● `SenderID` and `ReceiverID`: Foreign Keys referencing `UserID` from the `Users`
table indicating the transaction parties.
● `Amount`: Monetary value of the transaction.
● TransactionType`: Type of transaction (deposit, withdrawal, transfer).
● `Timestamp`: Exact time the transaction was recorded.
⮚ Relationships:
● Reflects debit and credit activities of users between various accounts.

4. ConnectedBanks Table

⮚ Purpose: Keeps track of banks connected to the user accounts within the app.
⮚ Columns:
● `BankConnectID`: Primary Key, identifies each connection.
● `UserID`: Foreign Key, links to the `Users` table.
● `BankName`: Name of the connected bank.
● `BankAccountID`: Associated bank account identifier.
● `LastSyncTimestamp`: Last time the app synced with the bank account.
⮚ Relationships:
● Links users to their respective banking institutions stored in the app.

5. Transfers Table

⮚ Purpose: Manages transfer requests between accounts within the app.

⮚ Columns:
● `TransferID`: Primary Key, unique identifier for transfers.
● `SenderAccountID` and `ReceiverAccountID`: Foreign Keys, link to the
`BankAccounts` table to specify transfer paths.
● `Amount`: Transfer amount.
● `TransferStatus`: Current status of the transfer (Processing, Completed).
● `Initiation`: Timestamp when the transfer was initiated.
● `CompletionTimestamp`: Timestamp when the transfer was completed.
⮚ Relationships:
● Manages the flow of funds between bank accounts in the system.
32

6. SpendingCategories Table

⮚ Purpose: Categorizes transactions for better management and reporting.

⮚ Columns:
● `CategoryID`: Primary Key, identifies each category.
● `CategoryName`: Name of the category.
● `Description`: Description of what the category represents.
⮚ Relationships:
● Optional relationship for categorizing transactions in the `Transactions` table.

7. Logs Table

⮚ Purpose: General logging for application activities.

⮚ Columns:
● `LogID`: Primary Key, unique log identifier.
● `UserID`: Foreign Key, identifies the user associated with the log.
● `LogTimestamp`: Time when the log was recorded.
● `LogDetails`: Information about the log entry.
● `LogType`: Type of log (Error, Warning, Info).
⮚ Relationships:
● Helps in auditing and troubleshooting user activities.

Each table is designed to ensure robust data management and facilitate complex queries necessary
for a modern banking application, supporting essential features such as multi-bank connectivity,
transaction processing, fund transfers, user security, and operational insight through logging.

Relationship Between tables:

The relationships between the tables in the designed database schema for the banking app project
are structured to support efficient data storage, retrieval, and integrity. These relationships are
primarily based on foreign keys that link one table to another, establishing a clear path for joining
data across related entities. Here’s a detailed explanation of how tables are interconnected:
33

Figure 3: Entity Realtionship Diagram

1. Users and Other Tables

⮚ Relationship with BankAccounts: One-to-Many

o A single user can own multiple bank accounts but each bank account is linked to one
user.

o `[Link]` -> `[Link]`

⮚ Relationship with Transactions: One-to-Many

o A user can be involved in multiple transactions either as a sender or a receiver.

o `[Link]` -> `[Link]` and `[Link]`

⮚ Relationship with ConnectedBanks: One-to-Many

o Each user can connect multiple banks to their profile.

o `[Link]` -> `[Link]`

⮚ Relationship with Logs: One-to-Many

o -Various actions performed by a user can generate multiple log entries.

o `[Link]` -> `[Link]`

2. BankAccounts and Transactions

⮚ Relationship: One-to-Many
34

o Each bank account can have multiple transactions but each transaction is linked to
one bank account.

o `[Link]` -> `[Link]` and

`[Link]`

3. BankAccounts and Transfers

⮚ Relationship: One-to-Many
o Each bank account can be either the sender or the receiver in multiple transfer
records.

o `[Link]` -> `[Link]` and

`[Link]`

4. Transactions and SpendingCategories (If Transactions table has a category reference)

⮚ Relationship: Many-to-One

o Each transaction can be categorized under one spending category, though a

category may encompass multiple transactions.

o `[Link]` -> `[Link]`

This relationship is implied if transaction categorization is implemented.

Summary of Relationships:
- Primary keys in each table serve as unique identifiers for their respective entities.
- Foreign keys establish referential integrity, ensuring relationships are maintained correctly and
preventing orphan records or inconsistent data.
- Most relationships are One-to-Many, reflecting typical usage patterns in a banking application
where multiple transactions, accounts, and logs might associate with a single user or account.

This structured approach not only helps in maintaining data accuracy but also optimizes the
performance of the database by easing the process of data retrieval across related tables.

Below is a textual representation of the tables and their attributes for a banking app database
design, organized in a tabular format. This textual table layout provides an overview of each table
along with its key attributes and relationships to other tables.
 35

[Link]-TABLE:-

Attribute Data Type Description Relationship

UserID Integer Primary key, unique user identifier Primary Key

Username String User's username

Password String User's password

Email String User's email address

FullName String Full name of the user

AccountCreatedTimestamp Timestamp Timestamp when the account was created

[Link]-TABLE:-

Attribute Data Type Description Relationship

AccountID Integer Primary key, unique account identifier Primary Key

UserID Integer Identifier for the user owning the account Foreign Key to Users
Table

AccountNumber String Account number

AccountType String Type of account (e.g., savings, checking)

CreationDate Date Date when the account was opened

 36

3. Transactions Table:-

Attribute Data Description Relationship

Type

TransactionID Integer Primary key, unique transaction Primary Key

identifier

Sender Integer Account ID of the sender Foreign Key to BankAccounts Table

AccountID (sender)

Receiver Integer Account ID of the receiver Foreign Key to BankAccounts Table

AccountID (receiver)

Amount Decimal Amount of money transferred

TransactionDate Date Date when the transaction occurred

CategoryID Integer ID for the category of the Optional: Foreign Key to

transaction SpendingCategories Table

5. ConnectedBanks Table:-

Attribute Data Type Description Relationship

ConnectionID Integer Primary key, unique connection identifier Primary Key

UserID Integer Identifier for the user Foreign Key to Users Table

BankName String Name of the connected bank

6. Transfers Table:-

Attribute Data Type Description Relationship

TransferID Integer Primary key, unique transfer identifier Primary Key

Sender Integer Account ID of the sender Foreign Key to BankAccounts

AccountID Table

Receiver Integer Account ID of the receiver Foreign Key to BankAccounts

AccountID Table

Transfer Decimal Amount of money transferred

Amount

TransferDate Date Date when the transfer occurred

 37

6. SpendingCategories Table:-

Attribute Data Type Description Relationship

CategoryID Integer Primary key, unique identifier for each category Primary Key

CategoryName String Name of the spending category

This layout visually organizes the information about the database schema in a manner similar to
how it might appear in a diagrammatic ERD, but in a text-based table format suitable for textual
presentation.
 38

Results

⮚ Interface :

Figure 4 : Sign up page

Figure 5 : Log in page

39

Figure 6:Transaction history Page

Figure 7: Dashboard
 40
FINANCE MANAGER
Figure 7 : Dashboard

CHAPTER 10

Conclusion
41

Conclusion

To enhance the scalability of our banking application built with [Link], we can implement several
advanced strategies that focus on optimizing performance, handling increased loads efficiently,
and ensuring the application can grow without significant performance bottlenecks. Here's how
we can improve the scalability further:

⮚ Server-Side Optimization
● Incremental Static Regeneration (ISR): Utilize [Link]'s ISR to regenerate pages
on-demand after deployment. This method offers a balance between static
generation and server-side rendering, reducing the load on the server while
providing up-to-date content.

● Edge Functions: Leverage Vercel Edge Functions for dynamic computations at the
edge closer to the user's location, effectively decreasing latency and server load.

⮚ Database Optimization
● Database Indexing: Ensure that the database queries are indexed effectively,
which can drastically reduce the query response time as the volume of data grows.

● Read Replica Databases: Implement read replica databases to distribute the read
load evenly, especially useful if the application features heavy read operations.

⮚ Microservices Architecture
● Dividing Monolith: Transition from a monolith to a microservices architecture,
where different services can handle different tasks such as authentication,
transaction processing, and user profile management independently.

● API Gateway: Use an API Gateway to handle requests and direct them to the
appropriate microservice, which can improve the handling of increased traffic and
enhance security measures.

⮚ Load Balancing
● Implement Load Balancers: Utilize load balancers to distribute incoming network
traffic across multiple servers or instances. This ensures no single server bears too
much load, which can prevent server overloads and enhance the redundancy of the
application.

⮚ Caching Mechanisms
● Client-Side Caching: Implement client-side caching to store frequently accessed
data on the client side, reducing the number of requests to the server.
42

● Distributed Caching: Use distributed caching solutions like Redis to cache

common queries and data, reducing the load on the database and speeding up
response times.

⮚ Asynchronous Processing
● Queuing Systems: Incorporate a message queuing system such as RabbitMQ or
Kafka to handle asynchronous processing of tasks such as sending notifications or
processing transactions, which helps in managing the workload more efficiently.

⮚ Code Optimization
● Efficient Algorithms: Review and optimize the backend algorithms to ensure they
are efficient in terms of complexity and resource utilization.

● Code Splitting in [Link]: Utilize [Link]'s automatic code splitting feature, which
loads only the necessary code for rendering the viewed page, thereby reducing the
amount of code transferred over the network.

⮚ Scalable Hosting Options

● Auto-Scaling Capabilities: Ensure that the hosting solution provides auto-scaling
capabilities to automatically adjust the number of active servers according to the
load without manual intervention.

⮚ Monitoring and Continuous Optimization

● Real-time Monitoring Tools: Implement tools like Sentry for real-time application
monitoring and to gain insights into how the application performs in production.

● Frequent Audits and Updates: Regularly audit the application for performance
issues and keep all frameworks and libraries updated to their latest versions to take
advantage of performance improvements and security patches.
By implementing these strategies, the scalability of the banking application can be significantly
enhanced, ensuring it remains robust and responsive as usage grows. This proactive approach to
scalability will cater to a growing number of users smoothly and maintain the application's
reliability in the face of increasing demand.
 43

FINANCE MANAGER

CHAPTER 10

Future Works
44

Future works

Looking ahead, there are several enhancements and new features that could
significantly increase the app's utility, user base, and overall impact in the fintech
sector. Here are some of the envisioned future works and scope expansions for the
project:

1. Artificial Intelligence and Machine Learning Integration:

10 Personalized Financial Advice: Implement AI algorithms to analyze users'

spending habits and offer personalized budgeting and investment advice.

11 Fraud Detection: Use machine learning models to detect and alert users and
administrators about unusual transaction patterns that may indicate fraudulent
activity.

2. Enhanced User Customization:

● Allow users to customize the dashboard and settings according to their

preferences, which could include themes, layouts, and frequently used
functions.

● Implement widgets that users can add or remove from their dashboard, such
as currency converters, investment updates, or financial news.

3. Broader Financial Services Integration:

● Insurance and Loans: Expand the app’s capabilities to include services such
as loan applications and management, as well as options to browse and
purchase insurance policies.

4. Multi-platform Accessibility:

● Develop mobile versions of the app for iOS and Android to provide users
with on-the-go access to their financial information and services.

● Ensure the app's responsiveness and functionality across all devices and
platforms, enhancing user engagement through seamless experience
continuity.
45

5. Advanced Security Features:

● Introduce biometric authentication options, like fingerprint and facial

recognition, to provide enhanced security for accessing sensitive financial
information.

● Implement more rigorous multi-factor authentication processes for high-

value transactions.

6. Global Expansion:

● Localize the app for different markets by adding multi-language support and
integrating region-specific financial services and regulations.

● Partner with international banks and financial institutions to facilitate global

transactions and currency exchanges without high fees.

7. Community and Support:

● Build an in-app community forum where users can share financial tips, ask
questions, and get advice from financial experts.

● Enhance customer support with chatbots and a more responsive helpdesk,

capable of handling common queries and troubleshooting without human
intervention.

8. Sustainable Finance:

● Integrate features that help users invest in green and sustainable projects,
promoting environmentally friendly investment opportunities.

● Provide analytics and insights on how personal or corporate finance choices

impact environmental targets.

9. API Marketplace:

● Develop an API marketplace for developers to create and sell their own plug-
ins or integrations, expanding the app’s capabilities and customization
options.
46

10 Cryptocurrency Capabilities:

● Crypto Wallet Integration: Include a cryptocurrency wallet that supports

major coins and allows users to perform transactions and track their crypto
investments.

● Crypto Exchange Features: Facilitate buying, selling, and exchanging

cryptocurrencies directly within the app.

By addressing these areas, Finance Manager can not only enhance its value
proposition but also stay ahead in the competitive fintech market, continually
adapting to user needs and technological advancements. This forward-looking
approach will ensure that Finance Manager remains a relevant and preferred tool in
the landscape of financial [Link] needs for accessibility, security, and user
engagement. By documenting the process, from ideation through development, this
endeavor serves as an instructive exemplar for the development of future fintech
solutions, emphasizing practical implementation of theoretical knowledge and
modern programming paradigms.
 47

FINANCE MANAGER

CHAPTER
11

Appendices
 48

Appendices

⮚ List of Technical Terms :

● [Link] - A React framework for building server-rendered React applications.

● [Link] - A JavaScript library for building user interfaces.

● Tailwind CSS - A utility-first CSS framework for rapidly building custom designs.

● Shat CN - A component library built on top of Tailwind CSS.

● [Link] - A JavaScript runtime environment for server-side development.

● [Link] - A web application framework for [Link]. • MongoDB - A NoSQL database

for storing and managing application data.

● Mongoose - An Object Data Modeling (ODM) library for MongoDB and [Link].

● Plaid API - A financial data aggregation platform that connects bank accounts.

● Sentry - An application monitoring and error tracking platform.

● JWT (JSON Web Tokens) - An open standard for securely transmitting information.

● GDPR (General Data Protection Regulation) - A set of data privacy laws.

● PCI DSS (Payment Card Industry Data Security Standard) - A security standard for
organizations that handle branded credit cards.

● UX/UI - User Experience and User Interface design.

● CI/CD (Continuous Integration/Continuous Deployment) - A software development
practice.

● SaaS (Software as a Service) - A software licensing and delivery model.

● API (Application Programming Interface) - A set of protocols and tools for building
software applications. • DFD (Data Flow Diagram) - A visual representation of the flow of
data within a system.
 49

⮚ List of Abbreviations

The following is a list of abbreviations used throughout the documentation for the Finance
Manager Banking App project:

● GUI - Graphical User Interface

● API - Application Programming Interface
● IoT - Internet of Things
● CSS - Cascading Style Sheets
● SQL - Structured Query Language
● HTML5 - The fifth version of HTML
● UX - User Experience
● CI/CD - Continuous Integration/Continuous Deployment
● SaaS - Software as a Service
● ML - Machine Learning
● AI - Artificial Intelligence
● DNS - Domain Name System
● JWT - JSON Web Tokens
● GDPR - General Data Protection Regulation
● PCI DSS - Payment Card Industry Data Security Standard
● DFD - Data Flow Diagram
● ERD - Entity Relationship Diagram

These abbreviations are used throughout the project documentation to provide concise references
to common technical terms and concepts related to the Finance Manager App.
 50

Finance Manager

CHAPTER
12 Bibliography
51

Bibliography

1. [Link] Documentation: [[Link]

- Official documentation for the [Link] framework, covering key features, setup, and best
practices.

2. [Link] Documentation: [[Link]

- Comprehensive guide to the [Link] library, including fundamentals, components, and state
management.

3. Tailwind CSS Documentation: [[Link]

- In-depth documentation for the Tailwind CSS utility-first CSS framework.

4. Shat CN Documentation: [[Link]

- Official documentation for the Shat CN React component library.

5. Plaid API Documentation: [[Link]

- Technical reference for integrating the Plaid financial data aggregation platform.

6. Sentry Documentation: [[Link]

- Comprehensive guide to using the Sentry application monitoring and error tracking tool.

7. MongoDB Documentation: [[Link]

- Official documentation for the MongoDB NoSQL database, including the Mongoose ODM.

8. [Link] Documentation: [[Link]

- API reference for the [Link] web application framework for [Link].

9. JWT Documentation: [[Link]

- Overview and usage guide for JSON Web Tokens, a standard for secure data transmission.

10. GDPR Documentation: [[Link]

- Information and resources on the General Data Protection Regulation, a set of data privacy
laws.

11. PCI DSS Documentation: [[Link]

- Details on the Payment Card Industry Data Security Standard, a security standard for
organizations handling credit card data.

This bibliography provides a comprehensive list of references and resources used in the
development and documentation of the Finance Manager App project, covering the key
technologies, frameworks, and industry standards involved.