Daddel

A Progressive Web App (PWA) to organize game nights with your friends. Think of it as Doodle for gaming.

Code on GitHub Screenshots

Daddel enables users to post dates for video or board games. Others can join these "lobbies" by specifying the time at which a person is available then. This way a calendar is created that displays if and when enough players are interested in playing this game.

Main features

runs in the web browser, Android and iOS (as PWA)
simple registration and login via email or Google account
realtime updates of all data thanks to Firebase Firestore
push notifications when a new match is created (not supported in iOS)
sharing of matches through permalinks and native share dialogue
filter for games

Used technologies

TypeScript
CSS
React
MUI
Firebase (for authentication, realtime database, push notifications and Cloud Functions)

Users are able to sign in with mail and password or through Google (OAuth 2.0).

Daddel Screenshot 1 — Users are able to sign in with mail and password or through Google (OAuth 2.0).

New players can register through their Google account or with shown form if they know the app invitation code.

Daddel Screenshot 2 — New players can register through their Google account or with shown form if they know the app invitation code.

All upcoming matches are listed as cards in the main view of the app. Each card shows the date, a calendar and the number of free slots in the lobby (progress bar with traffic light colors).

Daddel Screenshot 3 — All upcoming matches are listed as cards in the main view of the app. Each card shows the date, a calendar and the number of free slots in the lobby (progress bar with traffic light colors).

Users can join a game by clicking the Mitspielen button to specify the time at which she is available.

Daddel Screenshot 4 — Users can join a game by clicking the Mitspielen button to specify the time at which she is available.

The card will then update accordingly.

Daddel Screenshot 5 — The card will then update accordingly.

In addition to the upcoming matches, past games are displayed in an extra tab. Both views can be filtered by game.

Daddel Screenshot 6 — In addition to the upcoming matches, past games are displayed in an extra tab. Both views can be filtered by game.

Each card has a detail view with a permalink. The URL can easily be copied in to the user's clipboard with a button.

Daddel Screenshot 7 — Each card has a detail view with a permalink. The URL can easily be copied in to the user's clipboard with a button.

New matches can be created in the second main view of the app.

Daddel Screenshot 8 — New matches can be created in the second main view of the app.

Own games can be edited and deleted. All players can also copy the permalink of a game or share it using their device's native dialog.

Daddel Screenshot 9 — Own games can be edited and deleted. All players can also copy the permalink of a game or share it using their device's native dialog.

In the settings, players can set their nickname and manage push notifications. When a match is created they will receive a notification if activated. Lastly, users can log out or delete their account here.

Daddel Screenshot 10 — In the settings, players can set their nickname and manage push notifications. When a match is created they will receive a notification if activated. Lastly, users can log out or delete their account here.

Back to project list