Git Product home page Git Product logo

nextjs-ecommerce-starter-kit's Introduction

Next.js v14 E-commerce Starter Kit ๐Ÿ’ป

Ready to use Next.js v14 (TypeScript) E-commerce Starter Kit

Free ๐Ÿ‘. Ready to use ๐Ÿ˜Ž. Just clone & deploy! ๐Ÿค˜

Features

  • Next.js v14 - The new App router
  • 3 different checkout flows - it gives you tips about own checkout flow implementation and payment gateway integration.
  • Stripe Checkout
  • Boundless Checkout with PayPal
  • Custom Checkout form
  • Authentication: Sign Up, Sign In, Password Restore, Sign out
  • My orders page
  • Boundless Webhook handler: on Update/Insert/Delete appropriate cache will be invalidated
  • Simple codebase without complex dependencies (no Redux and other code coherence)

Online Demo โšก๏ธ

nextjs-ecommerce-starter-kit.vercel.app

About Boundless Commerce

Boundless-commerce.com

Boundless-commerce.com - APIโ€™s First Headless E-commerce CMS: We Provide An Admin-Side For Store Management, Powerful API, And Ready-To-Use Checkout Area.

Self-Hosted solution

There is an option for Running Boundless-Commerce on your own server. Read more at Open-Source Headless eCommerce Platform

Getting Started

  1. Go to Boundless-commerce.com and create a free account (no credit card required).
  2. Go to "Control panel" -> "Settings" -> "Access tokens" and create a new one:

  1. Copy .env.example to .env.local
  2. Modify .env.local: put values for the NEXT_PUBLIC_BOUNDLESS_API_PERMANENT_TOKEN and NEXT_PUBLIC_BOUNDLESS_INSTANCE_ID, copy values from:

If you want to use Stripe, put values for NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY, STRIPE_SECRET_KEY and BOUNDLESS_MANAGEMENT_TOKEN.

BOUNDLESS_MANAGEMENT_TOKEN it is token like NEXT_PUBLIC_BOUNDLESS_API_PERMANENT_TOKEN, but management rights should be enabled.

  1. Install dependencies: npm install
  2. npm run dev - to start locally, then open http://localhost:3000

Set Up Webhook Handler

  1. Go to "Control panel" -> "Settings" -> "Webhooks" and create a new one:

  1. Create a new webhook:

You need to specify absolute URL to the webhook handler, e.g.: http://localhost:3000/api/on-update-hook. Then specify a secret key and put it as an ENV variable: WEBHOOK_SIGN_KEY.

  1. Save.

NextJS and React eCommerce templates - Free. Ready to use. Just clone & deploy!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.