2026Dokončené
OMORI Wordle
Slovní hra inspirovaná populárním Wordle, postavená na motivy hry OMORI. Hráči hádají slova spojená s postavami, místy a tématy z herního světa. Aplikace nabízí uživatelské účty, ukládání postupu a každý den novou hádanku.
- Next.js
- TypeScript
- Tailwind CSS
- Drizzle ORM
- Neon Postgres
- Better Auth
- TanStack Query
- TanStack Hotkeys
- Vitest
- React Context
Náhled projektu
Kontext
Chtěl jsem propojit svůj zájem o hru OMORI s populárním konceptem denních hádanek po vzoru Wordle a zároveň si vyzkoušet kompletní full-stack v Next.js včetně autentizace a databáze.
Technický přístup
- Frontend postavený na Next.js App Routeru s využitím React Contextu pro správu herního stavu
- Drizzle ORM a Neon Postgres pro ukládání uživatelů a jejich statistik
- Better Auth pro správu uživatelských relací
- TanStack Query pro asynchronní načítání a cachování dat
- TanStack Hotkeys pro podporu klávesových zkratek
- Vitest pro jednotkové (unit) a integrační testy
Výzvy
- Vytvoření slovní banky navázané na herní reálie tak, aby neobsahovala spoilery ke klíčovým momentům příběhu
- Správa herního stavu a odezvy klávesnice mezi jednotlivými herními relacemi
- Ukládání herního postupu pro přihlášené uživatele
- Synchronizace stavu hry mezi klientem a serverem
Co jsem se naučil
- React Context se dobře hodí pro uzavřený herní stav, ale jeho rozsah je potřeba držet pevně pod kontrolou
- Logika denní hry se zjednoduší, pokud je výběr slova deterministický a odvíjí se od aktuálního data
- Vitest výrazně usnadnil izolované testování herní logiky a autentizačních procesů
Hlavní funkce
- Každodenní slovní hádanka
- Autentizace uživatelů
- Správa herního stavu
- Slovní banka na motivy OMORI
- Pokrytí testy ve Vitestu
Další projekt
Rezervační systém školního bufetu
Frontend rezervačního systému jídel školního bufetu, včetně studentského objednávání a admin nástrojů.