You are on page 1of 32

A

Synopsis/Project Report
On

Multiplayer Chess Website With FaceTime


Submitted in partial fulfillment of the requirement for the V semester
Bachelor of Computer Science
By

Vineet Goswami
Under the Guidance of
Dr. Shilpa Jain
Assistant Professor
Department of CSE

DEPARTMENT OF COMPUTER SCIENCE & ENGINEERING


GRAPHIC ERA HILL UNIVERSITY, BHIMTAL CAMPUS
SATTAL ROAD, P.O. BHOWALI,
DISTRICT- NAINITAL-263132
2022- 2023

1
STUDENT’S DECLARATION

We, Vineet Goswami here by declare the work, which is being presented in the project, entitled

“Multiplayer Chess website with FaceTime” in partial fulfillment of the requirement for the

award of the degree B.Tech in the session 2022-2023, is an authentic record of my own work

carried out under the supervision of “Dr. Shilpa Jain”, Assistant Professor, Department of CSE,

Graphic Era Hill University, Bhimtal.

The matter embodied in this project has not been submitted by us for the award of any other degree.

Date:

Vineet Goswami

2
CERTIFICATE

The project report entitled “Multiplayer Chess website with FaceTime” being submitted by

Vineet Goswami to Graphic Era Hill University Bhimtal Campus for the award of bonafide

work carried out by them. They have worked under my guidance and supervision and

fulfilled the requirement for the submission of report.

(Dr. Shilpa Jain) (Dr. Ankur Bisht)

Project Guide (HOD, CSE Dept.)

3
ACKNOWLEDGEMENT

We take immense pleasure in thanking Honorable “Mrs. Shilpa Jain” (Assistant

Professor, CSE, GEHU Bhimtal Campus) to permit me and carry out this project work with his

excellent and optimistic supervision. This has all been possible due to his novel inspiration, able

guidance and useful suggestions that helped me to develop as a creative researcher and complete

the research work, in time.

Words are inadequate in offering my thanks to GOD for providing me everything that we

need. We again want to extend thanks to our President “Prof. (Dr.) Kamal Ghanshala” for

providing us all infrastructure and facilities to work in need without which this work could not be

possible.

Many thanks to Professor “Dr. Manoj Chandra Lohani” (Director Gehu Bhimtal),

other faculties for their insightful comments, constructive suggestions, valuable advice, and time

in reviewing this thesis.

Finally, yet importantly, we would like to express my heartiest thanks to our beloved parents,

for their moral support, affection and blessings. We would also like to pay our sincere thanks to

all our friends and well-wishers for their help and wishes for the successful completion of this

research.

Vineet Goswami

4
TABLE OF CONTENTS

CHAPTER 1: INTRODUCTION……………………………………………6

1.1 Objective………………………………………………………6

1.2 Project Abstract………………………………………………..8

1.3 Objectives and Research Methodology……………………….10

1.4 Problem statement…………………………………………….12

CHAPTER 2: PROPOSED SYSTEM………………………………………14

2.1 History………………………………………………………...

CHAPTER 3: S/W AND H/W REQUIREMENTS …………………………16

3.1 S/W and H/W requirements …………………………………………16

CHAPTER 4: ER DIAGRAM……………………………………………………….18

4.1 ER Diagram…………………………………………………………...18

CHAPTER 5: CODING OF FUNCTION…………………………………………..19

5.1 Basic modules of the project…………………………………………..19

CHAPTER 6: WORKING……………………………………………………………29

CHAPTER 7: LIMITATIONS ……………………………………………………….30

CHAPTER 8: CONCLUSION………………………………………………………….31

REFERENCES………………………………………………………...32

5
I. INTRODUCTION

In an era defined by digital interconnectedness and innovative web


technologies, the multiplayer chess website project emerges as a dynamic
synthesis of tradition and modernity. This web application introduces a
captivating blend of the classic game of chess and real-time video
communication, creating a novel and immersive gaming experience.
Developed with React, Socket.IO, WebRTC, and Node.js, the platform
transcends the conventional boundaries of online chess by fostering a social
and interactive environment.

Chess, known for its strategic depth and intellectual challenge, has
captivated players for centuries. However, the traditional face-to-face nature
of the game has evolved into a digital landscape where players seek not only
the thrill of competition but also the social connections that enhance their
gaming experience. This project seeks to address this evolution,
acknowledging the importance of real-time communication in the realm of
online gaming.

The journey begins with a seamless onboarding process, where users are
greeted with an inviting interface prompting them to enter their name.
Instantaneously, a shareable link is generated, becoming the key to
unlocking a virtual chess battleground. This link becomes the bridge
between players, allowing them to connect and engage in exhilarating chess
matches in real-time. The choice of React for the frontend ensures a
responsive and intuitive user interface, providing players with an immersive
and enjoyable experience from the outset.

The project's distinguishing feature lies in the integration of WebRTC, a


transformative technology that brings video calls directly into the chess-
playing environment. Players can not only challenge each other strategically
on the board but also communicate face-to-face, breaking down the virtual
barriers that often separate online gamers. This integration of chess and
video calls represents a paradigm shift in the perception of online gaming,

6
transcending the mere execution of moves to include the human element of
connection and interaction.

While the project aims to provide an enriching gaming experience, it does


not neglect the underlying technical challenges. Socket.IO ensures that every
move on the chessboard is communicated in real-time, maintaining the
responsiveness essential for a fluid gaming experience. Node.js, serving as
the backend powerhouse, orchestrates the seamless flow of data, enabling a
scalable architecture capable of accommodating a growing user base and
concurrent game sessions.

In essence, the multiplayer chess website project stands as a testament to


the adaptability and creativity inherent in modern web development. By
combining the timeless appeal of chess with the power of real-time video
communication, the platform transcends the boundaries of traditional
gaming, offering users a space where intellectual engagement meets the
camaraderie of shared experiences. As technology continues to shape the
landscape of leisure and social interaction, this project positions itself at the
forefront of an evolving gaming culture, redefining how players connect,
compete, and communicate in the virtual realm.

7
PROJECT ABSTRACT

The multiplayer chess website project is a sophisticated web application that seamlessly
blends the timeless game of chess with cutting-edge technologies, offering users a unique
and interactive gaming experience. Developed using React for the frontend, Socket.IO for
real-time communication, WebRTC for video call integration, and Node.js for backend
support, the platform enables users to engage in chess matches with friends or opponents
while enjoying real-time video communication.

The application begins with a user-friendly onboarding process. Upon entering the
website, a player is prompted to enter their name and is swiftly provided with a shareable
link. This link serves as an invitation for an opponent to join a game. The opponent, upon
clicking the link, enters their name, connecting them to the game lobby. Here, players can
engage in chess matches, with moves being updated in real-time through the power of
Socket.IO.

A standout feature of the project is the incorporation of WebRTC to facilitate video calls
during gameplay. Users have the option to initiate or accept video calls, enhancing the
social aspect of the gaming experience. This dynamic interaction enables players to
strategize, discuss moves, or simply enjoy a virtual face-to-face experience while engaging
in a game of chess.

The project's primary objective is to create a platform that not only offers a robust chess-
playing experience but also fosters real-time communication, adding a layer of social
connectivity to the gaming environment. This multifaceted approach addresses the
challenge of balancing real-time interaction with the responsiveness required for a
smooth gaming experience.

Throughout the development process, considerations such as scalability, user experience,


and security have been paramount. The platform is designed to scale gracefully,
accommodating an expanding user base and concurrent game sessions. The user
interface prioritizes intuitiveness, ensuring a seamless and enjoyable experience for
players of all skill levels. Security measures are implemented to safeguard user data and
privacy during both gameplay and video calls.

In conclusion, the multiplayer chess website project represents a harmonious fusion of


classic gaming and modern technology. By combining the intellectual challenges of chess

8
with real-time video communication, the platform offers users a dynamic and engaging
space to connect, strategize, and enjoy the timeless game in a virtual setting. The
successful integration of React, Socket.IO, WebRTC, and Node.js results in a feature-rich
application that redefines the online chess gaming experience.

9
OBJECTIVE
The multiplayer chess website project is driven by a comprehensive set of objectives
aimed at delivering a rich, interactive, and socially engaging gaming experience. The
primary goals include:

1. Facilitating Online Chess Matches:


• Create a user-friendly platform that allows players to seamlessly engage in
chess matches with friends or opponents over the internet.
• Implement real-time updates using Socket.IO to ensure that moves are
instantly reflected on the chessboard for both players.
2. Integrating Real-time Video Communication:
• Incorporate WebRTC to enable players to initiate and accept video calls
during gameplay.
• Enhance the social aspect of the gaming experience by providing a virtual
face-to-face communication channel for strategizing and connecting with
opponents.
3. Ensuring User-Friendly Onboarding:
• Develop an intuitive onboarding process where users can quickly enter their
name and generate a shareable link to invite opponents.
• Streamline the connection process, allowing players to join chess matches
seamlessly without encountering unnecessary barriers.
4. Prioritizing User Experience and Interface Design:
• Implement a responsive and visually appealing user interface using React,
ensuring a smooth and enjoyable gaming experience for players of all skill
levels.
• Prioritize user experience by optimizing the platform for ease of navigation
and clear presentation of chess elements.
5. Addressing Technical Challenges:
• Tackle the challenge of maintaining real-time communication while
preserving the responsiveness of the chess game.
• Implement a scalable architecture using Node.js to accommodate an
increasing number of users and concurrent game sessions.
6. Enhancing Security Measures:
• Implement robust security measures to safeguard user data and privacy
during both gameplay and video calls.
• Ensure that the platform adheres to industry standards for online security
to create a trustworthy and secure gaming environment.
7. Promoting Social Interaction:

10
• Foster a sense of community among players by providing features that
encourage interaction, such as chat functionalities and video calls.
• Recognize the importance of the human element in online gaming, going
beyond the strategic aspects of chess to create a socially engaging
environment.
8. Adapting to Evolving Gaming Culture:
• Position the project at the forefront of an evolving gaming culture by
embracing modern technologies and trends.
• Stay agile and responsive to user feedback, incorporating updates and
improvements to align with the dynamic expectations of the gaming
community.

Through the achievement of these objectives, the multiplayer chess website project
aspires to redefine the online gaming experience, bridging the gap between traditional
board games and contemporary digital connectivity.

11
PROBLEM STATEMENT

In the rapidly evolving landscape of online gaming, the multiplayer chess


website project addresses several key challenges and opportunities to create a
seamless and socially engaging gaming experience.

Real-Time Interaction: The challenge lies in balancing the intricacies of real-


time communication with the responsiveness required for a smooth and
enjoyable chess-playing experience. Integrating Socket.IO to facilitate instant
updates on the chessboard while simultaneously enabling WebRTC for video
calls introduces complexities in maintaining synchronization without
compromising performance.

User Experience: Ensuring a user-friendly onboarding process and an intuitive


interface is paramount. The challenge is to design an interface using React that
caters to players of varying skill levels, providing a visually appealing and
responsive environment. Additionally, fostering an environment where players
can effortlessly connect and initiate games is crucial to the overall user
experience.

Scalability: As the popularity of the platform grows, scalability becomes a


critical consideration. The project must employ a robust backend architecture
using Node.js that can seamlessly accommodate an expanding user base and
concurrent game sessions without sacrificing performance.

Security Concerns: With user data being exchanged during gameplay and
video calls, implementing stringent security measures is essential. Ensuring the
privacy and integrity of user information is crucial to building trust within the
gaming community. The challenge lies in implementing security protocols that
safeguard against potential vulnerabilities and threats.

Social Interaction Dynamics: While the project aims to enhance the social
aspect of gaming through video calls, striking the right balance is challenging.
Providing features for chat and video calls should augment, not overshadow,
the core chess-playing experience. Managing the integration of real-time

12
communication to foster a sense of community without detracting from the
strategic focus of chess poses a nuanced challenge.

Adaptation to Changing Gaming Culture: The gaming landscape is dynamic,


with user expectations evolving rapidly. The project must remain agile,
responsive to user feedback, and adaptable to emerging trends. Staying at the
forefront of an ever-changing gaming culture requires continuous updates and
improvements to meet the dynamic expectations of the gaming community.

In essence, the problem statement encapsulates the need to harmonize real-


time interaction, user experience, scalability, security, social interaction
dynamics, and the adaptability of the platform. Addressing these challenges is
essential to realizing the project's vision of creating a multiplayer chess website
that not only preserves the essence of the game but also pioneers a new era of
socially connected online gaming.

13
Proposed System
The proposed multiplayer chess website system envisions a comprehensive and
innovative platform that seamlessly integrates traditional chess gameplay with
cutting-edge real-time communication technologies, promising an immersive and
socially engaging experience. The system is designed to overcome the challenges
identified in the problem statement while providing a feature-rich environment for
players.

Real-Time Interaction Enhancement: To address the challenge of real-time


interaction, the proposed system leverages the power of Socket.IO to ensure instant
updates on the chessboard during gameplay. By optimizing data transfer and
synchronization mechanisms, the system aims to provide players with a responsive
and fluid chess-playing experience.

User-Friendly Onboarding and Interface Design: The system prioritizes user


experience by implementing an intuitive onboarding process. Players are seamlessly
guided to enter their names and generate shareable links, simplifying the connection
process. Using React, the frontend is crafted to deliver a visually appealing and
responsive interface, catering to players of diverse skill levels and enhancing overall
usability.

Scalable Backend Architecture: To meet the scalability challenge, the proposed


system employs a robust backend architecture powered by Node.js. This ensures that
the platform can effortlessly accommodate an expanding user base and handle
concurrent game sessions without compromising performance. The scalable design
supports the long-term growth of the gaming community.

Security Measures: Addressing security concerns, the proposed system implements


robust security measures to safeguard user data and privacy. Through encryption
protocols and secure data transmission, the system ensures the integrity and
confidentiality of user information, fostering a secure and trustworthy gaming
environment.

Social Interaction Integration: The proposed system seamlessly integrates WebRTC


for real-time video communication, enhancing the social dynamics of chess gameplay.
Players can initiate or accept video calls, providing a virtual face-to-face experience.
The system strategically incorporates chat functionalities and other features to strike
the right balance between social interaction and the core chess-playing experience.

14
Adaptive and Agile Development: Acknowledging the dynamic nature of gaming
culture, the proposed system adopts an adaptive development approach. Regular
updates and improvements are prioritized based on user feedback and emerging
trends, ensuring the platform remains at the forefront of evolving gaming
expectations.

In summary, the proposed system envisions a multiplayer chess website that not only
overcomes the challenges identified in the problem statement but also sets new
standards for online chess gaming. By combining real-time interaction, user-friendly
design, scalability, security, social integration, and adaptability, the system aims to
redefine the gaming experience, creating a platform where players can connect,
compete, and communicate in a seamlessly integrated virtual environment.

15
Software and Hardware Requirements
Software Requirements:

1. Frontend Development:
• React: Utilized for creating a responsive and interactive user interface.
React facilitates the development of a dynamic frontend that enhances the
overall user experience.
2. Backend Development:
• Node.js: Chosen as the backend runtime environment to build a scalable
and high-performance server. Node.js allows for efficient handling of
concurrent connections, contributing to the responsiveness of the
application.
3. Real-Time Communication:
• Socket.IO: Employed to establish real-time bidirectional communication
between the server and clients. Socket.IO ensures instant updates on the
chessboard during gameplay, enhancing the interactive nature of the
platform.
4. Video Communication:
• WebRTC: Integrated to enable real-time video communication between
players during gameplay. WebRTC facilitates peer-to-peer communication,
enhancing the social aspect of the chess-playing experience.
5. Package Management:
• npm (Node Package Manager): Used for managing and installing project
dependencies. npm streamlines the process of incorporating external
libraries and tools into the project.
6. Version Control:
• Git: Implemented for version control, allowing for collaboration, code
management, and tracking changes throughout the development lifecycle.

Hardware Requirements:

1. Server Infrastructure:
• Cloud Hosting :Leveraged for hosting the backend server, providing
scalability, reliability, and performance optimization. Cloud hosting ensures
the application can handle an increasing number of users and concurrent
game sessions.
2. Client Devices:

16
• Desktops, Laptops, Tablets, and Smartphones: The frontend is designed
to be accessible across various devices, allowing users to play chess and
engage in video calls seamlessly on a range of platforms.
3. Web Cameras and Microphones:
• For Video Communication: Users require devices equipped with web
cameras and microphones to participate in real-time video calls during
gameplay.
4. Internet Connectivity:
• High-Speed Internet: Essential for a smooth gaming experience, high-
speed internet connectivity is crucial for real-time communication and
responsive gameplay.

Development Environment:

1. Code Editors:
• Visual Studio Code, Atom, or Sublime Text: Preferred code editors for
development, providing features like syntax highlighting, code completion,
and debugging tools.
2. Operating Systems:
• Windows, macOS, or Linux: The project is designed to be compatible
with multiple operating systems to ensure broad accessibility.
3. Browser Compatibility:
• Google Chrome, Mozilla Firefox, Safari, Microsoft Edge: The frontend
is optimized for compatibility with popular web browsers, ensuring a
consistent experience for users.

In conclusion, the software and hardware requirements outlined above provide the
foundation for developing and deploying the multiplayer chess website. The chosen
technologies and infrastructure aim to deliver a robust, scalable, and user-friendly
platform that seamlessly integrates traditional chess gameplay with modern real-time
communication features.

17
III. E-R Diagram

18
IV. Coding
import Chess from 'chess.js'

import ChessPiece from './chesspiece'

import Square from './square'

class Game {

constructor(thisPlayersColorIsWhite) {

this.thisPlayersColorIsWhite = thisPlayersColorIsWhite // once initialized, this


value should never change.

this.chessBoard = this.makeStartingBoard()

this.chess = new Chess()

this.toCoord = thisPlayersColorIsWhite ? {

0:8, 1:7, 2: 6, 3: 5, 4: 4, 5: 3, 6: 2, 7: 1

}:{

0:1, 1:2, 2: 3, 3: 4, 4: 5, 5: 6, 6: 7, 7: 8

this.toAlphabet = thisPlayersColorIsWhite ? {

0:"a", 1:"b", 2: "c", 3: "d", 4: "e", 5: "f", 6: "g", 7: "h"

}:{

0:"h", 1:"g", 2: "f", 3: "e", 4: "d", 5: "c", 6: "b", 7: "a"

this.toCoord2 = thisPlayersColorIsWhite ? {

8:0, 7:1, 6: 2, 5: 3, 4: 4, 3: 5, 2: 6, 1: 7

19
}:{

1:0, 2:1, 3: 2, 4: 3, 5: 4, 6: 5, 7: 6, 8: 7

this.toAlphabet2 = thisPlayersColorIsWhite ? {

"a":0, "b":1, "c":2, "d":3, "e":4, "f":5, "g":6, "h":7

}:{

"h":0, "g":1, "f":2, "e":3, "d":4, "c":5, "b":6, "a":7

this.nQueens = 1

getBoard() {

return this.chessBoard

setBoard(newBoard) {

this.chessBoard = newBoard

movePiece(pieceId, to, isMyMove) {

const to2D = isMyMove ? {

105:0, 195:1, 285: 2, 375: 3, 465: 4, 555: 5, 645: 6, 735: 7

}:{

105:7, 195:6, 285: 5, 375: 4, 465: 3, 555: 2, 645: 1, 735: 0}

20
var currentBoard = this.getBoard()

const pieceCoordinates = this.findPiece(currentBoard, pieceId

// can't find piece coordinates (piece doesn't exist on the board)

if (!pieceCoordinates) {

return

const y = pieceCoordinates[1]

const x = pieceCoordinates[0]

const to_y = to2D[to[1]]

const to_x = to2D[to[0]]

const originalPiece = currentBoard[y][x].getPiece()

if (y === to_y && x === to_x) {

return "moved in the same position."

const isPromotion = this.isPawnPromotion(to, pieceId[1])

const moveAttempt = !isPromotion ? this.chess.move({

from: this.toChessMove([x, y], to2D),

to: this.toChessMove(to, to2D),

piece: pieceId[1]})

this.chess.move({

21
from: this.toChessMove([x, y], to2D),

to: this.toChessMove(to, to2D),

piece: pieceId[1],

promotion: 'q'

})

console.log(moveAttempt)

// console.log(isPromotion)

if (moveAttempt === null) {

return "invalid move"

if (moveAttempt.flags === 'e') {

const move = moveAttempt.to

const x = this.toAlphabet2[move[0]]

let y

if (moveAttempt.color === 'w') {

y = parseInt(move[1], 10) - 1

} else {

y = parseInt(move[1], 10) + 1

currentBoard[this.toCoord2[y]][x].setPiece(null)

22
// Check castling

const castle = this.isCastle(moveAttempt)

if (castle.didCastle) {

const originalRook = currentBoard[castle.y][castle.x].getPiece()

currentBoard[castle.to_y][castle.to_x].setPiece(originalRook)

currentBoard[castle.y][castle.x].setPiece(null)

const reassign = isPromotion ? currentBoard[to_y][to_x].setPiece(

new ChessPiece(

'queen',

false,

pieceId[0] === 'w' ? 'white' : 'black',

pieceId[0] === 'w' ? 'wq' + this.nQueens : 'bq' + this.nQueens))

: currentBoard[to_y][to_x].setPiece(originalPiece)

if (reassign !== "user tried to capture their own piece") {

currentBoard[y][x].setPiece(null)

} else {

return reassign

const checkMate = this.chess.in_checkmate() ? " has been checkmated" : " has


not been checkmated"

console.log(this.chess.turn() + checkMate)

if (checkMate === " has been checkmated") {

23
return this.chess.turn() + checkMate

const check = this.chess.in_check() ? " is in check" : " is not in check"

console.log(this.chess.turn() + check)

if (check === " is in check") {

return this.chess.turn() + check

console.log(currentBoard)

this.setBoard(currentBoard)

isCastle(moveAttempt) {

const piece = moveAttempt.piece

const move = {from: moveAttempt.from, to: moveAttempt.to}

const isBlackCastle = ((move.from === 'e1' && move.to === 'g1') || (move.from
=== 'e1' && move.to === 'c1'))

const isWhiteCastle = (move.from === 'e8' && move.to === 'g8') || (move.from
=== 'e8' && move.to === 'c8')

if (!(isWhiteCastle || isBlackCastle) || piece !== 'k') {

return {

didCastle: false

24
let originalPositionOfRook

let newPositionOfRook

if ((move.from === 'e1' && move.to === 'g1')) {

originalPositionOfRook = 'h1'

newPositionOfRook = 'f1'

} else if ((move.from === 'e1' && move.to === 'c1')) {

originalPositionOfRook = 'a1'

newPositionOfRook = 'd1'

} else if ((move.from === 'e8' && move.to === 'g8')) {

originalPositionOfRook = 'h8'

newPositionOfRook = 'f8'

} else { // e8 to c8

originalPositionOfRook = 'a8'

newPositionOfRook = 'd8'

return {

didCastle: true,

x: this.toAlphabet2[originalPositionOfRook[0]],

y: this.toCoord2[originalPositionOfRook[1]],

to_x: this.toAlphabet2[newPositionOfRook[0]],

to_y: this.toCoord2[newPositionOfRook[1]]

isPawnPromotion(to, piece) {

25
const res = piece === 'p' && (to[1] === 105 || to[1] === 735)

if (res) {

this.nQueens += 1

return res

toChessMove(finalPosition, to2D) {

let move

if (finalPosition[0] > 100) {

move = this.toAlphabet[to2D[finalPosition[0]]] +
this.toCoord[to2D[finalPosition[1]]]

} else {

move = this.toAlphabet[finalPosition[0]] + this.toCoord[finalPosition[1]]

// console.log("proposed move: " + move)

return move

findPiece(board, pieceId) {

for (var i = 0; i < 8; i++) {

for (var j = 0; j < 8; j++) {

if (board[i][j].getPieceIdOnThisSquare() === pieceId) {

return [j, i]

26
}

makeStartingBoard() {

const backRank = ["rook", "knight", "bishop", "queen", "king", "bishop",


"knight", "rook"]

var startingChessBoard = []

for (var i = 0; i < 8; i++) {

startingChessBoard.push([])

for (var j = 0; j < 8; j++) {

const coordinatesOnCanvas = [((j + 1) * 90 + 15), ((i + 1) * 90 + 15)]

const emptySquare = new Square(j, i, null, coordinatesOnCanvas)

startingChessBoard[i].push(emptySquare)

const whiteBackRankId = ["wr1", "wn1", "wb1", "wq1", "wk1", "wb2", "wn2",


"wr2"]

const blackBackRankId = ["br1", "bn1", "bb1", "bq1", "bk1", "bb2", "bn2",


"br2"]

for (var j = 0; j < 8; j += 7) {

for (var i = 0; i < 8; i++) {

if (j == 0) {

startingChessBoard[j][this.thisPlayersColorIsWhite ? i : 7 -
i].setPiece(new ChessPiece(backRank[i], false, this.thisPlayersColorIsWhite ? "black"
27
: "white", this.thisPlayersColorIsWhite ? blackBackRankId[i] : whiteBackRankId[i]))

startingChessBoard[j + 1][this.thisPlayersColorIsWhite ? i : 7 -
i].setPiece(new ChessPiece("pawn", false, this.thisPlayersColorIsWhite ? "black" :
"white", this.thisPlayersColorIsWhite ? "bp" + i : "wp" + i))

} else {

startingChessBoard[j - 1][this.thisPlayersColorIsWhite ? i : 7 -
i].setPiece(new ChessPiece("pawn", false, this.thisPlayersColorIsWhite ? "white" :
"black", this.thisPlayersColorIsWhite ? "wp" + i : "bp" + i))

startingChessBoard[j][this.thisPlayersColorIsWhite ? i : 7 - i].setPiece(new
ChessPiece(backRank[i], false, this.thisPlayersColorIsWhite ? "white" : "black",
this.thisPlayersColorIsWhite ? whiteBackRankId[i] : blackBackRankId[i]))

return startingChessBoard

export default Game

28
Working

29
LIMITATIONS

While the multiplayer chess website project represents a significant leap in the
integration of traditional gaming and modern technology, it is essential to acknowledge
certain limitations:

1. Dependency on Internet Stability:


• The quality of the gaming experience is contingent on stable and high-
speed internet connections for both players. Variability in internet
connectivity may impact real-time communication and responsiveness
during gameplay.
2. Device Compatibility:
• The system relies on users having devices equipped with web cameras and
microphones for video communication. Limited device compatibility may
restrict some users from fully enjoying the integrated features.
3. Security Challenges:
• Although security measures are implemented, online platforms always face
potential security challenges. Continuous monitoring and updates are
essential to address emerging threats and vulnerabilities.
4. Learning Curve:
• Users unfamiliar with online gaming platforms may face a learning curve,
particularly in navigating the onboarding process and understanding the
features of real-time communication.
5. Scalability Constraints:
• While efforts have been made to ensure scalability, unexpected surges in
user activity may pose challenges. Continuous monitoring and
adjustments may be required to maintain optimal performance.

30
CONCLUSION

In conclusion, the multiplayer chess website project represents a significant achievement


in bridging the gap between traditional board games and contemporary online gaming.
The successful integration of React, Socket.IO, WebRTC, and Node.js has resulted in a
platform that not only facilitates intense chess matches but also fosters social
connections through real-time video communication.

The limitations identified underscore the importance of ongoing refinement and


adaptation. As the project evolves, addressing these limitations will be crucial for
enhancing user accessibility, security, and overall satisfaction. The dynamic nature of the
online gaming landscape requires a commitment to continuous improvement,
responsiveness to user feedback, and the exploration of emerging technologies.

The project, despite its limitations, stands as a testament to the potential of technology
to redefine classic experiences. By combining the intellectual challenges of chess with
the interactive elements of real-time video communication, the multiplayer chess
website not only provides entertainment but also contributes to the evolving culture of
online gaming. As the platform evolves, it is poised to shape and be shaped by the
preferences and expectations of a vibrant and engaged gaming community.

31
References

1. React Documentation:
• Facebook. (Year). React - A JavaScript library for building user interfaces.
2. Socket.IO Documentation:
• Socket.IO. (Year). Socket.IO - Real-time web applications.
3. WebRTC Documentation:
• WebRTC Project. (Year). WebRTC - Open framework for the web.
4. Node.js Documentation:
• Node.js Foundation. (Year). Node.js - JavaScript runtime.
5. Chess.com (Inspiration for Chess Gameplay):
• Chess.com. (Year). Play Chess Online

32

You might also like