← Back to Projects

Case Study

Awake

Specialty Coffee Brand - Headless E-commerce

Full-stack headless e-commerce platform for a fictional Italian specialty coffee brand. Built to demonstrate a production-grade architecture combining a headless CMS, authentication, e-commerce, and subscription payments.

Live - Release 3Live Demo ↗

Overview

Awake is a portfolio project designed around a fictional specialty coffee brand. The goal is to demonstrate end-to-end ownership of a modern full-stack product: headless CMS integration with Sanity, server-side rendering with Next.js 15 App Router, authenticated private areas, and a complete e-commerce and subscription payment flow via Stripe. The project is structured as a Turborepo monorepo with a clear separation between the web application and the Sanity Studio.

Architecture

Sanity Studio (CMS)
           ↓ GROQ
    Next.js 15 App Router
      ├── Server Components   → fetch from Sanity (blog, products)
      ├── Client Components   → interactions (cart, auth UI)
      ├── Route Handlers      → Stripe webhooks, internal API
      └── Middleware          → private area route protection
           ↓
    PostgreSQL (users, orders, sessions)
    Stripe    (payments, subscriptions)
apps/webNext.js 15 - App Router, Server Components, client interactions
apps/studioSanity Studio v3 - content modelling, editorial interface
packages/sanity-typesShared TypeScript types generated from Sanity schema

Releases

Release 1

Base Headless

Live
  • —Homepage and product pages driven by Sanity CMS
  • —Blog with GROQ queries and server-side rendering
  • —Design system in Tailwind CSS
  • —Monorepo setup with Turborepo
  • —Deploy on Vercel + Cloudflare CDN

Release 2

Private Area

Live
  • —Authentication with NextAuth v5
  • —Registration, login, and user dashboard
  • —Exclusive content for members
  • —Route protection via Middleware

Release 3

E-commerce

Live
  • —Product detail pages
  • —Cart and checkout flow
  • —Order management
  • —PostgreSQL + Prisma for users and orders

Release 4

Transactions

In Progress
  • —One-shot payments via Stripe
  • —Monthly subscription flow
  • —Stripe webhooks and event handling
  • —Order history in user dashboard

Stack

ReactNext.js 15Sanity v3StripeNextAuth v5PostgreSQLPrismaTailwind CSSTurborepoVercelCloudflare