Skip to content

tukwan/tictactoe

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

29 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Tic Tac Toe - multiplayer game

A real-time, multiplayer Tic Tac Toe game built using Node.js for the server-side, and React for the client-side interface.

Live Preview

You can play the game online at https://tic-tac-toe-09qb.onrender.com .

preview.mov

Features

  • Interactive multiplayer gameplay in real-time.
  • Game lobby for players waiting to join a game.
  • Built using modern technologies.

Tech Stack

  • Node.js: Back-end JavaScript runtime environment.
  • Express.js: Minimal Node.js web application framework.
  • Socket.IO: Library enabling real-time, bidirectional communication.
  • React: JavaScript library for building user interfaces.
  • TypeScript: Statically typed JavaScript superset.
  • Vite: Modern and fast build tool.
  • Tailwind CSS: Utility-first CSS framework.
  • Cypress: Next-gen front end testing tool.
  • Vitest: Unit test framework for the Vite ecosystem.
  • ESLint: Tool for identifying and reporting on JavaScript patterns.
  • GitHub Actions: Workflow automation tool for software development.

Project Structure

This project is structured into two main directories:

  1. ./: Contains the server-side of the application, which uses Node.js and Socket.IO to facilitate real-time communication between the players.

  2. ./interface: Contains the client-side of the application, built with React, which communicates with the server via Socket.IO.

Local Development

To start the server-side development from the root directory, execute:

npm run dev

In a new terminal window, navigate to the ./interface directory and initiate the client-side development server:

cd ./interface && npm run dev

Navigate to: http://localhost:5173

Testing

To run the unit and integration tests:

cd ./interface && npm run test

End-to-end tests can be executed with the following command, but ensure the server and client are up and running:

cd ./interface && npm run test:e2e

Building for Production

You can generate production-ready builds of the server and client using:

npm run build:prod

This command will take care of installing dependencies, and building both server-side and client-side applications.

To launch the production build:

npm run start

Navigate to: http://localhost:10000

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

License

MIT