https://github.com/timscodebase/uno

This is a simple Uno game made with SvelteKit and Svelte. We will style it with TailwindCSS and use Socket.io for multiplayer.
https://github.com/timscodebase/uno

playwright svelte sveltekit tailwindcss typescript

Last synced: about 1 month ago
JSON representation

This is a simple Uno game made with SvelteKit and Svelte. We will style it with TailwindCSS and use Socket.io for multiplayer.

• Host: GitHub
• URL: https://github.com/timscodebase/uno
• Owner: timscodebase
• License: unlicense
• Created: 2023-09-18T05:46:55.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2023-10-03T02:36:58.000Z (over 1 year ago)
• Last Synced: 2024-12-01T00:49:13.784Z (about 1 month ago)
• Topics: playwright, svelte, sveltekit, tailwindcss, typescript
• Language: TypeScript
• Homepage: https://uno-iota.vercel.app/
• Size: 26.8 MB
• Stars: 5
• Watchers: 1
• Forks: 5
• Open Issues: 5
• Metadata Files:
  • Readme: README.md
  • Contributing: CONTRIBUTING.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE
  • Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        
# No Longer HACTOBERFEST elegable ☹️👎🏼

## SvelteKit Uno Game

![UNO](./static/pics/uno_banner_1280x640.png)

Here is the structure for this project:

We hop to build a simple Uno game using SvelteKit. This will demonstrate basic card handling, game logic, and multiplayer capabilities. We will use TailwindCSS for styling and Socket.io for multiplayer.

---

Here is the structure for this project:

![Structure](./static/pics/uno-flow-1.png)

![Game Start](./static/pics/ui-game-start.png)

![Game Play](./static/pics/ui-game-play.png)

Game Loop:

## Getting Started

Clone the repository and install the dependencies.

```bash

git clone https://github.com/timscodebase/uno.git

cd uno

npm install  // or pnpm install

```

To run the project:

```bash

npx vite build

npm run dev

```

### Prerequisites

- You will need to have Node.js installed on your machine. You can download it from [here](https://nodejs.org/en/download/).

- You will need to have a GitHub account. You can create one [here](https://github.com/).

- [PnPm](https://pnpm.io/) is not required, but greatly improves proformance. You can install it with `npm install -g pnpm`.

### Using TailwindCSS with Svelte

- To use TailwindCSS in the `````` tag, import tailwind classes in the following way:

  ```

  <style>

    @tailwind base;

	@tailwind components;

	@tailwind utilities;

  

  ```  

#### Hacktoberfest 2023

This repository is for Hacktoberfest 2023. Join us in creating a fun game for everyone to play while learning about SvelteKit, TailwindCSS and Socket.io.