Sveltekit Sse Tictactoe

Table of Contents

1. About The Project
   • Built With
2. Getting Started
   • Prerequisites
   • Installation
3. Usage
4. Feature Showcase
5. License
6. Contact
7. Acknowledgments

About The Project

This was my project to try out Server-Sent Events as well as to improve my skills in SvelteKit.

Here's why I needed SSE for performace reasons:

• changes were reflected very fast
• no polling needed

Of course, this project is not optimized or perfect. But it taught me how to work with SSE and how create dynamic routing.

Built With

This site was build with only a few frameworks and library:

• 
• 
• 

Getting Started

This are steps to setup the project locally.

Prerequisites

• npm

  npm install npm@latest -g
  

Installation

1. Clone the repo

   git clone https://github.com/Schmidii99/Sveltekit-SSE-TicTacToe.git
   

2. Install NPM packages

   npm install
   

Usage

Start the project on your local maschine

npm run dev

open your browser on localhost:5173

Create a lobby

Copy the link to another browser or an incognito window to join your own game. This is due to the session being store in your local storage. Repeat this step again if you want to spectate the game.

(back to top)

Feature Showcase

Spectating a game

When a game is full/ started, the new client will be a spectator. Everybody can see how many spectators are currently viewing the game, by the count in the top right corner.

Game End

Once the game has ended the winner is calculated client-side and displayed, as well as button that takes you back to the "create-lobby" page.

(back to top)

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions and improvements you make are greatly appreciated. This makes you and me a better developer.

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 with the tag "enhancement". Don't forget to give the project a star! Thanks again!

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

(back to top)

License

Distributed under the MIT License. See LICENSE for more information.

Contact

Florian Schmid - my website - mail@florianschmid.me

Project Link: https://github.com/Schmidii99/Sveltekit-SSE-TicTacToe/

Acknowledgments

Some links to credit those awesome projects that helped me.

• Choose an Open Source License
• GitHub Readme Template
• Img Shields

(back to top)