Waarom we het e-commerceplatform van Hana & Nord opnieuw hebben uitgevonden

Als strategisch communicatiebureau en technologiepartner verkopen we bij For the Dream geen dozen, maar expertise, design en slimme code. En wanneer een klant zoals het high-end designmerk Hana & Nord bij ons aanklopt, doen we niets liever dan een digitaal platform bouwen dat exact aansluit op hun visie.

Hana & Nord verkoopt geen standaard massaproducten, maar serene interieurstukken waarin Japans minimalisme en Scandinavische functionaliteit (de "Japandi" esthetiek) samenkomen. Toen we de startfase van hun webshop bespraken, botsten we op een fundamentele uitdaging: hoe creëer je een online winkelervaring die net zo serene, snel en verfijnd aanvoelt als het binnenstappen in een fysieke showroom, zonder direct vast te zitten aan de rigide structuren, maandelijkse abonnementskosten en transactionele overhead van traditionele e-commerceplatformen zoals Shopify?

Natuurlijk is er Shopify. Of WooCommerce. Maar dergelijke systemen dwingen je al snel in een keurslijf van plugins, trage scripts en generieke sjablonen. Voor een premium merk dat rust, vakmanschap en absolute visuele perfectie wil uitstralen, introduceert dit onnodige ruis. Elke extra Shopify-app die je installeert om je voorraad, kortingen of klantenservice te regelen, vertraagt je webshop en verhoogt je maandelijkse kosten.

Het ironische is dat we met moderne webtechnologieën zoals Next.js, Prisma en PostgreSQL in de basis al over een extreem krachtige en flexibele toolkit beschikken. Als we lokaal Europees vakmanschap en serene interieurs vermarkten, waarom zouden we de digitale etalage dan niet met exact hetzelfde oog voor detail en vakmanschap ontwerpen en bouwen?

In dit artikel nemen we je mee in de architectuur, de database-keuzes en de technische afwegingen achter het e-commerceplatform dat we voor Hana & Nord hebben ontworpen: een bliksemsnelle, rustgevende en volledig op maat gemaakte retail-engine.

FOR THE DREAM × HANA & NORD

Benieuwd naar onze serene collectie?

Ontdek handgemaakte Japandi meubelen die rust en minimalistische elegantie in je interieur brengen.

Bekijk de webshop

Bij het ontwerpen van het platform keken we kritisch naar de pijnpunten die retailers dagelijks ervaren met standaard SaaS-oplossingen. De in-house engine is ontworpen om een vloeiende workflow te creëren voor zowel de consument als de beheerder.

Traditionele webshops verspringen en haperen vaak tijdens het laden door zware advertentie-scripts, cookies en slecht geoptimaliseerde afbeeldingen. Dit verstoort de serene rust die een klant hoort te ervaren.

Door de inzet van Next.js met geoptimaliseerde statische rendering laden de productpagina's binnen milliseconden. Lay-outverschuivingen (Cumulative Layout Shift) zijn herleid tot nul, waardoor de klant in alle rust door de collectie kan navigeren.

Om klantvragen en bestellingen op te volgen, ben je al snel genoodzaakt om externe tools zoals HubSpot of Zendesk te koppelen. Dit leidt tot gefragmenteerde klantdata en extra maandelijkse licentiekosten.

We hebben voor Hana & Nord een eigen CRM-systeem direct in de database gebouwd. Inbound en outbound e-mails worden via de Resend API gesynchroniseerd en direct opgeslagen in de EmailThread- en EmailMessage-modellen. Klantvragen worden hierdoor direct in ons eigen beheerpaneel beantwoord, gekoppeld aan de klantgeschiedenis.

Serene Japandi esthetiek en minimalistisch vakmanschap

Concept en minimalistische merk-identiteit

Natuurlijke materialen en fysieke showroom branding

Stof- en houtvarianten gekoppeld aan de PostgreSQL JSONB data

Swipe om alle schermen te bekijken ➔

Het opzetten van geavanceerde triggers—zoals een e-mail bij een verlaten winkelwagen of een persoonlijke heractiveringskorting na een aankoop—vereist vaak dure en complexe marketing-automations.

In de database die we voor Hana & Nord hebben opgezet, draaien automatische retentieregels via de AutomationSetting- en Discount-modellen. Zodra een trigger (zoals een verlaten winkelwagen) wordt geactiveerd, genereert het systeem automatisch een unieke, tijdelijke kortingscode en stuurt deze direct via Resend naar de klant.

Handmatige orderverwerking en het apart aanmaken van verzendlabels in externe logistieke portalen kost tijd en is extreem foutgevoelig.

De complete checkout-stroom is gekoppeld aan Stripe Checkout voor een veilige en snelle betaling. Na een succesvolle betaling schiet onze backend direct een verzoek naar de Sendcloud API. Het verzendlabel wordt volautomatisch gegenereerd en de unieke Sendcloud trackinglink wordt direct opgeslagen in het Order-model en gemaild naar de klant.

We wilden voor hen geen standaard template-webshop bouwen. We wilden een digitaal platform bouwen dat aanvoelt als een robuust, veilig en vloeibaar verlengstuk van het merk Hana & Nord.

graph TD
    A[Klant Bestelling] -->|Stripe Checkout| B(Stripe Webhook Handler)
    B -->|Status: PAID / Prisma ORM| C[(PostgreSQL / Supabase)]
    C -->|Trigger / Sendcloud API| D[Verzendlabel & Tracking URL]
    C -->|Trigger / Resend API| E[Automatische Mail & Retentie]
    F[Klant Support / Mail Sync] <-->|Resend API| G[Custom CRM Admin Paneel]
    G <-->|Prisma ORM| C
    H[Beheer Catalogus & Orders] <-->|NextAuth v5| G

Consumenten haken af bij laadtijden van langer dan twee seconden. Bovendien is uitstekende vindbaarheid in Google (SEO) van levensbelang voor een e-commerceplatform.

Next.js 15 stelt ons in staat om statische content (zoals hun homepage and productoverzichten) server-side te renderen (SSR) en te cachen voor ultieme snelheid. Zodra een klant naar de checkout gaat, neemt de dynamische client-side React-laag het over om een soepele, interactieve afhandeling te garanderen.

Standaard e-commerce-templates voelen vaak druk en onrustig aan. We wilden een visuele rust creëren met vloeiende, organische overgangen.

Door het minimalisme van Tailwind te combineren met de toegankelijke component-primitives of Radix UI hebben we een volledig eigen design system gebouwd. Framer Motion voegt hier subtiele, serene micro-animaties aan toe—zoals het zachtjes infaden van productafbeeldingen en vloeibaar paginatransities die de rust van een minimalistisch interieur weerspiegelen.

Bestellingen, varianten (zoals houtsoort of stofkleur), promoties en klantgegevens moeten foutloos aan elkaar gekoppeld blijven. Een database-fout mag nooit leiden to een verloren bestelling.

PostgreSQL fungeert als de primaire, relationele database. Met Prisma als ORM hebben we een type-safe database-interface. Compleele productgegevens—zoals specificaties en flexibele varianten—slaan we op via PostgreSQL's krachtige JSONB-velden in het Product-model. Dit biedt de flexibiliteit van een NoSQL-database met de betrouwbaarheid van een relationele database.

Klanten moeten veilig kunnen inloggen om hun bestelgeschiedenis te bekijken, terwijl beheerders via een afgeschermd dashboard de catalogus en orders beheren.

NextAuth.js (v5 beta) regelt de volledige authenticatiestroom. Met de Prisma-adapter worden gebruikerssessies direct en veilig in de database opgeslagen. Via strikte rolgebaseerde checks (USER versus ADMIN) wordt de toegang tot het administratiepaneel en de in-house CRM-inbox hermetisch afgeschermd.

Betalingsverwerking en verzending moeten absoluut betrouwbaar zijn om het vertrouwen van de consument te behouden.

Zodra een klant afrekent, wordt hij doorverwezen naar een beveiligde Stripe Checkout-omgeving. Onze webhook-handler vangt de succesvolle betaling op, past de orderstatus in PostgreSQL aan naar PAID, en triggert direct de Sendcloud API om de zending aan te melden. De klant ontvangt direct zijn tracking-URL zonder dat er een menselijke handeling aan te pas is gekomen.

E-mails moeten onmiddellijk in de inbox belanden en misbruik van de checkout of contactformulieren door bots moet worden uitgesloten.

We vertrouwen op Resend voor alle e-mailcommunicatie van Hana & Nord, wat een extreem hoge afleverratio garandeert. Om onze formulieren te beveiligen tegen spam en brute-force aanvallen, gebruiken we Cloudflare Turnstile—een privacyvriendelijk alternatief voor Google reCAPTCHA dat de rustige gebruikerservaring niet verstoort met vervelende puzzels.

De database is ontworpen rondom een relationele PostgreSQL-structuur, waarbij flexibele JSONB-velden worden ingezet om complexe productvariaties op te vangen.

classDiagram
  class User {
    String id [PK]
    String email [Unique]
    String role
    String streetAndNumber
    String city
    Boolean subscribedToNewsletter
    DateTime createdAt
  }

  class Product {
    String id [PK]
    String slug [Unique]
    String name
    String category
    Json variants
    Json sections
    Json usp
    DateTime createdAt
  }

  class Order {
    String id [PK]
    String userId [FK]
    String status
    Float totalAmount
    String streetAndNumber
    String city
    Int sendcloudParcelId
    String trackingUrl
    DateTime createdAt
  }

  class OrderItem {
    String id [PK]
    String orderId [FK]
    String productId [FK]
    String variantId
    Int quantity
    Float price
  }

  class Review {
    String id [PK]
    Int rating
    String comment
    String userId [FK]
    String productId [FK]
    DateTime createdAt
  }

  class Discount {
    String id [PK]
    String code [Unique]
    String type
    Float amount
    Boolean active
    DateTime expiresAt
  }

  class AutomationSetting {
    String id [PK]
    String rule [Unique]
    Boolean active
    Int discount
    Float conditionAmount
  }

  class EmailThread {
    String id [PK]
    String customerEmail
    String subject
    String status
    DateTime createdAt
  }

  class EmailMessage {
    String id [PK]
    String threadId [FK]
    String messageId [Unique]
    String from
    String to
    String bodyHtml
    Boolean isIncoming
    DateTime createdAt
  }

  class Promotion {
    String id [PK]
    String name
    String type
    String discountType
    Float discountValue
    DateTime createdAt
  }

  User "1" --> "0..*" Order : plaatst
  User "1" --> "0..*" Review : schrijft
  Order "1" --> "1..*" OrderItem : bevat
  Product "1" --> "1..*" OrderItem : is onderdeel van
  Product "1" --> "0..*" Review : ontvangt
  EmailThread "1" --> "1..*" EmailMessage : bevat
  Promotion "0..*" --> "0..*" Product : geldt voor
  Discount "0..*" --> "0..1" User : is toegewezen aan

• User: Gebruikersprofielen gekoppeld aan NextAuth. Slaat accountinstellingen, adressen en rollen (USER of ADMIN) op.
• Product: Slaat de designcatalogus op. De kolommen variants (kleur, stof, houtsoort), sections (afmetingen, levertijden) en usp maken gebruik van flexibele PostgreSQL JSONB-velden om dynamische productopties zonder schema-migraties te kunnen opslaan.
• Order & OrderItem: Beheert de bestelstroom. Bevat de logistieke gegevens en unieke Sendcloud-integratievelden zoals sendcloudParcelId en trackingUrl.
• EmailThread & EmailMessage: De ruggengraat van de in-house CRM-inbox. Inkomende en uitgaande e-mails worden gegroepeerd per klant-e-mailadres en onderwerp, waardoor beheerders direct vanuit de admin-omgeving kunnen antwoorden via Resend.
• Discount & AutomationSetting: Stuurt de marketing-automations aan. Bevat regels voor verlaten winkelwagens (ABANDONED_CART) of bulk-kortingen (BULK_DISCOUNT) en genereert unieke codes die direct aan gebruikers gekoppeld kunnen worden.
• Promotion: Slaat complexere verkoopcampagnes op (zoals combi-deals of seizoensgebonden kortingen op specifieke producten) via een veel-op-veel relatie met de Product-tabel.

Is het verstandig om zélf een e-commerceplatform te bouwen ter vervanging van een Shopify-abonnement? Voor veruit de meeste startende webshops is een kant-en-klaar platform de beste en meest logische keuze.

Maar voor een premium designmerk als Hana & Nord gaf het ons als agency de ultieme kans om een digitale showroom te ontwikkelen die 100% aansluit op de merkidentiteit van Hana & Nord—gekenmerkt door rust, puur vakmanschap en esthetiek—zonder compromissen te sluiten op het gebied van paginasnelheid, privacy of design.

De synergie of Next.js voor een razendsnelle, serene frontend, Prisma & PostgreSQL voor een robuust relationeel fundament, en directe API-koppelingen met Stripe, Sendcloud en Resend bewijst dat een op maat gemaakt platform de ultieme basis vormt voor een premium e-commerce merk anno 2026.

Samen met Hana & Nord hebben we de serene winkelervaring gecreëerd die hun designmeubelen verdienen.

FOR THE DREAM

Klaar om je e-commerce architectuur te herdefiniëren?

Neem contact met ons op en ontdek hoe we een bliksemsnelle, rustgevende en volledig op maat gemaakte retail-engine bouwen voor jouw merk.

Kennismaken?