MatchUp.AI
- 2 Devlogs
- 6 Total hours
A static web app that predicts FIFA World Cup match outcomes based on team ratings and recent performances.
A static web app that predicts FIFA World Cup match outcomes based on team ratings and recent performances.
Wrapped up the project today.
The highlight was finally getting the whole pipeline working from start to finish. train_v1.py trains a Poisson GLM on old match data, dumps the coefficients into model.js. app.js grabs those in the browser to generate live win/draw/loss odds and full score predictions. Seeing everything actually work together for the first time was such a good feeling. It wasn’t at all smooth, though. First, I made a stupid typo: I wrote factorials(k) instead of factorials[k]. That completely killed the predictor for a while. Once I fixed that, I found an even dumber bug. I’d been multiplying the home team’s Poisson probabilities by… the home team’s Poisson probabilities. So the model had basically spent the afternoon thinking every match was a team playing against its own clone. Then JavaScript decided it wanted to be funny. I used regular quotes instead of backticks in a few places, so instead of showing the actual values, my UI was proudly displaying stuff like ${pct}%. A lot of debugging, a few “how is this even happening?” moments, and way too many commits later, it’s finally done. The predictions make sense, the frontend actually shows legit numbers, and I can stop lying to myself that bugs are “features.”
I am building a Poisson GLM model for predicting this FIFA world cup’s match outcomes! I’ve collected all the data I need, and the frontend’s finally alive (sort of). The dropdown menu, neutral venue toggle are up and rendering, and the loading screen for the entire results panel (expected goals, W/D/L bars, score matrix) works. I did spend a good chunk of my time convinced my CSS was cursed though. In the beginning stages of styling, no matter what I did, the web page didn’t change at all. Turns out I wrote style.css instead of styles.css when connecting it with my html, so the browser was just not loading any styles ever. Next up, app.js and model.js need to be coded. Right now the page is just a pretty shell with no logic behind it, so the dropdowns are sitting empty, and the results panel is stuck in the loading screen since there’s no data telling them what countries even exist!