WTTTF

The official match-making system for Willow-Tree Table Tennis Federation

Official Site

Features

• 🔒 Google and Github Auth
• ⌚ Realtime game status & game invites using websockets
• 📈 Elo tracking with Rating history graph
• 🏆 Player rankings
• 💡 View match in progress

Technologies

This project uses the t3 stack with some additions

• Next.js
• TailwindCSS
• TRPC
• Websockets
• DaisyUI
• MySQL
• Redis

For more information on the t3 stack create-t3-app

For more information on trpc websockets with Next.js Example application

Setup

1. Configure Environment variables

Copy environment variables to the correct location

cp .env.sample .env

To log into the application you'll need to get valid OAuth2 client ID and secret from google, github, or both. Once you have those values, copy them to your .env

2. Apply database migrations

First, start the database

docker compose up db

Next, in a seperate terminal window apply all migrations and run the seed command. This may take longer than expected to execute.

npx prisma migrate reset

The DATABASE_URL environment variable must point to the database running on localhost with the correct port. If no configuration has changed, the value in .env.sample should work.

3. Start the project

Now you should be able to run the project using docker compose

docker compose up

After the build is complete you should be able to visit the application on localhost:3000

Migrations

After making changes to the database schema, you'll need to create and apply a new migration.

First, start the database

docker compose up db

Next, in a seperate terminal window create the miration. You'll be prompted to add a name for the migration.

npx prisma migrate dev

Finally, you need to rebuild the application and start it

docker compose up --build app