๐“๐ก๐ž ๐Ÿ๐ข๐ซ๐ฌ๐ญ ๐ ๐š๐ฆ๐ž ๐ฆ๐ฒ ๐ค๐ข๐๐ฌ ๐š๐ฉ๐ฉ๐ซ๐จ๐ฏ๐ž๐

Written by  on July 23, 2026 

I like good turn-based offline games. Recently, the kids brought home one that I won’t name here because my GitHub Pagesโ€“backed browser game is a shameless copy.

If you want to play it (free and safe): https://marcelpetrick.github.io/recognizer/

๐—ง๐—ต๐—ฒ ๐—ฟ๐˜‚๐—น๐—ฒ๐˜€ ๐˜๐—ฎ๐—ธ๐—ฒ ๐˜๐—ฒ๐—ป ๐˜€๐—ฒ๐—ฐ๐—ผ๐—ป๐—ฑ๐˜€ ๐˜๐—ผ ๐—ฒ๐˜…๐—ฝ๐—น๐—ฎ๐—ถ๐—ป: ๐˜›๐˜ธ๐˜ฐ ๐˜ค๐˜ข๐˜ณ๐˜ฅ๐˜ด. ๐˜Œ๐˜ช๐˜จ๐˜ฉ๐˜ต ๐˜ด๐˜บ๐˜ฎ๐˜ฃ๐˜ฐ๐˜ญ๐˜ด ๐˜ฆ๐˜ข๐˜ค๐˜ฉ. ๐˜Œ๐˜น๐˜ข๐˜ค๐˜ต๐˜ญ๐˜บ ๐˜ฐ๐˜ฏ๐˜ฆ ๐˜ฎ๐˜ข๐˜ต๐˜ค๐˜ฉ. ๐—™๐—ถ๐—ป๐—ฑ ๐˜๐—ต๐—ฒ ๐—บ๐—ฎ๐˜๐—ฐ๐—ต ๐—ณ๐—ฎ๐˜€๐˜๐—ฒ๐—ฟ ๐˜๐—ต๐—ฎ๐—ป ๐˜†๐—ผ๐˜‚๐—ฟ ๐—บ๐—ฎ๐˜๐—ฒ๐˜€.

It is super simple, but pattern matching requires concentration, and you have to be quick. ๐—œ๐˜’๐˜€ ๐—ด๐—ฟ๐—ฒ๐—ฎ๐˜ ๐—ณ๐˜‚๐—ป ๐—ฒ๐˜ƒ๐—ฒ๐—ป ๐—ฎ๐˜€ ๐—ฎ ๐˜€๐—ถ๐—ป๐—ด๐—น๐—ฒ ๐—ฝ๐—น๐—ฎ๐˜†๐—ฒ๐—ฟ with a local high-score list.

Building it raised three useful questions:
* ๐—›๐—ผ๐˜„ ๐—ฑ๐—ผ ๐˜†๐—ผ๐˜‚ ๐—ด๐˜‚๐—ฎ๐—ฟ๐—ฎ๐—ป๐˜๐—ฒ๐—ฒ that rule across all ๐Ÿ,๐Ÿ“๐Ÿ—๐Ÿ” possible card pairs?
* ๐—›๐—ผ๐˜„ ๐—ฑ๐—ผ ๐˜†๐—ผ๐˜‚ ๐˜๐˜‚๐—ฟ๐—ป a shared game into a good single-player challenge?
* ๐—›๐—ผ๐˜„ ๐—บ๐˜‚๐—ฐ๐—ต ๐—ถ๐—ป๐—ณ๐—ฟ๐—ฎ๐˜€๐˜๐—ฟ๐˜‚๐—ฐ๐˜๐˜‚๐—ฟ๐—ฒ does a small browser game actually need?

The mathematical part uses a finite projective plane. ๐—ง๐—ต๐—ฒ ๐˜๐—ฒ๐˜€๐˜ ๐˜€๐˜‚๐—ถ๐˜๐—ฒ ๐˜ƒ๐—ฒ๐—ฟ๐—ถ๐—ณ๐—ถ๐—ฒ๐˜€ ๐—ฒ๐˜ƒ๐—ฒ๐—ฟ๐˜† ๐—ฝ๐—ผ๐˜€๐˜€๐—ถ๐—ฏ๐—น๐—ฒ ๐—ฐ๐—ฎ๐—ฟ๐—ฑ ๐—ฝ๐—ฎ๐—ถ๐—ฟ.

The product stays deliberately small: 10, 20, or 50 cards, a timer, and local high scores. ๐˜•๐˜ฐ ๐˜ข๐˜ค๐˜ค๐˜ฐ๐˜ถ๐˜ฏ๐˜ต๐˜ด. ๐˜•๐˜ฐ ๐˜จ๐˜ญ๐˜ฐ๐˜ฃ๐˜ข๐˜ญ ๐˜ณ๐˜ข๐˜ฏ๐˜ฌ๐˜ช๐˜ฏ๐˜จ๐˜ด. ๐˜•๐˜ฐ ๐˜ฃ๐˜ข๐˜ค๐˜ฌ๐˜ฆ๐˜ฏ๐˜ฅ.

๐—” ๐˜€๐—ถ๐—ฑ๐—ฒ ๐—ป๐—ผ๐˜๐—ฒ ๐—ณ๐—ผ๐—ฟ ๐˜๐—ต๐—ผ๐˜€๐—ฒ ๐—ถ๐—ป๐˜๐—ฒ๐—ฟ๐—ฒ๐˜€๐˜๐—ฒ๐—ฑ ๐—ถ๐—ป ๐˜€๐—ผ๐—ณ๐˜๐˜„๐—ฎ๐—ฟ๐—ฒ ๐—ฑ๐—ฒ๐—น๐—ถ๐˜ƒ๐—ฒ๐—ฟ๐˜†
I also used the project as a compact, end-to-end SDLC example: written requirements, scope, and acceptance criteria; separated and testable domain logic; versioned storage with migration handling; unit, component, browser, mobile, and accessibility tests; formatting, linting, type checking, and build gates; locked dependencies with automated updates; and repeatable PWA deployment through GitHub Actions and GitHub Pages.

๐ˆ๐Ÿ ๐ฒ๐จ๐ฎ ๐ญ๐ก๐ข๐ง๐ค ๐ฒ๐จ๐ฎ ๐š๐ซ๐ž ๐ช๐ฎ๐ข๐œ๐ค๐ž๐ซ: ๐ฉ๐ฅ๐š๐ฒ ๐š๐ง๐ ๐ฉ๐จ๐ฌ๐ญ ๐ฒ๐จ๐ฎ๐ซ ๐ฌ๐œ๐จ๐ซ๐ž ๐Ÿค—

Category : JavaScript