About the project, a little bit about myself. Wanting to grasp solid knowledge of algorithmics, data structures, OOP and SOLID principles I thought that one of the best ways to start learning theoretical programming principles is to actually start programming a chess board.
From a holistic perspective, this project encompasses many major areas of web development and data structures & algorithms such as:
- Front end development
- Back end development
- Web protocols - REST API & WebSockets
- Algorithms, data structures, data interaction
- And so many more!
Many many things are still yet to be implemented but the road is long and I worked on this mostly myself. I had some help on the FE side of things to be able to touch pieces and select them and a little bit of help with the websocket used to communicate with the back end.
- HTML
- CSS
- Javascript
- Typescript
- Express JS
- Socket.IO
To get a local copy on your machine, it's easy - just two steps!
- Installation Step:
- npm
npm install npm run dev
- Accessing Step:
Go to http://localhost:3000/home
Press ''Click me to play'' button
You will be redirected to http://localhost:3000/play
Press ''START'' button
Enjoy!
You need to have node already installed on your machine. If you don't have it just go to -> https://nodejs.org/en/
Until now, the main focus was developing the whole logic of the board and chess rules.
The UI needs massive improvement and the player will be constricted to use the app in a manner that it won't break from the FE.
- the pieces need ONLY to be dragged and after that dropped on the marked squares
- DON'T: click a piece and then a target square. As above, just drag it.
- try to respect the white / black alternating moves. On BE still some validations need to be made but on the FE there is no stopping at the moment.
As trivia, I actually started developing the app using Java. My intention was to build a GUI that will later be supported by a Spring Boot application to turn to the web side of things. Unfortunately I have met many obstacles on the road and decided to switch to typescript and have the same language for both the logic and the UI - which now is javascript.
The repo with how things were left off with the java app can be viewed here: https://github.com/valioprea/chessGame
I hope that someday I will make the whole development story available on the wiki page just for fun and maybe future developers who read this will avoid certain obstacles that I confronted.
As previously stated, many things have yet to be implemented but I am happy that I can say I have a functional board with almost all the rules implemented and I am not really sure what is prioritary next. I will just list some things that I've done, and some others that I intend to do in the future.
- Create computing functions
- Link computing functions to checkmate algorithm
- Define UI
- Link UI with backend through socket, encompassed by an express server
- Solo play capability
- Create socket room
- Define players
- Explore how players interact in the same room with the same board
- Deploy
- Test out links to friends
- Wiki pages of this repo
- And many more, so ...stay tuned!
Rules & features implemented - as a reminder for myself to always test them
- Pawn moves 1 or 2 squares as a first move
- En Passant move
- Castling both sides
- Pawn promotion - with choices: queen, bishop, knight, rook
- Checkmate
- Stalemate by not having legal squares to move
I know that I probably don't know what's wrong in some places, but I'm more afraid of what I don't know that I don't know. Everyday I try to become a better developer. I am absolutely sure that many experienced developers will have lots of things to say about this code but please consider this is my first project of this complexity, build on my own. As such, any contributions that you have ... a comment, a small improvement, maybe an algorithmic flaw that I didn't see - will be greately appreciated.
If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue.
If you feel like this deserves anything ... give it a star! Everybody loves stars, right ?
Contributing:
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/AmazingFeature) - Commit your Changes (
git commit -m 'Add some AmazingFeature') - Push to the Branch (
git push origin feature/AmazingFeature) - Open a Pull Request
I am a sociable person and I love writing code. For any suggestions, or collaborative ideas please feel free to reach out:
Valentin Oprea - @linkedin - [email protected]
Project Link: [https://github.com/valioprea/myChess-Typescript]
Many thanks in the first place for the guys that helped me on the road.
- Help received at the front end by AlexTudosoiu
- Help received at the socket.io stuff by DanielBradea
A big big thank you as well for my other friends with which I spent some good hours brainstorming this and that regarding algorithms and solutions.
And also I would like to thank the creator of the cloning package, it literally was a turning point in the development of this app.
https://www.npmjs.com/package/lodash
Last but not least, kudos to the person who inspired me with this mega cool readme page:
https://github.com/othneildrew/Best-README-Template