Case study
Comforty — Furniture Store
Solo Frontend / CMS Project · Built to master headless CMS architecture with Next.js.
A clean furniture e-commerce experience powered by Sanity CMS and Next.js, featuring persistent multi-page cart state, GROQ data fetching, and fluid responsive design.
Overview
Comforty is a modern furniture storefront designed to demonstrate seamless integration between a headless CMS (Sanity) and a performant Next.js front end with persistent client-side state.
Problems I ran into
…and how I worked through them.
The problem
Complex data schema mapping from Sanity GROQ queries to typed React components.
How I solved it
Defined strict TypeScript interfaces and validated queries in Sanity Vision tool before frontend integration.
The problem
Image optimization errors with external Sanity asset host URLs in Next.js Image component.
How I solved it
Configured remotePatterns in next.config and utilized Sanity URL builder for dynamic resizing and WebP conversion.
The problem
State loss on page refresh across multi-step shopping journeys.
How I solved it
Implemented synchronized React Context cart with localStorage caching and hydration safeguards.
UI / UX decisions
- Modern minimalist aesthetic with ergonomic typography and balanced white space.
- Adaptive product showcase grid optimized across mobile, tablet, and widescreen monitors.
- Interactive micro-interactions for add-to-cart feedback and badge notifications.
What I learned
- Headless CMS integration best practices using GROQ and structured content modeling.
- Scalable client-side state management and hydration resilience in Next.js.
- Core Web Vitals optimization for media-rich e-commerce experiences.