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!

nextjs-ecommerce-starter-kit's People

Contributors

kirill-zhirnov avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

nextjs-ecommerce-starter-kit's Issues

Query on State Management

Hi,

I've been reviewing the Next.js E-commerce Starter Kit and appreciate its structure. I noticed Redux isn't used for state management and am curious about this choice.

State Management: Could you briefly describe the state management approach used? Any specific libraries or patterns?

No Redux: What are the key reasons for not choosing Redux? Are there particular advantages with the chosen method?

Your insights would help deepen my understanding of alternative state management in Next.js projects.

Thanks for your contributions to the open-source community.

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.