Making wordle but for movies

I’ve been playing a lot of wordle lately and I thought it would be fun to make a similar game but for movies.

Solid.js. I’ve been wanting to try it out for a while now and this seemed like a good opportunity.
Vite. I’ve been using it for all my projects lately and I love it.
Tailwind CSS. I like using Tailwind to make my projects look good without much effort, and it’s approach to responsive design is more intuitive than vanilla css.

Every day, a new movie and actor will be available to guess. The user will have 6 tries to guess the movie and actor. The hints are either the movie’s castlist or the actor’s filmography.

I used the TMDb API to get the movie and actor data, including pictures. The python script downloads the data and saves it to a json file.
I created a function that generates a random movie and actor from the json file based on the client’s current date and time. This ensures that the movie and actor change every day but are the same for all users without the need for a backend.
On every guess, I check if the movie or actor is in the user’s guess and display the results accordingly.
I created a function that generates the hints based on the user’s guess and the movie or actor’s data.
I created a function that saves the user’s stats including streaks, wins, and losses to local storage.
I created a function that generates a shareable link with the user’s stats.

I had to learn how to use Solid.js and how to structure my components. Solid is similar to React but has some key differences that I had to get used to.

The game is live here: kino.wtf. I am still working on it so there might be some bugs. Issues and PRs are welcome.