Indkøbsvogn
En indkøbsliste, der lærer din vej gennem butikken, og som virker uden net.
- Problem
- Indkøbslister står i den rækkefølge, man skrev dem, ikke i den rækkefølge, man går gennem butikken.
- Bygget til
- En husstand, der deler én liste på flere telefoner.
- Min rolle
- Mit eget projekt. Jeg har designet og bygget det hele.
- Status
- Koden ligger åbent på GitHub, med test.
react · cloudflare · hono
Indkøbsvogn er en indkøbsapp, der lærer, hvilken vej du går gennem hver butik. Efter et par ture bliver listen automatisk sorteret, så varerne står i den rækkefølge, du møder dem. Listen deles mellem husstandens telefoner, men selve indkøbsturen virker, selvom nettet er dårligt.
Hvorfor jeg byggede det
De fleste indkøbsapps er bare en to do-liste. Man ender med at gå frem og tilbage i butikken, fordi listen står i den rækkefølge, man skrev den. Jeg ville have en app, der lærer min vej og sorterer listen efter den. Jeg ville også have, at kundekortet dukker op af sig selv, så jeg ikke skal lede efter det, når der ikke er signal.
Derfor skulle appen virke uden net fra starten. En indkøbstur skal fungere i kælderen, i en fyldt butik og der, hvor dækningen er dårlig, og bagefter skal alles telefoner blive enige om, hvad der står på listen.
Sådan virker det
Appen husker, i hvilken rækkefølge du krydser varer af. Efter et par ture ved den nok til at kende din vej gennem butikken. Nye varer på listen bliver sat ind det rigtige sted, og hvis du selv flytter rundt på varerne, bruger appen også det næste gang.
Kundekort hører til en bestemt butik og dukker op, når du handler der. De ligger på telefonen, så de virker uden net.
Appen er lavet til en husstand: flere telefoner, én liste. Butikker, varer, lister og tidligere ture bliver synkroniseret i baggrunden via Cloudflare D1, mens den tur, du er i gang med, ligger på telefonen. Appen viser, om ændringer venter, er ved at blive sendt eller er gået galt, prøver igen af sig selv og mister ikke dine ændringer, hvis du retter noget, mens den synkroniserer.
Teknik og test
Bygget med React 19, TypeScript og Vite, og Hono på Cloudflare Pages Functions til serveren. Data ligger i Cloudflare D1, og man logger ind med en kode eller et link på mail.
Koden ligger åbent på GitHub og har test af, hvordan appen lærer ruten, login, databasen og synkroniseringen.