Schmaq: receptová appka s AI importom
PWA na ukladanie a varenie receptov, ktorá z odkazu alebo textu pomocou AI automaticky vytiahne ingrediencie, kroky, časy aj výživové hodnoty.
Pre koho a prečo
Schmaq som začal stavať ako nástroj pre seba a manželku, miesto, kde sa dajú recepty držať na jednom mieste a hlavne podľa nich variť. Z osobného nástroja sa stala plnohodnotná PWA s AI importom a sociálnymi funkciami.
Čo bolo treba vyriešiť
- Recepty sú roztrúsené po weboch, screenshotoch a poznámkach.
- Pri varení sa v dlhom texte ťažko drží krok a sledujú časy.
- Prepisovať recept z webu ručne je otrava a väčšina appiek to nevie spraviť dobre.
Čo som postavil
Appku, do ktorej vložíš odkaz na recept alebo text, a AI z neho sama vytiahne ingrediencie (aj po skupinách), kroky s časmi, porcie a výživové hodnoty. Potom appka vedie kuchára krok po kroku s časovačmi, spraví nákupný zoznam a recepty sa dajú zdieľať s priateľmi.
Ako aplikácia funguje v praxi
Knižnica receptov
Recepty v kategóriách (hlavné jedlá, polievky, dezerty a ďalšie), prehľadné karty s počtom ingrediencií.
AI import
Recept pridáš buď ručne, alebo vložením odkazu či textu. Zvyšok doplní AI. Toto je jadro projektu.
Detail receptu a režim varenia
Ingrediencie po skupinách, kroky s časovačmi priamo v texte, výživové hodnoty a tlačidlo „Variť" pre režim krok po kroku. Nákupný zoznam generovaný z ingrediencií a perzistentný časovač, ktorý beží aj keď prepneš obrazovku.
Priatelia a zdieľanie
Pozvánky cez odkaz, zoznam priateľov a zdieľanie receptov medzi používateľmi.
Ako funguje AI import
Vložíš odkaz na recept alebo text
Stačí URL stránky s receptom alebo skopírovaný text z článku.
n8n workflow stránku stiahne a AI extrahuje dáta
Ingrediencie, kroky, časy a výživové hodnoty sa doplnia automaticky.
Predvyplnený recept skontroluješ a uložíš
Úpravy pred uložením, potom recept v knižnici a pripravený na varenie.
Technické riešenie a výzva
Tu je reálna hĺbka projektu: architektúra, zlomové rozhodnutia a problém, ktorý som musel vyriešiť, aby AI import fungoval spoľahlivo.
Architektúra
React + TypeScript + Vite frontend, Supabase (auth, PostgreSQL, realtime), TanStack Query, PWA. AI import beží cez n8n ako orchestračnú vrstvu (Firecrawl na scraping + Claude na extrakciu), nie priamo z frontendu.
Kľúčové rozhodnutie
Import z URL som najprv skúšal riešiť cez CORS proxy priamo vo frontende. Bola to slepá ulička. Presun logiky do n8n workflow bol zlomový bod, ktorý to spravil spoľahlivým a rozšíriteľným.
Reálna výzva, ktorú som vyriešil
AI najprv vracalo vymyslené ingrediencie. Príčina: scraper vracal len navigačné HTML, takže model nemal reálny obsah. Riešenie: prepnúť scraper na surové HTML, vyťahovať štruktúrované schema.org/Recipe (JSON-LD) dáta s parsovaním ISO 8601 časov a odvodzovať skupiny ingrediencií z nadpisov sekcií. Po tomto import začal dávať presné recepty.
Detaily, na ktorých záleží
Perzistentný globálny časovač cez localStorage (beží aj po prepnutí obrazovky, so zvukom a vibráciou), pozvánkový systém cez UUID tokeny a iPhone safe-area fixy pre PWA.
Stav
Schmaq je live na schmaq.vercel.app ako funkčná PWA. Vznikol ako osobný projekt, no technicky ukazuje to, čo viem postaviť: full-stack appku s reálnou AI automatizáciou, nie len ukladanie dát.
Máte podobný projekt? Napíšte mi.
Osobné stretnutie nie je problém. Ozvem sa do 24 hodín.
Späť na projekty