Skip to main content
Gasless transactions are only available in Starknet Mainnet.
1

Configure your Authentication

You’ll need to add the JWKS Endpoint from your auth provider to authenticate gasless transactions.
With this JWKS Endpoint setup, you can now run secure code in your frontend using a rotating JWT token.

​
Getting your JWKS Endpoint

For these common auth providers, you can get your JWKS Endpoint like this:
  1. Go to your API Keys
  2. Copy your JWKS URL and paste it into the JWKS Endpoint field in your Chipi Dashboard.
2

Get your Public Key

Now go to your API Keys and click on your project.Which will give you access to your Public Key (pk_prod_xxxx). Keep this handy as you’ll need it to initialize the SDK.
You won’t need the Secret Key (sk_prod_xxxx) for now.
3

Install the SDK

npm install @chipi-stack/nextjs
4

Initialize the SDK

  1. Add your Public Key to your environment variables.
NEXT_PUBLIC_CHIPI_API_KEY=pk_prod_xxxx
  1. In your layout.tsx, wrap your app with the ChipiProvider component as shown below:
// app/layout.tsx

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

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="en">
      <body>
        <ChipiProvider>{children}</ChipiProvider>
      </body>
    </html>
  );
}
5

Start Using the SDK

You’re ready to use the SDK! We recommend starting with our convenience hooks that simplify common operations:

​
useChipiWallet - Unified Wallet Management

import { useAuth } from "@clerk/nextjs";
import { useChipiWallet } from "@chipi-stack/nextjs";

function WalletComponent() {
  const { userId, getToken } = useAuth();
  
  const {
    wallet,
    hasWallet,
    formattedBalance,
    createWallet,
    isLoadingWallet,
  } = useChipiWallet({
    externalUserId: userId,
    getBearerToken: getToken,
  });

  if (!hasWallet) {
    return (
      <button onClick={() => createWallet({ encryptKey: "1234", chain: "STARKNET" })}>
        Create Wallet
      </button>
    );
  }

  return <p>Balance: ${formattedBalance} USDC</p>;
}

useChipiWallet Documentation

Learn about all the options and return values

​
useChipiSession - Gasless Session Keys (CHIPI wallets only)

import { useChipiWallet, useChipiSession } from "@chipi-stack/nextjs";

function GaslessTransactions() {
  const { wallet } = useChipiWallet({ ... });
  
  const {
    hasActiveSession,
    createSession,
    registerSession,
    executeWithSession,
  } = useChipiSession({
    wallet,
    encryptKey: pin,
    getBearerToken: getToken,
  });

  // Setup session once
  const handleSetup = async () => {
    await createSession();
    await registerSession();
  };

  // Execute transactions without owner signature
  const handleTransfer = async () => {
    await executeWithSession([{
      contractAddress: USDC_CONTRACT,
      entrypoint: "transfer",
      calldata: [recipient, amount, "0x0"],
    }]);
  };
}

useChipiSession Documentation

Learn about session key management
6

Next Steps

That’s it! You should now have an initial working version of Chipi Pay integrated into your application. Explore more features:Need help? Join our Telegram Community to ask us anything on your mind.