majus:web3

Overview

Basic Web3 API toolkit for Meteor application development.

Configuration

An isomorphic configuration endpoint is exported to allow fine-tuning the package behavior:

1import { Web3Config } from 'meteor/majus:web3';
2
3Web3Config.set({
4  /**
5   * Currently, the following options are available:
6   * ['default', 'bootstrap4']
7   * With the default value being 'default'
8   */
9  template: 'bootstrap4',
10});

Usage (client)

Web3 API wraps Ethers API for convenience:

1import { Web3Factory } from 'meteor/majus:web3';
2
3/**
4 * Get an instance of Web3Provider
5 * @see https://docs.ethers.org/v5/api/providers/other/#Web3Provider
6 */
7const provider = Web3Factory.provider();
8
9/**
10 * Get an instance of Web3Provider signer (essentially JsonRpcSigner)
11 * @see https://docs.ethers.org/v5/api/providers/jsonrpc-provider/#JsonRpcSigner
12 */
13const signer = Web3Factory.signer();
14
15/**
16 * Create smart contract API from ABI representation.
17 * @see https://docs.ethers.org/v5/api/contract/contract/#Contract--creating
18 */
19export const TokenContract = Web3Factory.contract(address, abi);
20const balance = await TokenContract.balanceOf('<account-address>');

The client-size Accounts API works with Web3Provider compatible browser wallets:

1import { Web3Accounts } from 'meteor/majus:web3';
2
3/**
4 * Restores connected accounts if the web3 wallet was already connected before.
5 * Usually called just after the page is loaded or in the router's before/onWait hooks.
6 * @see https://docs.ethers.org/v5/api/providers/jsonrpc-provider/#JsonRpcProvider-listAccounts
7 */
8await Web3Accounts.init();
9
10/**
11 * Causes the web3 wallet to request user to connect one or more accounts with the site.
12 * @see https://eips.ethereum.org/EIPS/eip-1102
13 */
14await Web3Accounts.connect();
15
16/**
17 * Select current account among connected.
18 */
19Web3Accounts.current = '<account-address>';
20
21/**
22 * Various methods to get a state of connection.
23 */
24Web3Accounts.isConnected; // Boolean
25Web3Accounts.connected; // Array of strings
26Web3Accounts.current; // String
27Web3Accounts.network; // Object

Various Web3 UI template widgets & helpers allow for a quicker UI development:

1<!-- Typical "Connect Wallet" flow -->
2{{#if Web3.isConnected}}
3  <div>{{>Web3.UI.accountSelect}}</div>
4{{else}}
5  <div>Current account: {{shortHash Web3.currentAccount}}</div>
6{{/if}}
7<!-- Other API examples -->
8{{#if Web3.isConnected}}
9  <div>
10    All accounts:
11    <ul>
12      {{#each address in Web3.connectedAccounts}}
13        <li>{{shortHash address size=6}}</li>
14      {{/each}}
15    </ul>
16  </div>
17  <div>Current network: {{Web3.network}}</div>
18{{/if}}

Usage (server)

Firstly, you need to provide required settings:

1{
2  "pacakges": {
3    "majus:web3": {
4      "ethers": {
5        "rpcUrl": "http://chain-rpc-server",
6        "key": "your-eoa-private-key"
7      }
8    }
9  }
10}

Then, you may use the API as follows:

1import { Web3Factory } from 'meteor/majus:web3';
2
3/**
4 * Get an instance of JsonRpcProvider
5 * @see https://docs.ethers.org/v5/api/providers/jsonrpc-provider/
6 */
7const provider = Web3Factory.provider();
8
9/**
10 * Get an instance of Wallet signer
11 * @see https://docs.ethers.org/v5/api/signer/#Wallet
12 */
13const signer = Web3Factory.signer();