Belgian Packs
Project Overview
A website where you can collect famous Belgian's in the form of cards! Every day the user can come back to the site to open a new pack. The user can also see their collection and the cards they have opened and trade their cards in for credits, which they can use to open more packs. The admin of the site can choose which cards appear per day and manually add them or use WikiData API to automatically fetch 5 random cards.
Project Gallery
Home
The home screen, where the user can view the packs and open them.
Collection
The collection screen, where the user can view their cards and trade them in for credits.
Shop
The shop screen, where the user trade in their credits for more packs.
Account
The account screen, where the user can see their profile and settings. As well as their daily streaks of pack openings.
Admin rotation
The admin rotation screen, where the admin can see the rotation of the cards and manually add them per day.
Admin cards
The admin cards screen, where the admin can see the cards and manually add them or use the WikiData API to automatically fetch 5 random cards.
Tech Stack, Tools & Features
frontend
- Vite
- React
backend
- Node.js
- Supabase
features
- Login/register system (via Google)
- Card collection
- Daily packs
- Admin panel
- Automatic card fetching
- Daily rotation of cards
- Manual card adding
- Share to social media
data
- WikiData/Wikipedia API
Final Thoughts
This was one of the more 'funny' side projects. What if I could collect famous Belgian's in the form of cards? I've learned a lot about the WikiData API and how to use it, because WikiData uses a different format than the other APIs I've used before.