Znáte to. Sedíte s dětmi nad úkoly, venku je hezky, ale vy musíte podesáté opakovat násobilku nebo vyjmenovaná slova. Je to nuda.

Nejdřív jsem to zkoušel řešit hrubou silou AI. Generoval jsem jim příklady na papír, potom interaktivní kvízy. Fungovalo to, ale chyběla tomu šťáva. Chyběla tomu gamifikace, zpětná vazba a hlavně data.

“Tak jsem si říkal, že mi nezbývá nic jiného, než si to napsat sám.”

Vítejte u představení Kveez.app, mého nového projektu, který začal jako domácí pomůcka a doufám, že přeroste v plnohodnotnou edTech platformu. Dnes se podíváme nejen na to, co aplikace umí, ale i na to, co bublá pod její kapotou.

Co je Kveez.app?

Než se vrhnu do kódu, krátce k funkci. Kveez.app je edTech (Education Technology) nástroj zaměřený na nejen české školní osnovy. Cílem není nahradit školu, ale udělat z “domácího drilu” zábavu.

  • Široké spektrum témat: Od sčítání pro prvňáčky po fyziku pro druhý stupeň a to je jen začátek.
  • Chytré rozdělení: Úlohy podle ročníků.
  • Gamifikace: Děti vidí svůj postup, sbírají body a baví je to.
  • Přístupnost: Webová aplikace funguje na PC, tabletu i mobilu.

Tech Stack

Frontend: React 19 & Vite 7

Aplikace běží na Reactu 19 a jako build tool používám Vite 7.

  • Směrování řeší React Router 7.
  • Design řeším pomocí TailwindCSS. Umožňuje mi rychle iterovat vzhled, aby to vypadalo dobře jak na tátově monitoru, tak i dceřině tabletu.
  • O ikonky se stará balíček Lucide React – čisté, lehké, SVG.

Serverless a Edge: Cloudflare + Prisma

Tohle je asi největší změna oproti klasickému hostingu. Celá aplikace je nasazená přes Wrangler do sítě Cloudflare a pro DB využívám Prisma Postgres.

  • Databáze: Pro lokální vývoj používám Docker kontejner s Postgressem na mém domácím serveru. Pro produkci jsem zvolil Prisma Postgres, distribuovanou SQL databázi. Je to rychlé a pro tento typ projektu ideální.
  • Query Builder: Aby se mi s databází pracovalo dobře a typově bezpečně (TypeScript is king!), používám Kysely.

Autentizace a bezpečnost

Nechtěl jsem spravovat hesla uživatelů.

  • Použil jsem knihovnu Better-Auth.
  • Přihlášení zatím přes Google OAuth a brzy budou další možnosti. Je to bezpečné, rychlé a nikdo si nemusí pamatovat další heslo.

UX vychytávky pro děti

Aby to děti bavilo, muselo to být “živé”.

  • Avataři: používám DiceBear. Děti milují, když mají u profilu veselý obrázek, který se vygeneruje (nebo si ho mohou kdykoliv v profilu upravit).
  • Oslava úspěchu: když se kvíz povede, musí přijít odměna. Knihovna React-confetti zajistí ten správný vizuální efekt padajících konfet.
  • Grafy: pro všechny, kteří chtějí vidět progres v čase, je tu Recharts.

Veřejná beta

Aplikace je veřejně dostupná. Je to MVP (dle Wikipedie - minimální životaschopný produkt). Obsah postupně plním, moje děti už soutěží a dávají mi drsnou zpětnou vazbu.

Nyní potřebuji rozšířit testování. Potřebuji zjistit, jak se Prisma Postgres chová pod zátěží.

Závěr

Po testování plánuji přidat nativní aplikace pro iOS a Android a další funkce.

Výzva pro vás: Zkuste se přihlásit na Kveez.app. Otestujte vaše znalosti a dejte mi vědět, jak se vám aplikace líbí po technické i uživatelské stránce.

Napište mi do komentářů, co si myslíte o volbě Cloudflare D1 nebo o aplikaci jako takové.