Aspiring Audio Engineer

Tic Tac Toe: Experimenting with React, node.js and express.js

Watch the demo!

What's this project about?

This project is to experiment with React, node.js and express.js together. I have created a game that is different from the React template with my own understanding of web application framworks and libraries.

What are some of the highlights features that you could recreate?

Just like normal Tic Tac Toe game, it functions by having a line of the same symbols. On the other hand, my code uses React components for the game container and for the squares. It also can reset the game.

This is the logic that I implemented to find out which player is the winner, then I also set the state.
This shows the states that I have used for the project. The states are use to help setting the squares with symbol and identifying the players.

What are some difficulties that I faced?

The trickiest part is handling clicks on the squares, as they do not know the state of the game. I solved it by having each square with an onClick prop.

What's my takeaway?

I have never coded with express.js, node.js and React. It was a rewarding experience to play around with it. It is useful in creating a dynamic website.

Libraries used: