Skip to main content
1

Getting Started

To get started with Chipi Pay in your Next.js application
npx create-next-app@latest my-chipi-app
cd my-chipi-app
If you get ERESOLVE peer dependency errors when installing Clerk, run npm install --legacy-peer-deps. This is a known Clerk + React 19 compatibility issue.
With Clerk, you can follow their Quickstart Guide to get started.
2

Install the Chipi SDK

First, install the required packages:
# Install Chipi Pay SDK
npm install @chipi-stack/nextjs

# Install Clerk
npm install @clerk/nextjs
3

Setup the Chipi SDK Provider

  1. Create a .env file in your project root and add your API keys:
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=your_clerk_publishable_key
CLERK_SECRET_KEY=your_clerk_secret_key
NEXT_PUBLIC_CHIPI_API_KEY=your_chipi_api_public_key
CHIPI_SECRET_KEY=your_chipi_api_secret_key
Get your Chipi API keys from the Chipi Dashboard quickstart. Get your Clerk keys from the Clerk Dashboard.
  1. Set up the Chipi Pay provider in your application:
// app/layout.tsx

import { ClerkProvider } from "@clerk/nextjs";
import { ChipiProvider } from "@chipi-stack/nextjs";

export default function RootLayout({children}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="en">
      <body>
        <ClerkProvider>
          <ChipiProvider>{children}</ChipiProvider>
        </ClerkProvider>
      </body>
    </html>
  );
}
Need help? Check out our Telegram Community for support and to connect with other developers.