Vivaan Chess

Inspiration

What it does

How we built it

What it does

1. Lightning-Fast Multiplayer: Powered by Pusher.js, Vivaan Chess gives VERY FAST and lag-free multiplayer experience online between two players just using a URL link to connect them both and play the timeless game of chess. It includes features like a game chat, ask for draw button and resignation button, copy to share link button and etc etc - it outperforms chess services like chess.com in Asian countries (the server is set in Singapore) with its fast connectivity.

2. Vast Puzzle Library: Dive into a extensive collection of chess puzzles to develop your skills and abilities and try different difficulties and openings - it uses lichess.com 's chess puzzle database

3. Advanced AI Bots: Test your skill against different bots powered by STOCKFISH API of different difficulties to track your progression - some bots might be easy, so tackle the harder bots!

4. In-Depth Game Analysis: Use STOCKFISH integrated into Vivaan Chess and use it to anaylse moves on your board!

5. Robust Player Profiles: Climb the ranks by beating your friends in matches and showcase your chess prowess on the leaderboard (Bronze 1, Gold 3, Master 2, Etc..)

How we built it

I built it using NextJS 14 ontop of ReactJS, using TailwindCSS for styling, MONGODB for storing chess online data and user details, Pusher JS for seamless fast chess moving communication between clients, and Firebase for authentication (GOOGLE SIGN IN), as well as* WOLFRAM ALPHA* API for Trivia quizzing.

Challenges we ran into

STEMist 3 is a very short hack and I had a lot more ambitions which I will definitely go through with after the hack aswell, even though I have tried to attempt and make a online chess player in the past, I thought this hack was the perfect oppertunity to try again - however many features like a interactive rulebook, coaching and adding a clock to each player on online mutliplayer games were too far fetched in the given time period. Other challenges I ran into was which polling service to use, I was initially going to create my own backend using socket IO and hosting it, but I realised based on the time restriction this was not possible - thus I used pusherjs online web services. I also initially tried using Firebase for storing users and chess games but realised Firebase is too slow and heavy for the entire app. I also had multiple problems with the color pallete, UI and other things that I thought didnt really fit together.

Inspiration

When Covid hit I got stuck at home and got hooked on chess; later in my coding journey, I tried to recreate online chess multiplayer like chess.com but failed quite miserably. A few years later at STEMist hackathon, I thought it was a good opportunity to try again.

Accomplishments that we're proud of

I am most proud of the seamless gameplay, coupled with the comprehensive suite of features that I created in the short amount of time the STEMist hack even gave me.

What we learned

This is one of my most efficient projects and it really taught be how to be fast and cohesive in writing code, reusing past knowledge and sources like STACKOVERFLOW really developed my skills. I also understood how to use PusherJS and integrate it with fast time speeds with MONGODB. Also my UI and UX skills really improved with this project.

What's next for Vivaan Chess

One of the biggest problem left for Vivaan Chess is its only really a web app for people on laptops, PCs, and wider screens - I haven't really formatted to change the layout on a phone which is why the webapp is very hard to navigate around on mobiles. I also might add some SFX for chess moves or interactive UX sounds of clicking buttons.

SIDE NOTE

SIDE NOTE: Use a wide screen device to view the webapp - it is a webapp, didn't have time to make it compatible for phone sized devices. - vivaan-chess.vercel.app