Aim : - Create a complete application using Angular JS , Node JS ,Express

& MongoDB.
Project Title : - Loan Manager
Description : -
The Loan Manager Web Application is designed to streamline the loan processing workflow
for financial institutions or individuals. It facilitates the management of borrowers, loan
issuance, repayment tracking, interest calculations, and reporting. The application provides
an intuitive interface for users to monitor and manage loans efficiently.

Members : -
Patanee Gopal S. ( 220170116029 )
Pansuriya Yash P. ( 220170116028 )
Jadeja Brijrajsinh S. ( 220170116019 )

Frontend (AngularJS) – Loan Manager Web App

The frontend of the application is built using AngularJS to provide a dynamic and interactive
user experience. The following pages are available : -

• Register Page : - Allows new users to sign up.

• Login Page : - Authenticate user and issue token.
• Dashboard Page : - Shows the user's loan summary and actions.
• ApplyLoan Page : - Allows users to submit a loan request.
• AdminLoan Page : - Allow admin to manage all loan applications.

Backend (Node.js + Express.js + MongoDB)

The backend is structured into the following folders : -

1. Models : -

Contains Mongoose schemas for : -

• User Model : - Stores user credentials and personal info.

54
2. Routes : -

All the API routes are defined here. Each route handles logic related to :

POST /api/login
• Purpose: Authenticate user and issue JWT.

GET /api/user/loans
• Purpose: Fetch loans for the logged-in user.
• Header: Authorization: Bearer JWT_TOKEN

POST /api/user/loans
• Purpose: Submit a new loan application.

GET /api/admin/loans
• Purpose: Get all loan applications (admin only).

PUT /api/admin/loans/:id
• Purpose: Approve or reject a loan

Features & Functionality

Dashboard

• View current loans and their status.

• Display of basic loan information:

Apply for a Loan

• Form to request a new loan.

• Fields include amount, duration (in months), and purpose.
• Form validation with user feedback.
• Loan saved with status "Pending" for admin approval

View Loan History

• Users can view a list of their past and current loans.

• Status shown as: Pending, Approved, or Rejected.

55
Programs : -

backend : -
routes : -
auth.js : -
const express = require("express");
const router = express.Router();
const jwt = require("jsonwebtoken");
const bcrypt = require("bcryptjs");
const User = require("../models/User");

// jwt 's key for security

const JWT_SECRET = "loanmanager123secure@key";

// Register matenu page

router.post("/register", async (req, res) => {
const { username, email, password } = req.body;

try {
const userExist = await User.findOne({ email });
if (userExist) return res.status(400).json({ msg: "User already exists" });

const user = new User({ username, email, password });

await user.save();

res.json({ msg: "User registered successfully" });

} catch (err) {
res.status(500).json({ msg: "Server error" });
}
});

// Login
router.post("/login", async (req, res) => {
const { email, password } = req.body;

try {
const user = await User.findOne({ email });
if (!user) return res.status(400).json({ msg: "Invalid credentials" });

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

if (!isMatch) return res.status(400).json({ msg: "Invalid password credentials" });

const token = jwt.sign({ id: user._id, role: user.role }, JWT_SECRET, {

expiresIn: "1h",
});

56
 res.json({
token,
user: { id: user._id, username: user.username, role: user.role },
});
} catch (err) {
res.status(500).json({ msg: "Server error" });
}
});

module.exports = router;

loan.js

const express = require("express");

const router = express.Router();
const Loan = require("../models/Loan");
const jwt = require("jsonwebtoken");
const User = require("../models/User");

const JWT_SECRET = "loanmanager123secure@key";

// Middleware to verify token

function authMiddleware(req, res, next) {
const token = req.headers["authorization"];
if (!token) return res.status(401).json({ msg: "No token provided" });

const tokenParts = token.split(" ");

if (tokenParts.length !== 2 || tokenParts[0] !== "Bearer") {
return res.status(401).json({ msg: "Token format invalid" });
}

jwt.verify(tokenParts[1], JWT_SECRET, (err, decoded) => {

if (err) return res.status(401).json({ msg: "Token is invalid" });
req.user = decoded;
next();
});
}

// Apply for Loan (User)

router.post("/", authMiddleware, async (req, res) => {
const { amount, interestRate, term } = req.body;
try {
const newLoan = new Loan({
user: req.user.id,
amount,
interestRate,
term,

57
 });
await newLoan.save();
res.json({ msg: "Loan application submitted", loan: newLoan });
} catch (err) {
res.status(500).json({ msg: "Server error" });
}
});

// Get My Loans (User)

router.get("/my", authMiddleware, async (req, res) => {
try {
const loans = await Loan.find({ user: req.user.id });
res.json(loans);
} catch (err) {
res.status(500).json({ msg: "Server error" });
}
});

// Admin: Get All Loans

router.get("/", authMiddleware, async (req, res) => {
if (req.user.role !== "admin") {
return res.status(403).json({ msg: "Access denied" });
}

try {
const loans = await Loan.find().populate("user", "username email");
res.json(loans);
} catch (err) {
res.status(500).json({ msg: "Server error" });
}
});

// Admin: Approve Loan

router.put("/:id/approve", authMiddleware, async (req, res) => {
if (req.user.role !== "admin") {
return res.status(403).json({ msg: "Access denied" });
}

try {
const loan = await Loan.findById(req.params.id);
if (!loan) return res.status(404).json({ msg: "Loan not found" });

loan.status = "approved";
await loan.save();
res.json({ msg: "Loan approved" });
} catch (err) {
res.status(500).json({ msg: "Server error" });

58
 }
});

// Admin: Reject Loan

router.put("/:id/reject", authMiddleware, async (req, res) => {
if (req.user.role !== "admin") {
return res.status(403).json({ msg: "Access denied" });
}

try {
const loan = await Loan.findById(req.params.id);
if (!loan) return res.status(404).json({ msg: "Loan not found" });

loan.status = "rejected";
await loan.save();
res.json({ msg: "Loan rejected" });
} catch (err) {
res.status(500).json({ msg: "Server error" });
}
});

module.exports = router;

frontend : -
Dashboard.html : -
<div class="d-flex justify-content-center align-items-center vh-100" style="background:
#eef2f7;">
<div class="card shadow p-5 text-center" style="width: 500px; border-radius: 1.5rem;">
<div class="card-body">
<h2 class="card-title mb-4">Welcome to <span style="color:#007bff;">Loan
Manager</span></h2>

<div class="d-flex flex-column gap-3">

<button
class="btn btn-primary btn-lg"
ui-sref="applyLoan"
ng-if="isUser"
style="border-radius: 0.5rem;"
>
Apply for Loan
</button>

<button
class="btn btn-info btn-lg"
ui-sref="adminLoans"

59
 ng-if="isAdmin"
style="border-radius: 0.5rem;"
>
Admin View
</button>
</div>

<hr class="my-4" />

<button class="btn btn-outline-danger btn-sm" ng-click="logout()" style="border-radius:

0.5rem;">
Logout
</button>
</div>
</div>
</div>

adminLoan.html
<div class="container mt-5">
<div class="card shadow-lg p-4" style="border-radius: 1rem;">
<div class="card-body">
<h2 class="card-title text-center mb-4" style="color: #007bff;">Admin Loan
Management</h2>

<div class="table-responsive">
<table class="table table-bordered table-hover align-middle text-center">
<thead class="thead-dark">
<tr>
<th>User</th>
<th>Amount</th>
<th>Interest</th>
<th>Term</th>
<th>Status</th>
<th>Applied On</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="loan in allLoans">
<td>{{loan.user.username}}</td>
<td>${{loan.amount}}</td>
<td>{{loan.interestRate}}%</td>
<td>{{loan.term}} months</td>
<td>
<span class="badge" ng-class="{
'badge-secondary': loan.status === 'Pending',
'badge-success': loan.status === 'approved',

60
 'badge-danger': loan.status === 'rejected'
}" style="text-transform: uppercase;font-weight: bold;" >
{{loan.status}}
</span>
</td>
<td>{{loan.createdAt | date:'short'}}</td>
<td>
<button
class="btn btn-success btn-sm mb-1"
ng-click="approveLoan(loan._id)"
ng-disabled="loan.status !== 'Pending'"
style="width: 80px;"
>
Approve
</button>
<button
class="btn btn-danger btn-sm"
ng-click="rejectLoan(loan._id)"
ng-disabled="loan.status !== 'Pending'"
style="width: 80px;"
>
Reject
</button>
</td>
</tr>
</tbody>
</table>
</div> </div> </div> </div>

Output : -

61
Rubric Wise Marks Obtained : -

Problem Problem Clarity Of

Understanding Analysis Program Code Documentation Total
Rubrics
(1) (10)
(2) (3) (4)

Marks

62