Like any competitive family, we’ve run our own sweepstakes for this year’s FIFA World Cup. It’s nothing new for us, but this tournament is different. FIFA increased the number of teams from 32 to 48, making the competition bigger and more challenging than ever before. It’s the first time the tournament has expanded since it began in 1930.
Every tournament, I either print a wall chart or order one online, eagerly watching each match and updating the results as the competition progresses. But now that my kids are older, much more tech-savvy, and have no interest in a printed sheet of paper stuck to the wall, I thought there had to be a better, more modern way of doing things.
I set to work and dusted off my rusty 26-year-old PHP skills to build a dashboard. The idea was to create a single-page website that would automatically know which teams belonged to myself, Aman, Jay and Mrs Retro, then update everything as the scores changed.
As someone with very little experience of API integration and pulling data from external sources, I got some help from my trusty friend ChatGPT. It showed me how to extract the data feed from the FIFA website and use it to display the information I needed on the dashboard.
I’ve previously worked with my own datasets in MySQL, which I’m much more comfortable with, dating back many moons to when I worked on Moodle projects.
I had a rough design in mind from the start. I wanted to replicate some of the FIFA styling for this tournament, but it was vital that the data remained accurate and up to date.
I’ll skip straight to the end result. After many hours of work and slightly later than planned, the dashboard finally went live shortly after the tournament started.
Features
⚽️ Each person has a points score. Teams earn 3 points for a win, 1 point for a draw and 0 points for a loss. The scores are calculated automatically and the player cards are reordered based on the current standings.
⚽️ Under each person’s card is a row of flag emojis representing the teams they drew in the sweepstake. As teams are eliminated, their flags fade to grey.
⚽️ A “Last 5 Results” section shows the most recent match results, including the teams involved, the score and who each team belongs to in the sweepstake.
⚽️ Today’s Matches displays all fixtures scheduled to take place on the current day.
⚽️ A Tournament Progress card shows how many matches have been played out of the 104 scheduled for the tournament.
⚽️ The Current Leader card highlights whoever is currently at the top of the standings.
⚽️ Individual team cards show every team owned by each player and link directly to the official FIFA team pages.
I’ve really enjoyed working on this project, but it wasn’t without its challenges. I’m nowhere near as fluent in PHP as I once was, so there was a lot of Googling, checking syntax and reminding myself how to do even simple things. Integrating HTML within PHP, making sure I’d used the correct quotation marks, and not forgetting a crucial closing brace all became part of the daily routine.
I’m sure an experienced developer would look at my code and immediately ask, “Why have you done it like that?” But it made sense to me at the time, and as long as it works, that’s what matters.
One concern is what happens once the tournament ends. The dashboard currently relies entirely on FIFA’s live data feed, so there is still more work to do. I’d like to add a date selector that allows me to view any day of the tournament and have those snapshots stored permanently, even after the live feed is no longer available.
For now, though, it’s a standalone webpage that the whole family can access from any device, and most importantly, it does exactly what I built it to do.
Every tournament, I either print a wall chart or order one online, eagerly watching each match and updating the results as the competition progresses. But now that my kids are older, much more tech-savvy, and have no interest in a printed sheet of paper stuck to the wall, I thought there had to be a better, more modern way of doing things.
💡
I set to work and dusted off my rusty 26-year-old PHP skills to build a dashboard. The idea was to create a single-page website that would automatically know which teams belonged to myself, Aman, Jay and Mrs Retro, then update everything as the scores changed.
As someone with very little experience of API integration and pulling data from external sources, I got some help from my trusty friend ChatGPT. It showed me how to extract the data feed from the FIFA website and use it to display the information I needed on the dashboard.
I’ve previously worked with my own datasets in MySQL, which I’m much more comfortable with, dating back many moons to when I worked on Moodle projects.
I had a rough design in mind from the start. I wanted to replicate some of the FIFA styling for this tournament, but it was vital that the data remained accurate and up to date.
I’ll skip straight to the end result. After many hours of work and slightly later than planned, the dashboard finally went live shortly after the tournament started.
Features
⚽️ Each person has a points score. Teams earn 3 points for a win, 1 point for a draw and 0 points for a loss. The scores are calculated automatically and the player cards are reordered based on the current standings.
⚽️ Under each person’s card is a row of flag emojis representing the teams they drew in the sweepstake. As teams are eliminated, their flags fade to grey.
⚽️ A “Last 5 Results” section shows the most recent match results, including the teams involved, the score and who each team belongs to in the sweepstake.
⚽️ Today’s Matches displays all fixtures scheduled to take place on the current day.
⚽️ A Tournament Progress card shows how many matches have been played out of the 104 scheduled for the tournament.
⚽️ The Current Leader card highlights whoever is currently at the top of the standings.
⚽️ Individual team cards show every team owned by each player and link directly to the official FIFA team pages.
I’ve really enjoyed working on this project, but it wasn’t without its challenges. I’m nowhere near as fluent in PHP as I once was, so there was a lot of Googling, checking syntax and reminding myself how to do even simple things. Integrating HTML within PHP, making sure I’d used the correct quotation marks, and not forgetting a crucial closing brace all became part of the daily routine.
I’m sure an experienced developer would look at my code and immediately ask, “Why have you done it like that?” But it made sense to me at the time, and as long as it works, that’s what matters.
One concern is what happens once the tournament ends. The dashboard currently relies entirely on FIFA’s live data feed, so there is still more work to do. I’d like to add a date selector that allows me to view any day of the tournament and have those snapshots stored permanently, even after the live feed is no longer available.
There are plenty of other features and cards I’d have liked to build, but I’ll save those ideas for another day. Maybe they’ll appear in a future version, or perhaps they’ll have to wait until Euro 2028.
For now, though, it’s a standalone webpage that the whole family can access from any device, and most importantly, it does exactly what I built it to do.
You can visit the dashboard at lota.co/fifa
