Last updated: July 20, 2023Next: Testing Guide

Example Applications

Learn by example with our reference implementations and sample applications that demonstrate common ZenPay integrations.

Sample Projects

These complete applications demonstrate best practices for integrating ZenPay into your projects. All examples are available on GitHub with step-by-step setup instructions.

E-commerce Store

React + Node.js implementation

A complete e-commerce store with product listings, shopping cart, and checkout process.

  • Custom checkout flow with ZenPay Elements
  • Webhook integration for order fulfillment
  • Order management dashboard

SaaS Dashboard

Next.js + TypeScript implementation

A SaaS application with user authentication and subscription management.

  • Subscription signup and management
  • Usage-based billing with metering
  • Customer portal integration

Mobile Payments

React Native implementation

A React Native app demonstrating mobile payment processing with ZenPay.

  • In-app payments with React Native
  • Apple Pay and Google Pay integration
  • Card scanning capabilities

Marketplace Platform

Python + Django implementation

A marketplace application with multi-vendor payments and Connect integration.

  • ZenPay Connect onboarding flow
  • Split payments with commissions
  • Vendor payout management

Code Snippets

For targeted implementations, explore these code snippets that showcase specific features of the ZenPay API.

One-time Checkout

Create a basic checkout form for one-time payments

JavaScript
// Create a payment intent on your server
const paymentIntent = await zenpay.paymentIntents.create({
  amount: 1999,
  currency: 'usd',
  payment_method_types: ['card'],
});

// Pass the client secret to your frontend
res.send({ clientSecret: paymentIntent.client_secret });

// Then on your frontend
const {error, paymentIntent} = await zenpay.confirmCardPayment(
  clientSecret,
  {
    payment_method: {
      card: cardElement,
      billing_details: {
        name: 'Jenny Rosen',
      },
    },
  }
);

if (error) {
  // Show error to your customer
} else if (paymentIntent.status === 'succeeded') {
  // Show success message
}

Subscription Setup

Create a subscription with a free trial

JavaScript
// Create a customer
const customer = await zenpay.customers.create({
  email: 'customer@example.com',
  payment_method: 'pm_card_visa',
  invoice_settings: {
    default_payment_method: 'pm_card_visa',
  },
});

// Create a subscription with a 14-day trial
const subscription = await zenpay.subscriptions.create({
  customer: customer.id,
  items: [
    { price: 'price_premium_monthly' },
  ],
  trial_period_days: 14,
});

// Check subscription status
console.log(subscription.status); // 'trialing'

Getting Started with Examples

Follow these steps to run any example application locally:

1

Clone the repository

Bash
git clone https://github.com/zenpay/example-ecommerce.git
cd example-ecommerce
2

Set up environment variables

Create a .env file based on the provided .env.example:

Bash
ZENPAY_PUBLIC_KEY=pk_test_...
ZENPAY_SECRET_KEY=sk_test_...
WEBHOOK_SECRET=whsec_...
3

Install dependencies and run

Bash
npm install
npm run dev

Next Steps

After exploring the example applications, learn how to test your integration:

Testing Guide

Learn how to test your ZenPay integration

API Reference

Explore the complete API documentation