E-Shop of the Future

Foundation e-commerce storefront for Crystallize Flare — a codegen tool that generates customized storefronts inside a sandboxed container. This repo serves as the base template that an LLM builds upon to create tenant-specific e-commerce experiences.

Stack

• Next.js 16 (App Router) with React 19
• TypeScript 5
• Tailwind CSS v4 with OKLCH color system and dark mode
• shadcn/ui (Radix UI primitives)
• Crystallize for product catalog, cart, and checkout
• Bun as package manager and runtime

Getting Started

# Install dependencies
bun install

# Copy environment variables
cp .env.example .env

# Start development server
bun dev

Environment Variables

See .env.example for the full list. At minimum you need:

Variable	Description
CRYSTALLIZE_TENANT_IDENTIFIER	Your Crystallize tenant identifier
CRYSTALLIZE_TENANT_ID	Your Crystallize tenant ID
CRYSTALLIZE_ACCESS_TOKEN_ID	Access token ID
CRYSTALLIZE_ACCESS_TOKEN_SECRET	Access token secret

Project Structure

app/                  # Next.js App Router pages and layouts
components/           # React components
  ui/                 # shadcn/ui base components
  cart/               # Cart UI and provider
  category-page/      # Category listing components
  checkout/           # Checkout flow components
core/                 # Core business logic
  services/           # Service layer (cart, catalog, checkout)
hooks/                # Custom React hooks
lib/                  # Utilities
public/               # Static assets

Scripts

bun dev            # Start development server
bun run build      # Production build
bun run start      # Start production server
bun run lint       # Run ESLint
bun run codeclean  # Format with Prettier and fix lint issues

Flare Integration

This repository is the foundation template used by Crystallize Flare. When Flare generates a storefront:

1. This repo is cloned into a sandboxed container
2. An LLM analyzes the tenant's Crystallize catalog and configuration
3. The LLM generates and modifies code on top of this foundation
4. The result is a fully customized, production-ready storefront

The architecture, patterns, and conventions in this repo directly shape what Flare produces — keep them clean and consistent.