MICRO-PROJECT

Develop a Tempreature Convertor using Java

Submitted- 2024-25

This micro-project work submitted in partial fulfillment of requirements for the award
of diploma in Computer Technology for subject "Advance Java Programming
(AJP)".

Computer Engineering

Maharashtra State Board of Technical Education,

Mumbai UNDER THE GUIDANCE OF

Prof. Ashirwad Ramteke

Lect. In Computer Technology

SUBMITTED BY

Sr
no. Roll no. Name of Student Enrollment no.
1. 40 Kshitij N. Sangole 2201210154
 DEPARTMENT OF COMPUTER ENGINEERING

GOVERNMENT POLYTECHNIC, BRAMHAPURI DIST CHANDRAPUR

DEPARTMENT OF COMPUTER ENGINEERING
Certificate

This is to certify that the following student of this institute have carried out this micro-
project in work “Develop a Temperature Convertor using Java” Under the guidance
of Prof. Ashirwad Ramteke Lect. in the Department of Computer Engineering
during the session 2024-2025 This work has been in the partial fulfillment of the award
for Diploma in Computer Engineering from Maharashtra State Board of Technical
Education, Mumbai.

SUBMITTED BY

Sr no. Roll no. Name of Student Enrollment no.

1 40 Kshitij N. Sangole 2201210154

Project Guide Head of department Principle

Prof. Ashirwad Ramteke Prof. S. K. Kharkate Dr. R. L. Wankhade

 Part-A

1. Aim of micro project: -

Expense Tracker Using HTML, CSS & JS

2. Brief introduction:
The “Expense Tracker” is a simple web application built with HTML, CSS and JS
to help user manage and track their daily Expenses. It allow user to add, view and
categorize expenses, providing a clear overview of spending.

3. Course Outcome:
a) Create interactive web page using program flow control structure.

b) Create event based web forms using Javascript.

4. Literature Review:
The increasing demand for personal finance management tools has led to the
development of web applications that facilitate budgeting and expense tracking.
Studies highlight that digital expense trackers significantly enhance financial
literacy by providing users with real-time insights into their spending habits.
Utilizing HTML, CSS, and JavaScript, developers can create interactive and user-
friendly interfaces, making it easier for individuals to manage their finances.
Previous research demonstrates that these technologies effectively support
customizable budgeting solutions that cater to diverse user needs. This literature
underscores the importance of web-based expense trackers in empowering users
while offering valuable learning opportunities in web development.

5. Proposed methodology:
 Discuss the topic with the subject teacher.
 Refer to the books called “HTML, CSS, and JavaScript programming books"
to understand basic concepts.
 Collect all the required resources for building the Expense Tracker.
 Start working on Part A of the micro project.
 Proceed with Part B after Part A completion.
 HTML:
 Create a form for expense name and amount inputs.
 Add a button to submit expenses and a table to display them.
 Include a section to show the total expense.
CSS:
 Style the form, table, and total display for a clean and responsive layout.
JavaScript:
 Capture input values, add expenses to the table, update the total, and enable
deleting expenses.

Algorithm:
1. Step 1: Initialize totalExpense to 0.
2. Step 2: Add Expense
o Get name and amount from input fields.
o Check if name is not empty and amount is a positive number.
o If valid:
1. Add a new row to the table with name, amount, and a delete button.
2. Update totalExpense by adding the amount.
3. Call updateTotalExpense() to refresh the total on the screen.
o If invalid, show an alert message.
3. Step 3: Update Total Expense
o Display the updated totalExpense on the page.
4. Step 4: Download Expense Sheet:
o Gather all expenses, format the data (including name, amount, and date).
o Create a downloadable .txt file with the expense data.
o Trigger the download process in the browser.
 6. Action plan:

Sr. Detail of Activity Start Finish Name of student

no. Date Date
1 Search for topic Kshitij N. Sangole

2 Information search and Kshitij N. Sangole

resource collected
3 Implement part-A Kshitij N. Sangole
4 Work over project Kshitij N. Sangole

5 Implement part-B Kshitij N. Sangole

6 Submission of final Kshitij N. Sangole

report

7. Resource required:

Sr. Name of
no. resource/material Specification Quantity Purpose

1. Internet Gives information As per To get

requirement information- on
and pictures.
2. Laptop Lenovo IdeaPad 3 1 To make micro
project.
3. Software Visual Studio Code 1 To develop the
program
 Part B

1. Rational:
The Expense Tracker project aims to address the critical need for personal finance
management by providing a user-friendly web application for tracking expenses. Using
HTML and CSS, the application will offer an intuitive interface that allows users to
easily input and manage their expenses. JavaScript will enable real-time data handling
and calculations, ensuring a smooth user experience.

2. Aim of Micro-project:
Develop an Expense Tracker by using HTML, CSS and JavaScript

3. Course outcomes Achieved:

a) Create interactive web page using program flow control structure.

b) Create event based web forms using Javascript.

4. Actual Methodology followed:

 Discuss the topic with the subject teacher.

 Refer to the books called “HTML, CSS, and JavaScript programming books"
to understand basic concepts.
 Collect all the required resources for building the Expense Tracker.
 Start working on Part A of the micro project.
 Proceed with Part B after Part A completion.

HTML:
 Create a form for expense name and amount inputs.
 Add a button to submit expenses and a table to display them.
 Include a section to show the total expense.
CSS:
 Style the form, table, and total display for a clean and responsive layout.
JavaScript:
 Capture input values, add expenses to the table, update the total, and enable
deleting expenses.
 Algorithm:
1. Step 1: Initialize totalExpense to 0.
2. Step 2: Add Expense
o Get name and amount from input fields.
o Check if name is not empty and amount is a positive number.
o If valid:
1. Add a new row to the table with name, amount, and a delete button.
2. Update totalExpense by adding the amount.
3. Call updateTotalExpense() to refresh the total on the screen.
o If invalid, show an alert message.
3. Step 3: Update Total Expense
o Display the updated totalExpense on the page.
4. Step 4: Download Expense Sheet:
o Gather all expenses, format the data (including name, amount, and date).
o Create a downloadable .txt file with the expense data.
o Trigger the download process in the browser.

5. Resources used:
Name of Specification
Resource/Material
Laptop Intel i5, 8 GB RAM, 512 GB

Software VS Code, MS-Word, Chrome Browser, etc.

Other Accessories Reference Book

6. Skill Developed:
1. Problem-Solving Skills: Critical thinking and creativity will be applied to
develop rational pollution solutions.

2. Communication Skills: Articulate findings and solutions clearly in writing

and presentations.

3. Time Management: Meeting project deadlines will require strong

time management abilities.

4. Information Literacy: Proficiency in evaluating source credibility will be

developed.

5. Critical Thinking: Students will assess pollution causes and solutions critically.
7. Project Code: -
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Expense Tracker</title>
<style>
body,
form,
#expenses {
font-family: 'Segoe UI', Tahoma, Geneva, sans-serif;
margin: 0;
padding: 1em;
background: #f0f0f0;
}

header,
th,
button {
background: #333;
color: #fff;
text-align: center;
}

#expenses,
form {
width: 60%;
margin: 2em auto;
background: #fff;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

table {
width: 100%;
margin-top: 1em;
border-collapse: collapse;
}

th,td {
border: 1px solid #ddd;
padding: 12px;
text-align: left;
}
 label,
input,
button {
display: block;
margin-bottom: 1em;
}

button {
padding: 0.8em;
border: none;
cursor: pointer;
border-radius: 4px;
}

#totalExpense {
margin-top: 1em;
font-size: 18px;
}
</style>
</head>

<body>
<header>
<h1>Expense Tracker</h1>
</header>

<form id="expenseForm">
<label for="expenseName">Expense Name:</label>
<input type="text" id="expenseName" required>

<label for="expenseAmount">Expense Amount:</label>

<input type="number" id="expenseAmount" required>

<button type="button" onclick="addExpense()">Add Expense</button>

</form>

<div id="expenses">
<h2>Expense List</h2>
<table>
<thead>
<tr>
<th>Name</th>
<th>Amount</th>
</tr>
</thead>
<tbody id="expenseList"></tbody>
</table>
 <div id="totalExpense">Total Expense: ₹0</div>
<button id="downloadBtn" onclick="downloadExpenseSheet()">Download Expense Sheet</button>
</div>
<script src="script.js"></script>
</body>
</html>

JS CODE

var totalExpense = 0;

function addExpense() {
var name = document.getElementById("expenseName").value;
var amount = parseFloat(document.getElementById("expenseAmount").value);

if (name && !isNaN(amount) && amount > 0) {

var expenseList = document.getElementById("expenseList");
expenseList.innerHTML += "<tr><td>" + name + "</td><td>₹" + amount + "</td></tr>";

totalExpense += amount;
updateTotalExpense();
} else {
alert("Please enter valid values.");
}
}

function updateTotalExpense() {
document.getElementById("totalExpense").textContent = "Total Expense: ₹" + totalExpense;
}

function downloadExpenseSheet() {
var data = "Name \tAmount\n" + generateExpenseData();
var blob = new Blob([data], { type: 'text/plain' });
var a = document.createElement('a');
a.href = window.URL.createObjectURL(blob);
a.download = 'expense_sheet.txt';
a.click();
}

function generateExpenseData() {
 var rows = document.getElementById("expenseList").getElementsByTagName("tr");
var data = "";
// Simple for loop to gather row data
for (var i = 0; i < rows.length; i++) {
data += rows[i].innerText + "\n\t"; // Get text for each row
}

return data;
}

OUTPUT :

8. References: -
 1. Additional Resources:

Stack Overflow: https://stackoverflow.com/

- For troubleshooting and asking specific programming questions.

GitHub: https://github.com/
- Explore open-source inventory management projects for inspiration.

9. Applications of Expense Tracker

1. Personal Finance Management
2. Budgeting
3. Household Expense Tracking
4. Student Finance Management
5. Small Business Management
6. Expense Sharing