Tablesports leaderboard app Track each ping pong, pool, foosball, air hockey, or shuffleboard game that's played. Find out who really is number one (in your office, or out of your group of friends).
With TableChamp, you can add players, track every game that is played, and always know who's #1.
You can view stats on each player, including their 20 most recent games:
You can manage all of the settings of the app in one convenient sidebar:
You can even select from one of 14 languages:
TableChamp is written entirely in JS/HTML/CSS. There is no back-end code (like python, or PHP). It uses FireBase as a back-end real-time DB to store all of the data, and manage the user authentication.
NOTE: you can run a FireBase app locally, but you'll need to follow these instructions to get set up with FireBase CLI.
Just clone this entire project to your server. Once you've done that, move on to step 2.
Even if you have a large team, the free FireBase account should offer plenty of resources.
Once you've signed up for a free FireBase account, move on to the next step.
Go through the process of creating a new FireBase Project. You can name it "Table Champ", or anything you'd like.
Find the "Add to your web app" option, and click it:
You now have all of the information you need to connect to connect the app to FireBase:
Once you have your FireBase API info, move on to the next step
Open up /js/firebase-key.js:
Paste in the FireBase apiKey, authDomain, and databaseURL from step 3 above:
Once you've done this, save your changes, and move on to the next step.
FireBase handles storing all of your data, as well as authentication. We'll need to set up a user in the FireBase admin, so that you can log into your app. I'll walk you through how to add a single user, but you can add as many login users as you'd like.
NOTE: Users are separate from players. Users are set up in the FireBase admin, and have an email & password attached to them so that you can log in. Players are managed from the settings section once you've logged into your app.
All you need to enter to set up a user is an email, and a password.
Once you've added your first user, continue to the next step.
Now you can log into your app for the first time. Go to the index.html file (wherever it's being hosted from step 1 above). You should see:
Once you've logged in, you should see:
Enter your organizations name, and the game you'll be tracking:
Then click on the Players tab:
Click "Add Players" and enter the names of your players (one name per line):
You should be ready to start tracking games:
