Optimistic cart med lagervennlige server actions
Rask React-UX uten å love varer som er utsolgt
Kunder forventer øyeblikkelig tilbakemelding når de legger varer i handlekurven. I en headless Shopify-butikk er cart-operasjoner likevel ekte nettverkskall. Uten god UX føles butikken treg, selv om backend er rask.
Vi implementerte optimistic UI med React 19s useOptimistic og Next.js server actions. Skjermen oppdateres med en gang, mens den ekte endringen kjøres på serveren mot Shopify. Brukeren ser resultatet før roundtrip er ferdig.
Samtidig kan vi ikke love det vi ikke har. Serveren sjekker lagerstatus og returnerer tydelige feilmeldinger hvis en variant er utsolgt eller ikke lenger tilgjengelig. Optimistic state rulles tilbake når virkeligheten sier nei.
Cart-laget håndterer også rabattkoder, personlige tilbud og fremdrift mot gratis frakt. Det er samme handlekurv-opplevelse, bygd for App Router i stedet for Online Store-theme.
Balansen er poenget: rask React-opplevelse der det er trygt, og streng korrekthet der lager og pris betyr noe. feelme.no skal føles rask, uten å bli unøyaktig.
Vil du at handlekurven skal føles lynrask, uten at lagerstatus blir feil? Eon AS bygger headless cart i Next.js, snappy for kunden og korrekt mot Shopify.