Frontend Next Stack

Next.js E-Commerce Stack

Stack

Next.js 15+ · React 19 · next-intl v4 · TanStack Query v5 · Zustand v5 · RHF + Zod 4 · shadcn/ui · Tailwind v4 · motion

Layout (new apps — use src/)

src/
├── app/[locale]/          # All user routes
├── components/ui/         # shadcn
├── components/{domain}/   # product, cart, layout
├── features/{domain}/     # cart, checkout, auth logic
├── lib/api/               # Server fetch (RSC)
├── lib/api-client.ts      # Client fetch
├── i18n/
├── messages/
├── providers/
├── hooks/
└── middleware.ts

Providers

QueryProvider → NextIntlClientProvider → AuthProvider → NotificationProvider

Key Conventions

• Regional locales: en-ae, ar-ae, en-gl, ar-gl
• Always @/i18n/navigation for Link/router — never raw next/link
• Server page + *Client.tsx wrapper
• Bilingual data: pick name_en/name_ar at render
• getMediaUrl() for all API images

Related Skills