Project Report

On

MINI LOAN CALCULATOR

Submitted By

Guided by
Prof.

DEPARTMENT OF INFORMATION TECHNOLOGY

PRIYADARSHINI COLLEGE OF ENGINEERING, NAGPUR
SESSION 2014-15

DEPARTMENT OF INFORMATION TECHNOLOGY

PRIYADARSHINI COLLEGE OF ENGINEERING
1
 NAGPUR-440019

Certificate
This is to certify that the BE project seminar entitled

ONLINE LOAN MANAGEMENT SYSTEM

Submitted By

In the partial fulfillment of the requirement for the degree of

‘Bachelor of Engineering’ in Information Technology of
Priyadarshini College of Engineering, Nagpur
is bonafide work carried under guidance and supervision.

Principal
Guide P.C.E., Nagpur H.O.D ( IT)

External Examiner

2
 Acknowledgement

We have a great honor to acknowledge Dr. M. P.Singh, Principal,

Priyadarshini College of Engineering, Rashtrasant Tukdoji Maharaj Nagpur
University, and Nagpur, who had given us his consent to carry out this project.
We am very much delighted to voice my gratitude and indebtedness to Prof.
N. R. Hatwar, Head of Department of Information Technology, Rashtrasant Tukdoji
Maharaj Nagpur University, Nagpur, who had given us his consent to carry out this
Project.
We feel immense pleasure and privilege in expressing my deep sense of
gratitude towards my Guide Prof. Pranjal S. Bogawar and Project Incharge
Mrs.Mrudula M. Gudadhei, whose valuable guidance and critical analysis of my
result has led to successful completion of our project.
Our special thanks to all my Friends for giving me incentive support in this
report work.
We express our indebtedness and our gratitude to our affectionate and
loving family and friend for encouragement and enthusiastic support throughout
this study.
We thank to our respected parents, whose patience and support was
instrumental in accomplishing this task.

3
 Abstract

In today's fast-paced world, loans are an essential part of financial

management. People frequently require loans for various purposes

such as education, business, home improvement, or personal

reasons. However, before applying for a loan, it is necessary to

determine the amount to be borrowed, the interest rate, and the

repayment period. The Mini Loan Calculator is a web-based tool that

aims to provide users with quick and easy loan calculations. The

project is developed using Next JS technology, which allows for the

creation of dynamic web pages with server-side rendering.

Table of Contents

4
1. Introduction
2. Objective
3. Methodology
4. Technologies
5. Features
6. Expected Outcomes
7. Conclusion
8. Bibliography
9. Appendix A
Appendix B

Introduction

5
The Mini Loan Calculator is a web-based tool that aims to

provide users with quick and easy loan calculations. The

tool helps users determine the amount of loan they can

borrow, the interest rate, and the repayment period. The

Mini Loan Calculator is designed to be user-friendly and

easy to use. The user interface is simple and

straightforward, and the user can input the loan amount,

interest rate, and repayment period to get instant results.

Objective

6
The primary objective of this project is to develop a Mini

Loan Calculator that can perform quick and easy loan

calculations. The Mini Loan Calculator will provide users

with the ability to determine the loan amount, interest

rate, and repayment period. The project will use Next JS

technology, which will allow for the creation of dynamic

web pages with server-side rendering. The project will also

be designed to be user-friendly and easy to use.

Methodology

7
The Mini Loan Calculator project will be developed using

Next JS technology. Next JS is a popular React framework

that allows for the creation of dynamic web pages with

server-side rendering. The project will use Next JS

components such as pages, API routes, and dynamic

routing to create a dynamic and user-friendly web

application.

The Mini Loan Calculator will be designed to be simple and

straightforward. The user will input the loan amount,

interest rate, and repayment period into the calculator.

The tool will then perform the necessary calculations and

provide the user with the monthly payment amount, total

interest, and total repayment amount.

Technologies
8
Next JS is a popular React framework that allows for the

creation of dynamic web pages with server-side rendering.

Next JS provides many features such as automatic code

splitting, static file serving, and server-side rendering. The

Mini Loan Calculator project will use Next JS components

such as pages, API routes, and dynamic routing to create a

dynamic and user-friendly web application.

Features

9
The Mini Loan Calculator is a web-based tool that provides

users with quick and easy loan calculations. The following

are the features of the Mini Loan Calculator:

User-friendly interface: The Mini Loan Calculator is

designed to be simple and straightforward, with a user-

friendly interface.

Loan amount calculation: The calculator allows the user to

input the loan amount and calculates the monthly

payment, total interest, and total repayment amount.

Interest rate calculation: The calculator allows the user to

input the interest rate and calculates the monthly

payment, total interest, and total repayment amount.

10
Repayment period calculation: The calculator allows the

user to input the repayment period and calculates the

monthly payment, total interest, and total repayment

amount.

Dynamic web application: The project is developed using

Next JS technology, which allows for the creation of

dynamic web pages with server-side rendering.

Expected Outcomes

The Mini Loan Calculator project aims to provide users

with a quick and easy tool to calculate loan amounts,

11
interest rates, and repayment periods. The expected

outcomes of the project are:

To create a user-friendly Mini Loan Calculator with a

simple and straightforward interface.

To allow users to input loan amount, interest rate, and

repayment period, and get instant results.

To develop a dynamic web application that provides

accurate loan calculations.

To create a project that can be easily modified and

extended to include additional features in the future.

12
 Conclusion

The Mini Loan Calculator is a web-based tool that provides

users with quick and easy loan calculations. The project is

developed using Next JS technology, which allows for the

creation of dynamic web pages with server-side rendering.

The Mini Loan Calculator is designed to be user-friendly

and easy to use, with a simple and straightforward

13
interface. The expected outcomes of the project are to

provide users with an accurate and efficient tool to

calculate loan amounts, interest rates, and repayment

periods.

Bibliography

Praveen Kumar https://codingmstr.com

Next JS Documentation. (2021). Retrieved from

https://nextjs.org/docs/getting-started
React Documentation. (2021). Retrieved from
https://reactjs.org/docs/getting-started.html
W3Schools. (2021). HTML Tutorial. Retrieved from
https://www.w3schools.com/html/default.asp
W3Schools. (2021). CSS Tutorial. Retrieved from
https://www.w3schools.com/css/default.asp
14
 Appendix A

import { useState } from "react";

import { Typography, Button, Box, TextField } from
"@mui/material";
import Grid from "@mui/material/Grid";
import { ToastContainer, toast } from "react-toastify";
import "react-toastify/dist/ReactToastify.css";
import Table from "@mui/material/Table";
import TableBody from "@mui/material/TableBody";
import TableCell from "@mui/material/TableCell";
15
import TableContainer from
"@mui/material/TableContainer";
import TableRow from "@mui/material/TableRow";
import Paper from "@mui/material/Paper";
import FormControl from "@mui/material/FormControl";
import Container from "@mui/material/Container";
import Card from "@mui/material/Card";

export default function LoanCalculator() {

const [amount, setAmount] = useState(0);
const [interest, setInterest] = useState(0);
const [time, setTime] = useState(0);
const [emi, setEmi] = useState(0);
const [totalinterest, setTotalinterest] = useState(0);
const [principal, setPrincipal] = useState(0);

const handlePrincipalchange = (event) => {

setPrincipal(event.target.value);
};
const handleInterestchange = (event) => {
setInterest(event.target.value);
};
const handleTimechange = (event) => {
setTime(event.target.value);
};

16
 const calculateLoan = () => {
if (principal > 0 && interest > 0 && time > 0) {
let p = parseFloat(principal);
let r = parseFloat(interest);
let n = parseFloat(time);

let actualRate = parseFloat(r / 12 / 100);

let calcemi =
p*
actualRate *
(Math.pow(1 + actualRate, n) / (Math.pow(1 +
actualRate, n) - 1));

setEmi(Math.round(calcemi));
setAmount(Math.round(calcemi * n));
setTotalinterest(Math.round(calcemi * n - p));
} else {
toast.error("Amount, Interest and Period must be
greater than 0!", {
position: "top-right",
autoClose: 5000,
hideProgressBar: true,
toastId: "id",
closeOnClick: true,
pauseOnHover: true,

17
 draggable: true,
progress: undefined,
});
}
};

return (
<>
<ToastContainer />
<Box sx={{ m: 10 }} />
<Container>
<Card>
<div style={{ overflowY: "auto", padding:
"40px" }}>
<Typography variant="h5" align="center">
Loan Calculator
</Typography>
<Box sx={{ m: 2 }} />
<Grid container spacing={2}>
<Grid item md={6} xs={12}>
<Box sx={{ m: 2 }} />
<TextField
label="Enter loan Amount"
type="number"
variant="outlined"
name="loan_amount"

18
 onChange={handlePrincipalchange}
value={principal}
sx={{ minWidth: "92%" }}
/>
<Box sx={{ m: 2 }} />
<TextField
label="Enter interest rate"
variant="outlined"
type="number"
name="interest_rate"
onChange={handleInterestchange}
value={interest}
sx={{ minWidth: "92%" }}
/>
<Box sx={{ m: 2 }} />
<TextField
label="Enter loan period in month"
variant="outlined"
type="number"
name="loan_period_in_month"
onChange={handleTimechange}
value={time}
sx={{ minWidth: "92%" }}
/>
<Box
m={1}
19
 display="flex"
justifyContent="center"
alignItems="center"
>
<FormControl
size="large"
align="center"
style={{ marginTop: "10px" }}
>
<Button
variant="outlined"
size="large"
onClick={calculateLoan}
>
Calculate
</Button>
</FormControl>
</Box>
</Grid>
<Grid
item
md={6}
xs={12}
alignItems="center"
justifyContent="center"
>
20
 <Box sx={{ m: 2 }} />
<TableContainer component={Paper}>
<Table aria-label="simple table">
<TableBody>
<TableRow>
<TableCell align="center">
<Typography variant="p">Loan
EMI</Typography>
<Box sx={{ m: 1 }} />
<Typography variant="h6"
className="font-bold">
$ {emi}
</Typography>
</TableCell>
</TableRow>
</TableBody>
</Table>
</TableContainer>
<Box sx={{ m: 2 }} />
<TableContainer component={Paper}>
<Table aria-label="simple table">
<TableBody>
<TableRow>
<TableCell align="center">
<Typography variant="p">
Total Interest Payable

21
 </Typography>
<Box sx={{ m: 1 }} />
<Typography variant="h6"
className="font-bold">
$ {totalinterest}
</Typography>
</TableCell>
</TableRow>
</TableBody>
</Table>
</TableContainer>
<Box sx={{ m: 2 }} />
<TableContainer component={Paper}>
<Table aria-label="simple table">
<TableBody>
<TableRow>
<TableCell align="center">
<Typography variant="p">
Total Payment (Principal + Interest)
</Typography>
<Box sx={{ m: 1 }} />
<Typography variant="h6"
className="font-bold">
$ {amount}
</Typography>
</TableCell>

22
 </TableRow>
</TableBody>
</Table>
</TableContainer>
</Grid>
</Grid>
<Box sx={{ m: 4 }} />
</div>
</Card>
</Container>
</>
);
}

Appendix B
23
Snapshots

24