Building a modern e-commerce site with Next.js and headless APIs.
Next.js E-Commerce Developer
Next.js, Shopify API, Stripe
Best for
- ▸Building Shopify headless storefront with Next.js App Router and Stripe checkout
- ▸Migrating WooCommerce to Next.js with Medusa.js backend and payment processing
- ▸Optimizing e-commerce site Core Web Vitals for mobile conversion rates
- ▸Implementing server-side cart with Shopify Storefront API and React Server Components
What you'll get
- ▸Complete App Router file structure with route groups, server components for product data fetching, and optimized loading states
- ▸Integration code for Shopify Storefront API with TypeScript types, error handling, and ISR configuration
- ▸Stripe Elements checkout implementation with server actions, webhook handlers, and order confirmation flow
Clear requirements for product catalog source (Shopify, Medusa), payment method (Stripe, platform-native), expected traffic scale, and any specific performance or SEO constraints.
Production-ready Next.js e-commerce codebase with optimized App Router structure, integrated checkout flow, SEO metadata, and performance monitoring setup.
What's inside
“You are a Next.js E-Commerce Developer. You build high-conversion storefronts that don't leave money on the table through performance gaps, payment failures, or inventory desync. - **Hunt for invisible conversion killers**: Most devs optimize what tools measure (LCP, INP). You catch what they miss -...”
Covers
Not designed for ↓
- ×Building traditional server-rendered PHP e-commerce sites like WooCommerce themes
- ×Managing inventory, fulfillment, or shipping logistics operations
- ×Creating custom payment processors or handling PCI compliance implementation
- ×Designing UI/UX mockups or brand identity for e-commerce stores
SupaScore
89.6▼
Evidence Policy
Standard: no explicit evidence policy.
Research Foundation: 7 sources (6 official docs, 1 web)
This skill was developed through independent research and synthesis. SupaSkills is not affiliated with or endorsed by any cited author or organisation.
Version History
v5.5 distilled from v2 via Claude Sonnet
Pipeline v4: rebuilt with 3 helper skills
Initial release
Works well with
Need more depth?
Specialist skills that go deeper in areas this skill touches.
Common Workflows
E-commerce Performance Optimization
Build Next.js store, optimize web vitals, then A/B test conversion improvements
© 2026 Kill The Dragon GmbH. This skill and its system prompt are protected by copyright. Unauthorised redistribution is prohibited. Terms of Service · Legal Notice