Overview

Introduction to Apophis + a quickstart guide.

Introduction

Apophis is a Web3 SDK designed for the blockchain omniverse. Originally built for the Cosmos ecosystem, I've refactored it to generalize to more ecosystems - although each ecosystem will have its own specializations.

Apophis is designed to be easy to get into and to accelerate your development process. Its objective is to accomplish much with as little code as possible.

Etymology

Apophis is the God of Destruction in ancient Egyptian mythology. Apophis is also an asteroid. Apophis came out of nowhere and threatened to destroy all that exists. As I originally started building Apophis for the Cosmos ecosystem, and we like to name things after celestial bodies, I've chosen Apophis, the asteroid that showed up out of nowhere.

Quickstart

While the SDK is written to be generalizable to additional ecosystems, currently, it only has Cosmos integration. There are a few components necessary to get to a working CLI app for Cosmos in some lines of code:

import { Bank, Cosmos } from '@apophis-sdk/cosmos';
import { LocalSigner } from '@apophis-sdk/local-signer';

const network = await Cosmos.getNetworkFromRegistry('neutrontestnet');
const signer = LocalSigner.fromMnemonic(process.env.MNEMONIC);

await Cosmos.ws(network).ready();
const { block } = await Cosmos.ws(network).getBlock();
console.log(block.header.height, block.header.timestamp);

const tx = Cosmos.tx([
  new Bank.Send({
    fromAddress: signer.address(network),
    toAddress: signer.address(network),
    amount: [Cosmos.coin(1_000000n, 'untrn')],
  }),
], { encoding: 'protobuf' });
// protobuf is default encoding, amino is the only other

await tx.estimateGas(network, signer, true);
// true stores the gas estimation result within the tx
await signer.sign(network, tx);
// the signature is also stored within the tx
const txhash = await tx.broadcast();
// txhash can also be retrieved/computed with tx.hash

// success only indicates the tx was well-formed & accepted by the chain
// it gives no indication of whether it was successfully processed yet
if (tx.status === 'success') {
  // throws if the tx failed/was rejected/wasn't found in 30s
  const result = await Cosmos.expectTx(tx, 30_000);
  console.log(result);
}

Frontend Integration

Apophis uses Preact Signals to manage active network and signer. Preact Signals are frontend-agnostic and can even be used on backend systems.

Currently, I am in the process of completely rewriting the frontend integrations. Up until now, the plan was to support various frameworks directly, each with its own specialized integration. Now, I've instead settled for a single set of Web Components with framework-specific integrations (primarily just TS type definitions).

The old Preact components still exist. But going forward, I will focus my efforts on the new Cosmos Components. Connecting a wallet in the browser should be as simple as:

import { modals } from '@kiruse/cosmos-components';
modals.showWalletModal(WALLETCONNECT_PROJECT_ID);

Web Components are supported by all major frontend frameworks, although they require some additional type declarations for TypeScript. IMHO, Web Components are mature and adopted enough to be used in production, and are particularly well suited for uniform component libraries like this.