This guide focuses on directly integrating Capsule with Cosmos, providing a comprehensive overview of the setup process, key features, and best practices. While we have a separate guide for CosmJS integration, this document will cover the direct integration approach, offering a more tailored experience for Cosmos developers.

​
Introduction

Capsule’s direct integration with Cosmos offers a secure and user-friendly way to interact with Cosmos-based blockchains. This integration allows developers to leverage Capsule’s features while working within the Cosmos ecosystem.

​
Prerequisites

Before you begin, ensure you have:

  • A Capsule API key. You can get one from the Developer Portal
  • Familiarity with Cosmos Blockchain Concepts

​
Installation

First, install the necessary packages:

npm install @usecapsule/cosmjs-v0-integration @cosmjs/stargate @usecapsule/web-sdk

​
Basic Setup

Here’s how to set up Capsule for direct integration with Cosmos:

import { CapsuleProtoSigner } from '@usecapsule/cosmjs-v0-integration';
import { SigningStargateClient } from '@cosmjs/stargate';
import Capsule, { Environment } from '@usecapsule/web-sdk';

// Initialize Capsule
const capsule = new Capsule(Environment.BETA, 'YOUR_API_KEY');

// Create the Capsule Proto Signer
const protoSigner = new CapsuleProtoSigner(capsule);

// Connect to the Cosmos network
const rpcUrl = 'https://rpc.cosmos.network'; // Replace with your preferred RPC endpoint
const client = await SigningStargateClient.connectWithSigner(rpcUrl, protoSigner);

​
Key Features

​
1. Address Management

Retrieve the signer’s address:

const address = protoSigner.address;
console.log('Signer address:', address);

​
2. Balance Queries

Fetch account balances:

const balance = await client.getAllBalances(address);
console.log('Balance:', balance);

​
3. Transaction Signing and Broadcasting

Sign and send transactions:

const recipient = 'cosmos1...'; // Replace with actual recipient address
const amount = {
  denom: 'uatom',
  amount: '1000000', // 1 ATOM
};

try {
  const result = await client.sendTokens(address, recipient, [amount], {
    amount: [{ denom: 'uatom', amount: '500' }],
    gas: '200000',
  });
  console.log('Transaction sent:', result.transactionHash);
} catch (error) {
  console.error('Error sending transaction:', error);
}

​
Advanced Features

​
Custom Chain Support

Capsule supports various Cosmos-based chains. To use a non-Cosmos chain, specify the address prefix:

const celestiaSigner = new CapsuleProtoSigner(capsule, 'celestia');

​
Offline Signing

For enhanced security, you can perform offline signing:

const signDoc = {
  // ... prepare your sign doc
};

const signature = await protoSigner.signAmino(address, signDoc);

​
Multi-Chain Wallet Management

Capsule allows managing multiple chain wallets:

const cosmosWallet = await capsule.getWallet('cosmos');
const osmosisWallet = await capsule.getWallet('osmosis');

​
Best Practices

  1. Error Handling: Always implement robust error handling to manage potential issues during signing or network interactions.

  2. Session Management: Ensure the user is authenticated with Capsule before attempting to use the signer.

  3. Gas Estimation: Use the simulate method to estimate gas costs before sending transactions.

  4. Security: Never expose your API keys or sensitive user information in client-side code.

  5. Testing: Thoroughly test your integration on testnets before moving to mainnet.

​
Comparison with CosmJS Integration

While our CosmJS integration offers a familiar interface for Cosmos developers, the direct integration provides:

  • Tighter coupling with Capsule’s security features
  • Simplified wallet management across multiple Cosmos chains
  • Direct access to Capsule-specific functionalities

Choose the integration method that best suits your project’s needs and your team’s expertise.

​
Conclusion

Direct integration of Capsule with Cosmos provides a powerful toolkit for building secure and user-friendly blockchain applications. By following this guide, you can leverage Capsule’s features while working seamlessly within the Cosmos ecosystem.

For more detailed information on specific topics, refer to our other guides:

If you have any questions or need further assistance, don’t hesitate to reach out to our support team or join our developer community.

Was this page helpful?

CosmJSLeap Social Login