Motivation
Although I had heard about the auth0 x hashnode hackathon before. I ignored it while I was busy working on something else. After eighteen days of hackathon, I got a message from a friend. So I thought it was a good opportunity to do an open source project in a little time.
Exploring Nodesports
Nodesports comprises three main pages Home, Browse and Organize.
Home
Organize
It is a secure route which only my authenticated users can access. When authenticated, a user can create his or her own tournament.
There are currently five tournaments that the user has created. To create a new tournament, a popup is displayed when you click New tournament.
The popup window is used so that a user can click by mistake on New Tournament that will unintentionally create a new record in the database. Also having minimalist information during pop up is a better user experience for the user as the user might not be able to complete all the details at once.
After setting up your tournament, you will be redirected to the page where you can manage your tournament.
After completing your tournament details on the Edit tab, you can proceed to the Overview tab tab to verify how your tournament will be displayed to the end user.
Browse
This page shows all the public tournaments where you can take part. It's similar to the Organize page, the only difference is that in Organize page only the tournament created by that user is displayed , while on the Browse page all tournaments are displayed that are created by him and others.
After selecting the tournament you would like to participate in, you will be redirected to their tournament page where more details about the tournament is given and the option to join a participant is provided.
When someone joins your tournament, he will be visible in the Participants tab. You can choose to keep them or remove them by clicking on Remove User.
The organizer can then handle leaderboard from the leaderboard tab. The first two columns are not modifiable and the last score column is modifiable.
The table provides the option to sort by increasing or decreasing order based on their score.
Future improvement
We will continue to improve the application even after the hackathon. A few elements of our roadmap.
- The organizer manages leaderboard by editing the score in the table.
We are planning to automate the manual editing in the table by allowing editors to schedule matches and based on that It automatically calculates the values for you.
Something like this on the picture below.
- Host private tournament
- Add more games
- Global leaderboard
Tech stack
Wrapping up
That was a fun project and a great learning experience for us. We started within the last ten days of the hackathon and quite satisfied with what we accomplished .