Skip to content

amamenko/hollywoodle

Repository files navigation

MIT License LinkedIn


Hollywoodle

A MERN-stack Hollywood-themed
Wordle Spinoff Game

Visit Website · Report Issue

Background

Wordle is a massively popular web-based word game initially created by Welsh software engineer Josh Wardle and currently owned by the New York Times Company. Since the game's incepetion, many clones and similar spin-off games have been created - perhaps the largest listing of all such games can be found at the Wordleverse website.

In March of 2022, it seemed that the Wordleverse had a dearth of movie-related Wordle spin-offs. With the 94th Academy Awards (popularly known as the Oscars) quickly approaching, the timing seemed perfect for a Hollywood-themed Wordle-like game to enter the Wordleverse.

Originally the brainchild of Alex Jaloza, Hollywoodle provides users two new daily actors to link either by movie or by co-star with the fewest possible guesses. A user's "score" is divided into two components - degrees of separation and number of moves.

The degrees of separation follows the original rules of the Six Degrees of Kevin Bacon and is defined as the number of correctly guessed films that connect the two actors.

The player's moves are defined as the sum of the player's interactions while completing a game. The user gains a certain amount of "moves" for each guess - 1 move for a correct guess, 3 moves for an incorrect guess, and 2 moves for a guess of a movie that only features the final actor and not the first or current one (partial credit). If a user needs a hint they are penalized 1 move.

In essence, the objective of the game is to link the two given actors with as few moves as possible - similar to the Six Degrees of Kevin Bacon.

Functionality

Hollywoodle is built with the MERN stack and features a React-Typescript front-end with a Node/Express Typescript server linked to a MongoDB Atlas Database. The application can be broken down into two parts:

Server-side

  • Uses the TMDB API to update and store the details of two popular actors (including names, images, TMDB IDs, genders, and most popular recent movie data) in a MongoDB Atlas Database every night at midnight ET.
  • Queries the MongoDB database to send actor data to the front-end (both daily and archived data.)
  • If a user completes the connection for the first time that day, updates aggregated list of all top paths played by players based on degrees of separation and popularity.
  • Sends live changes of top daily paths via Socket.IO to client side if a user is viewing the top paths component.

Client-side

  • Requests actor data (daily or archived) from the backend and renders details about the initial and final actor for the user to guess the relation.
  • Sets a dark/light-mode theme based on the user's native preferred specification (although this can also be manually toggled by the user).
  • Uses React's Context API to store and access widely-used state variables such as total moves and dark-mode configuration throughout the application.
  • Autosuggests movies or actors (details of which are once again fetched from TMDB) based on a user's search input.
  • Determines the correctness of a user's guess selection by means of movie cast ID lookup that searches for a match using TMDB's movie and actor IDs.
  • Displays a popcorn emoji (🍿) confetti rain effect when a user successfuly links the first given actor with the final given actor.

Deployment

Client-side deployed with Vercel. Custom domain from Freenom with DNS routing provided by Cloudflare.

Server deployed via Heroku. Free Heroku dyno kept awake with UptimeRobot.

License

Distributed under the MIT License. See LICENSE.txt for more information.

Contact

Avraham (Avi) Mamenko - avimamenko@gmail.com

Project Link: https://github.com/amamenko/hollywoodle

Press Feature

Metro UK - "Wordle meets Six Degrees Of Kevin Bacon in Hollywoodle"

Acknowledgements