Bodulica Shop — webshop za otočnu butigu s ručnim radom

Zašto ovaj projekt

Bodulica je butiga ručnih radova, domaćih proizvoda i suvenira u srcu Betine na otoku Murteru. Vlasnica Ljubica nije tražila generički predložak — trebao joj je webshop koji priča priču otoka, prikazuje proizvode malih proizvođača i omogućuje kupnju bez kompliciranja.

Cilj je bio jasan: posjetitelj mora razumjeti što kupuje, osjetiti autentičnost, i moći naručiti online karticom, WhatsAppom ili uživo u butigi.

Što webshop radi

Javna stranica na bodulica.shop kombinira:

Katalog proizvoda iz baze — s kategorijama, opisima, slikama i oznakama (npr. ručni rad, hrvatski proizvod)
Košaricu — dodavanje proizvoda, pregled ukupnog iznosa, nastavak na plaćanje
Stripe checkout — sigurno plaćanje karticom (PCI DSS Level 1, podaci kartice ne prolaze kroz našu aplikaciju)
Dvojezičnost (hr / en) — za domaće i strane turiste
Recenzije kupaca s mogućnošću odgovora trgovine
FAQ — dostava, radno vrijeme, personalizacija, priča iza imena Bodulica
Kontakt kanali — WhatsApp, Instagram, e-mail i fizička adresa u Betini

Za kupce koji ne žele karticu odmah, narudžba i dalje ide kroz WhatsApp ili Instagram DM — webshop nije zid, nego most između online i offline prodaje.

Kako je tehnički složen

Frontend (shop)

Custom webshop — prilagođen brendu Bodulice, ne gotov WooCommerce/Shopify skin. Dizajn podržava svijetlu i tamnu temu, mobilnu košaricu i brzo učitavanje kataloga.

Proizvodi se ne hardkodiraju u HTML: frontend povlači podatke preko Supabase Edge Function (bodulica-api), tako da promjena cijene ili slike u adminu odmah se vidi na shopu.

Backend — Supabase

Baza (projekt bodulica-shop, EU) drži sve što trgovina treba:

Tablica / modul	Uloga
`products`	Naziv, cijena, opis, slike, kategorija, stanje, HR/EN prijevodi
`orders` + `order_items`	Narudžbe, kupac, adresa, status, iznosi
`product_reviews`	Recenzije i odgovori trgovine
`faqs`	Česta pitanja na stranici
`inbox_*`	Sinkronizacija poruka s e-mail inboxom
`inventory_log`	Praćenje promjena zaliha
`webhook_events`	Stripe webhook događaji

Plaćanje — Stripe

Kad kupac klikne Naruči odmah, Edge Function kreira Stripe Checkout Session s točnim artiklima iz košarice. Nakon uspješnog plaćanja:

narudžba se zapisuje u Supabase
status se prati u admin panelu
za unikatne proizvode (is_unique) shop ih može automatski skriti nakon prodaje

Stripe rješava PCI compliance — mi ne pohranjujemo brojeve kartica.

Admin panel (`/admin`)

Ljubica upravlja trgovinom kroz zaseban admin panel (lozinka + JWT token), bez da mora dirati kod ili bazu ručno.

Sekcije:

Pregled — broj narudžbi, prihod, aktivni proizvodi, zadnje narudžbe
Proizvodi — dodavanje, uređivanje cijene, slika, opisa; novi proizvod se automatski veže i na Stripe
Arhiva — prodani ili deaktivirani artikli (mogu se reaktivirati)
Narudžbe — statusi (npr. nova, plaćena, poslana), detalji kupca i adrese
Recenzije — odobravanje, skrivanje, odgovor trgovine vidljiv na shopu
Poruke (inbox) — pregled e-mail komunikacije s kupcima
Vodič — ugrađena pomoć za Stripe i svakodnevni rad panela

Admin nije “plugin” treće strane — napravljen je za ovaj shop i ovaj workflow.

Admin na Protos Webu (paralela)

Na protosweb.eu imamo vlastiti admin (/admin) za ovu stranicu — blog, portfolio, kontakt upite, newsletter. Ista filozofija: jedna ploča, bez CMS-a koji ne razumiješ.

Ovaj članak, na primjer, objavljen je kroz Protos Web admin → Supabase blog_posts → markdown na /blog/bodulica-shop-webshop-za-otocnu-butigu. Bodulica ima svoj admin za proizvode i narudžbe; Protos Web ima svoj za sadržaj i marketing.

Integracije koje stvarno doprinose

Supabase — jedan izvor istine za proizvode, narudžbe i recenzije; EU hosting
Stripe — kartično plaćanje bez straha od sigurnosti
WhatsApp / Instagram — kanali koje kupci na Jadranu već koriste
E-mail inbox sync — poruke na jednom mjestu u adminu
GitHub Actions + deploy — promjene na shopu idu kontrolirano u produkciju
Keep-alive cron — baza ostaje aktivna (važno na free tieru)

Što dolazi dalje

Shop je u produkciji i funkcionalan, ali optimizacija nije gotova — planiramo dodatno dotjerati UX, SEO, katalog i performanse na bodulica.shop. Ovaj članak dokumentira trenutno stanje projekta kao referenca i case study.

Želiš sličan webshop ili admin za svoju trgovinu? Javi nam se — radimo custom rješenja, ne generičke predloške.