JavaScript, React, Webpack, Firebase2024

Design Patterns Game

An interactive game that tests your familiarity with the 23 Gang of Four design patterns — read the code, guess the pattern.

Design Patterns Game

Guess the pattern. Learn it for real.

I show you a snippet of JavaScript; you guess which design pattern it is. 23 questions, one per GoF pattern, score at the end.

Reading docs makes my eyes glaze over — guessing from real code is what actually sticks. When you can look at a piece of code and name the pattern on first reaction, that's when you've really got it.

It started as a fork of zoltantothcom's Design-Patterns-JavaScript. I reworked the UI, translated the prompts into Chinese, and deployed it to my own domain. The /patterns reference page is still there for when I forget something.

The 23 patterns split into three groups — creational, structural, behavioral — the ones you'll meet in day-to-day work. React + Webpack, hosted on Firebase. Want to try it? Hit the demo and start guessing.