Payment gateway Add-on

Payment Gateway Integration Setup Guide

The following installation guide provides a general process for setting up payment gateway integrations in SpurtCommerce. These steps are applicable to Razorpay, Stripe and PayPal.

The integration of this Addon will give your eCommerce portal with a payment option for the Customers to check out their shopping cart with Payment Gateway.

Follow these steps to set up the Payment module on the front-end Next.js web store.

Setup Overview:

  • Install the extension

  • Update configuration

  • Integrate the module

  • Run the application

  • Build the application

Step 1: Install the Extension

Locate the Spurtcommerce addon package, typically named addOns.zip.

Extract the zip file and copy the Payment folder into the addOns folder in your project.

projectFolder -> addOns

After this step, the structure should look like:

projectFolder -> addOns -> Payment

Once completed, proceed to update the configuration.

Step 2: Update the Configuration

After installing the extension, update the configuration in Spurtcommerce’s addonsconfig.js as follows:

  1. Import the required line into addonsconfig.js.

import PaymentMethods from './Payment/Payment'
  1. Add the PaymentMethods plugin to the specified object.

        export const AddonsComponent = {                                                                                                                                          PaymentMethods                                                                                                          }  

Step 3: Module Details

The Payment module includes the following components that you can utilize in any page within Spurtcommerce by sending the required product data as props:

  • PaymentMethods Component

{ConnectPlugin.PaymentMethods &&
<ConnectPlugin.PaymentMethods disable={enableRetry} />}

Note: Use the PaymentMethods component by passing the product data as a prop:

        <ConnectPlugin.PaymentMethods disable={enableRetry} />

Step 4: Run the Application

Once you have integrated the Payment module, run the application using:

$ npm run dev

This command will launch Spurtcommerce with the integrated Payment module visible on the specified page.

Step 5: Build the Application

To prepare the application for deployment, execute the following command:

$ npm run build

or

$ yarn run build                                                                                                                             

The latest build files will then be ready for server deployment.

Last updated