More Premium Hugo Themes Premium Nextjs Themes

Commercejs Chopchop Demo

A Commerce.js starter kit for Next.js. A beautifully designed elegantly developed, end to end commerce experience for developers and agencies. Pre-integrated with Stripe. One-click deploy to Vercel.

Commercejs Chopchop Demo

A Commerce.js starter kit for Next.js. A beautifully designed elegantly developed, end to end commerce experience for developers and agencies. Pre-integrated with Stripe. One-click deploy to Vercel.

Author Avatar Theme by chec
Github Stars Github Stars: 154
Last Commit Last Commit: Nov 24, 2021 -
First Commit Created: Apr 22, 2023 -
Commercejs Chopchop Demo screenshot

Overview

ChopChop is a demo store and starter kit that sells fine tools for thoughtful cooks. It is designed with a premium brand and offers a seamless commerce experience. The stack used for ChopChop includes Next.js, Commerce.js, Tailwind CSS, Stripe, and Vercel. There is also a live demo available to see the project in action.

Features

  • Next.js: Utilizes the Next.js framework for efficient and scalable server-side rendering.
  • Commerce.js: Uses Commerce.js for handling the e-commerce functionality of the store.
  • Tailwind CSS: Implements Tailwind CSS for a highly customizable and responsive design.
  • Stripe: Integrates Stripe for secure and seamless payment processing.
  • Vercel: Deploys the project easily and efficiently using Vercel.
  • Sample Data: Comes with sample products and images to quickly set up and start running the store.

Installation

To install ChopChop, follow these steps:

  1. Prerequisites: Make sure you have an IDE or code editor of your choice, Node (v12 or higher), and NPM or Yarn installed.
  2. Optional: Install the Chec CLI by running npm install -g @chec/cli (or yarn global add @chec/cli).
  3. Navigate to your projects folder: cd ~/Projects.
  4. Install the ChopChop demo store: chec demo-store and choose “Chop Chop demo store (Next.js)” from the list.
  5. Stop the server, open .env, and add your NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY for using Stripe.
  6. Re-run npm run dev.
  7. Open http://localhost:3000 and get started!

Alternatively, you can manually install the project by cloning it, installing the dependencies, creating a .env file, and starting the dev server.

To install sample data, follow these additional steps:

  1. Copy .env.example to .env.
  2. Edit .env and fill out the required variables such as NEXT_PUBLIC_CHEC_PUBLIC_API_KEY, NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY, CHEC_SECRET_KEY, and NEXT_PUBLIC_GA_TRACKING_ID.
  3. Save and close the file.
  4. Run the seeder to install the sample data.

Summary

ChopChop is a beautifully designed and elegantly developed demo store and starter kit for selling kitchen tools. It offers a premium brand and a seamless commerce experience. The installation process is straightforward, with options to use the Chec CLI or manually clone the project. Sample data is available to quickly set up the store. With its combination of Next.js, Commerce.js, Tailwind CSS, Stripe, and Vercel, ChopChop provides a comprehensive solution for anyone looking to build an e-commerce store for kitchen tools.