3️Integrate Frontend SDK

We support JavaScript, React, React Native and Unity Bridge

The JavaScript SDK is the core Tweed SDK - all of the logic lives here. You can integrate the Frontend SDK in JavaScript, or in React or React native, using a provider.

The React SDK is the Core Javascript SDK wrapped with React. We built custom functions for React so the Tweed SDK will fit with React syntax. For each JavaScript SDK function, we created a React hook.

Frontend SDK Installation and Setup

Step 1: Installation


The SDK can be installed using either npm or yarn.


npm install --save @paytweed/frontend-sdk


yarn add @paytweed/frontend-sdk

Step 2: Setup


The only thing required to set up the frontend SDK is implementing the function sendMessageToBackend, which will pass a message from the frontend SDK to the backend SDK.

This example uses HTTP endpoint /message to pass the message:

import { TweedFrontendSDK } from '@paytweed/frontend-sdk'

const frontendSDK = TweedFrontendSDK.setup({
  defaultBlockchainIds: ['ethereumSepolia', 'polygonMumbai'],
  sendMessageToBackend: async (message) => {
    const response = await fetch('http://your-server.com/message', {
      body: JSON.stringify({ message }),
      headers: { 'Content-Type': 'application/json' },
      method: 'POST',
    const { answer } = await response.json()
    return answer

Usage Examples


import { TweedFrontendSDK } from '@paytweed/frontend-sdk'

// Check if wallet exists
const walletExists = await frontendSDK.wallet.exists()
if (walletExists) {
  // Get the balance of the wallet
  const balance = await frontendSDK.crypto.getBalance()

  // Show the wallet address embed in a QR code
  await frontendSDK.wallet.showAddress({ blockchainId: 'ethereum' })
} else {
  // Show the wallet creation modal if the wallet doesn't exist
  await frontendSDK.wallet.create()

Last updated