Azon Shop is an open-source e-commerce storefront template built on the T3 stack — Next.js app router, tRPC, Drizzle ORM, and PostgreSQL — that handles the full storefront loop from product search to Stripe checkout. The repository is maintained by Andrew Solonets and includes a complete customer-facing store with persistent cart, ratings, discounts, and order history.
What is Azon Shop?
Azon Shop is a full-stack e-commerce starter that demonstrates a modern TypeScript architecture: a Next.js frontend with the app router, tRPC for type-safe API procedures, Drizzle ORM for database access, and PostgreSQL deployed via Vercel DB. It ships with seed scripts for products, pricing, ratings, and Algolia search data, so you can populate a working store in a few commands. The project has two branches: the main branch uses Clerk for authentication, Drizzle ORM, and the app router; the v1 branch uses NextAuth, Prisma, and the pages router as a reference for the older T3 stack. It includes product listing, single product page, cart, checkout, and user profile with order history.
Key Features
- Persistent cart — A fully functional cart that keeps its contents across page loads and user sessions, integrated with the checkout flow.
- Stripe checkout — Orders are processed through Stripe, and a custom database table links orders to their Stripe payment records.
- Algolia Autocomplete search — Instant product search with autocomplete; you configure it by editing the index name in
algoliaSeed.tsand thesourceId/indexNameinSearch.tsx. - Rating system — Customers can view product ratings, with sample ratings loaded by the
db:ratingsSeedscript. - Product discounts and price history — Discount components apply sale prices in the cart and at checkout, and pricing data is seeded for historical tracking.
- Clerk authentication — User profiles and order history are tied to Clerk-managed accounts, with a custom database for orders.
- Infinite scroll and optimistic updates — Product listing pages load more items on scroll and use React Query for optimistic UI updates.
- Cypress E2E tests — The repository includes Cypress tests for navigation, adding products to the cart, the mobile menu, and product page quantity buttons.
- Shadcn UI and TailwindCSS — The interface is built with Shadcn components and TailwindCSS, giving you a modern, customizable styling system.
Who is it for?
Azon Shop is aimed at developers who want a production-style e-commerce reference built with the modern T3 stack. It is also useful for indie hackers launching a small store who need search, payments, and auth already wired up, and for teams evaluating Next.js app router patterns for a storefront.
What can you do with Azon Shop?
- Build a storefront quickly: Seed the PostgreSQL database with products, prices, and ratings, then serve them through the Next.js frontend with no API code to write.
- Integrate Algolia search: Rename the placeholder index "azon1" and update two fields in
Search.tsxto point at your own Algolia application and index. - Accept Stripe payments: Use the prebuilt checkout and orders table to take payments end-to-end, with order data saved in your database.
- Customize the design: Change the storefront's look using TailwindCSS utility classes and the included Shadcn components.
How does Azon Shop work?
Clone the repository, install dependencies with npm, and add the environment variables from .env.example. Configure your PostgreSQL connection string (the README notes you can update the Drizzle integration if you are not using PostgreSQL). Set up Algolia by changing the index name to your own, then run the four seed scripts — db:productSeed, db:pricingSeed, db:ratingsSeed, and db:algoliaSeed. Start the dev server with npm run dev.
Pros and cons
- Pros: Modern T3 stack with type safety across the stack; includes E2E tests; has real Stripe, Clerk, and Algolia integrations; two branch versions show architectural evolution.
- Cons: Requires setting up external services (PostgreSQL, Stripe, Clerk, Algolia) before the store works; there is no built-in admin panel, so product updates are done by editing and re-running seed scripts.
Pricing
Azon Shop is free and open source. The full source code is public on GitHub.
Alternatives
- Next.js Commerce
- Medusa
FAQ
Is Azon Shop free?
Yes, Azon Shop is an open-source project. The full source code is available on GitHub, and you can use it as a starting point for your own e-commerce project.
What tech stack does Azon Shop use?
The main branch uses Next.js with the app router, TypeScript, tRPC, Drizzle ORM, PostgreSQL, TailwindCSS, and Shadcn UI. Authentication is handled by Clerk, payments by Stripe, and search by Algolia. React Query powers data fetching with optimistic updates.
How do I set up Algolia search?
You need to replace the placeholder index name "azon1" in algoliaSeed.ts with your own index, and update the sourceId and indexName fields in Search.tsx to match your Algolia application. Then run the db:algoliaSeed script to index your seed data.
Does Azon Shop support Stripe checkout?
Yes, Azon Shop includes a complete Stripe checkout flow. Orders created through Stripe are stored in a custom database table, so you can track order history and link it to user profiles.
Can I use a different database?
The README states that you need to connect to your own database and update the Drizzle integration if you are not using PostgreSQL. The code targets PostgreSQL, so MySQL or other databases require additional configuration.
