Next.jsReactE-commerce

NextJS-Ecom — Next.js Ecommerce Template

By miguel876

Migstore is an ecommerce website template based on NextJS and ShadCN, including a product list, Stripe payments, Google login, a contact form, and theme switching; the README provides local installation and deployment instructions.

Open Source SiteDownload Source ZIP

Explore the design

Compare the page layouts and mobile experience. Open any screenshot for a closer look.

3 previews
Desktop homepage1 / 3
Desktop captureTop of page

Actual screenshot captured by the server browser.

All pages & views 3

Screenshots show visual appearance; interactive behavior may differ.

Recorded 2026-10-14View source

What stands out

A quick read of the recorded project description.

01

The product list supports pagination and can be filtered via URL, making it easy to share filtered pages

02

The interface is built with ShadCN components and provides theme switching

03

Integrates Stripe for payment processing and checkout, and the README includes test card numbers

04

Implements a contact form through the React Resend library

05

Supports basic user login with Google

06

States a responsive design and provides desktop and mobile preview screenshots

Template Details

Migstore is an ecommerce website template built with NextJS, Tailwind, ShadCN, Zustand, Neon DB, and Resend. The features listed in the README include: a product list with pagination and URL-based filtering (filter conditions can be shared via URL), a modern design using ShadCN components, a contact form implemented through the React Resend library, Stripe integration for payment processing and checkout, basic user login with Google, and theme switching, and it states a responsive design.

For deployment, the project is deployed on Vercel and uses GitHub Actions for CI/CD, and the README provides an online demo address. Running locally requires Node.js 14 or higher, as well as npm or yarn; the installation steps include cloning the repository, installing dependencies, and configuring environment variables, which involve the Stripe public key, Stripe secret key, Resend key, and Stripe Webhook secret. The README also provides test card numbers for Stripe test mode.

The README does not explain the specific source of product data or the database structure, does not explain the permissions or account management details after user login, and does not explain the complete configuration requirements for production deployment.

Next.jsEcommerce

Is it right for your project?

Use Cases

  • As an ecommerce website frontend template, used to build product display and checkout flows
  • Used to learn how NextJS and ShadCN components are combined in ecommerce scenarios
  • Used as a reference for implementing Stripe payment integration and a Resend contact form
  • Used as an example project for deploying on Vercel with GitHub Actions for CI/CD

Suitable For

  • Developers who need an ecommerce website template
  • Learners who want to understand the combined use of NextJS, ShadCN, Stripe, and Resend
  • Project referencers who need a product list feature with shareable URL filtering

Getting started & customization

Use these recorded setup notes alongside the repository instructions for your chosen version.

  1. 1

    Requires Node.js 14 or higher, as well as npm or yarn

  2. 2

    After cloning the repository, run npm install or yarn install to install dependencies

  3. 3

    Create a .env.local file in the project root and set NEXT_PUBLIC_STRIPE_PUBLIC_KEY, STRIPE_SECRET_KEY, RESEND_KEY, and STRIPE_WEBHOOK_SECRET

  4. 4

    Use npm run dev or yarn start to start the development server

  5. 5

    In Stripe test mode, you can use card number 4242 4242 4242 4242, date 12/34, CCV 123

Read repository instructions

License & source material

Usage conditions & limitations

Free to use · keep license notice

This entry covers the free version under the MIT license in the public repository; the free scope is the code of this version and does not mean that external services or third-party assets are free.

Must comply with when using

  • Allows free use, modification, commercial use, and distribution of this version's code.
  • When distributing copies or substantial portions of the code, retain the original author's copyright notice and the complete MIT license notice.
  • The code is provided as is; warranties and limitations of liability are governed by the original license and applicable law.

Additional costs & items to verify

  • Demo images, fonts, icons, and other third-party assets must be checked against their respective licenses and cannot be judged solely by the code's MIT license.
  • External services such as domains, hosting, databases, payments, or AI may incur separate charges.
  • The contact form relies on the React Resend library, and using this feature requires configuring the Resend service and the corresponding key.
  • Payment and checkout features rely on Stripe integration, and using this feature requires a Stripe account and the corresponding keys.
  • The user login feature relies on Google login, and using this feature requires configuring Google login credentials.
  • The project uses Neon DB as the database, and running related features requires configuring the Neon database service.
  • The project is deployed on Vercel and uses GitHub Actions for CI/CD, and deployment depends on these external services.
  • Running the project requires configuring the Stripe public key environment variable.
  • Running the project requires configuring the Stripe secret key environment variable.
  • Running the project requires configuring the Resend key environment variable.
  • Running the project requires configuring the Stripe Webhook secret environment variable.
View Original Text Basis

Permission is hereby granted, free of charge

Original License Text

- Contact form using the React Resend library.

Original README

- Stripe integration for payment processing and checkout.

Original README

- Basic user sign in with Google and theme switch.

Original README

- [Neon DB](https://neon.tech/)

Original README

This project is deployed on [Vercel](https://vercel.com/). It also uses Github actions for CI/CD. You can view the live application at [https://next-js-ecom-neon.vercel.app/](https://next-js-ecom-neon.vercel.app/).

Original README

NEXT_PUBLIC_STRIPE_PUBLIC_KEY=your_public_key

Original README

STRIPE_SECRET_KEY=your_secret_key

Original README

RESEND_KEY=your_resend_key

Original README

STRIPE_WEBHOOK_SECRET=your_webhook_secret

Original README
https://github.com/miguel876/NextJS-Ecom/blob/master/LICENSEhttps://github.com/miguel876/NextJS-Ecom/blob/master/README.md

Compiled by DeepSeek based on repository license and README ·2026-10-14. Results only cover the materials read; dependencies, images, fonts, and subsequent term changes are subject to their respective original texts.

Project checks & description sources

Template Information

Source platforms
GitHub
Documentation and maintenance reference score
More documented · 77 / 100
Technologies
Next.js · React
Website type
E-commerce
How this score is calculated

Our heuristic uses license records (up to 30), a demo link (12), a preview (10), stars (15), recorded maintenance (15), description completeness (8), feature records (5) and classification data (5). It is not a code, security or performance test, or a Google score. A link does not establish tested functionality.

What to verify for this project

Repository update recorded
2025-01-04
Screenshot last checked
2026-10-14

A demo link is listed. Check it with your own content and viewport sizes; its presence does not confirm that forms, authentication or payments work.

The catalog identifies Next.js as the primary stack. Check the actual dependency manifest and lockfile for versions and hosting requirements. These notes use recorded metadata, not a code audit or a deployment test.

Use a selection guide →

How this description was prepared

AI-assisted description based on catalog records and repository material. Repository authors are not automatically the reviewers of this description.

Review declaration: codex-user-requested-batch-review-20261015 · 2026-10-15

Inspect the recorded source material

SHA-256: a23d99ae6f19d99904bc73bccea5057d36e49dac271de975b8270c429144e0fe

2026-10-14T02:23:53.385Z

Source file / repository
# Migstore

Migstore is an ecommerce website template created with NextJS and ShadCN.

## Table of Contents

- [Features](#features)
- [Technologies](#technologies)
- [Deployment](#deployment)
- [Getting Started](#getting-started)
- [Prerequisites](#prerequisites)
- [Installation](#installation)
- [Usage](#usage)
- [Stripe](#stripe)
- [License](#license)

## Features

- Product listing with pagination and filters by URL so it can be easily shared.
- Modern design using ShadCN components.
- Contact form using the React Resend library.
- Stripe integration for payment processing and checkout.
- Basic user sign in with Google and theme switch.
- Responsive design.

## Technologies

- [NextJS](https://nextjs.org/)
- [Tailwind](https://tailwindcss.com/)
- [ShadCN](https://ui.shadcn.com/)
- [Zustand](https://zustand-demo.pmnd.rs/)
- [Neon DB](https://neon.tech/)
- [Resend](https://react.email/docs/introduction)

## Deployment

This project is deployed on [Vercel](https://vercel.com/). It also uses Github actions for CI/CD. You can view the live application at [https://next-js-ecom-neon.vercel.app/](https://next-js-ecom-neon.vercel.app/).

## Getting Started

Follow these instructions to set up the project locally.

### Prerequisites

- Node.js (version 14 or later)
- npm or yarn

### Installation

1. Clone the repository:

   ```bash
   git clone https://github.com/yourusername/your-repo-name.git
   ```

2. Navigate to the project directory:

   ```bash
   cd your-repo-name
   ```

3. Install the dependencies:

   ```bash
   npm install
   # or
   yarn install
   ```

4. Set up environment variables:

   Create a `.env.local` file in the root of your project and add the following variables:

   ```plaintext
   NEXT_PUBLIC_STRIPE_PUBLIC_KEY=your_public_key
   STRIPE_SECRET_KEY=your_secret_key
   RESEND_KEY=your_resend_key
   STRIPE_WEBHOOK_SECRET=your_webhook_secret
   ```

## Usage

To start the development server, run:

```bash
npm run dev
# or
yarn start
```

## Stripe

In order to conclude a purchase using stripe, please use the following card data for test mode:

- Card Number: 4242 4242 4242 4242
- Date: 12/34
- CCV 123

## License

[MIT](https://choosealicense.com/licenses/mit/)
Report a correction

Explore similar templates

Compare previews and descriptions within the same stack and category.

Next.js Commerce

Next.js Commerce

Vercel's officially maintained Next.js App Router ecommerce starter with deep Shopify integration, offering a complete product catalog, cart, and checkout flow. Core logic is modular for swapping backends, and community provider versions exist for BigCommerce, Medusa, and Saleor.

Next.js · E-commerce

commerceplate

commerceplate

A free Shopify e-commerce starter template built with Next.js 16, Tailwind CSS 4, and TypeScript, using the Shopify Storefront API (GraphQL).

Next.js · E-commerce

ecommerce-template

ecommerce-template

A Next.js App Router ecommerce template built with TypeScript, Tailwind CSS, Radix UI, and TanStack Query.

Next.js · E-commerce

boundless-nextjs-ecommerce-template

boundless-nextjs-ecommerce-template

A free Next.js and TypeScript e-commerce frontend starter kit from Boundless Commerce.

Next.js · E-commerce

mobile-medusa

mobile-medusa

Mobile Medusa is an Expo-based React Native mobile e-commerce starter template that connects to a Medusa backend and aligns its pages and user flows with the Medusa Next.js Starter.

Next.js · E-commerce

template-ecommerce-webapp-nextjs

template-ecommerce-webapp-nextjs

An official Contentful-maintained Next.js ecommerce starter template that fetches content via the Contentful GraphQL API and uses graphql-codegen to generate a type-safe SDK.

Next.js · E-commerce