Overview

Bubble plugin: Web3 & MetaMask documentation

FYI We are still working on completing this documentation.

This is a plugin for bubble.io platform made by NovaBloq It allows to use web3.js and MetaMask SDK without code to build a modern web3 app. Despite the name, it also can connect to other Web3 wallets besides the MetaMask. See details about it here

In case you are new to Bubble, see the video tutorial below before continuing.

Join the Web3 NoCode Discord Server!Discord

Our team is active on Discord. Join for discussions and support

Here you will find all demo pages for this plugin:

https://web3-demo.bubbleapps.io/version-test/

This page contains a list of all available demo pages for this plugin. We did a separate page for each mostly requested feature. Take a look on how it works, also open it in the app editor to see the workflow.

Plugin Features

The plugin has 2 elements to separate the main features from the optional additional features.

Web3 & MetaMask - main element

All Features in this element:

• Connect to MetaMask wallet
• Disconnect MetaMask
• Send any token to an address
• Get Balance of any token
• Get Balance of a list of tokens
• Check NFT Balance
• Check multiple NFTs Balance at once

• Get Token Symbol
• Check Allowance

• Approve (Set Allowance)

• Revoke Allowance
• Transfer From

• Smart Contract Interaction - Read
• Smart Contract Interaction - Write
• Deploy a Smart Contract

• Detect connected chain and on chain changed

• Sign
• Sign Typed Data (EIP-712) (v.4)
• Check signature
• Send Transaction

• Get NFT Metadata
• Transfer NFT to another wallet

• Trigger change network popup in MetaMask
• Import a custom token

• Wrap/Unwrap ETH to WETH

• Trigger Switch Chain
• Request to add a Chain to MetaMask

See details for each feature in the Elements section

Web3 Utils - optional element

Optional element, it will add additional useful features to your app All Features in this element:

• Convert To Wei
• Convert From Wei
• Check Is Address

• Get Gas Price

• Get Latest Block Number

• Extract contract ABI

• Get Transaction confirmations
• Get Transaction Details
• Get Unix Timestamp

• Open MetaMask App (Deep link for mobile)

• Convert Hex to Number and vice versa.

• Convert List of Numbers to Hex

• Convert Ascii to Hex

• Subscribe to Smart Contract Events

• Subscribe to New Block mined event (Can be used as a timer to check for changes on the blockchain)

• Request to add custom token to MetaMask
• Get Transaction Details (Amount sent, Receiver, Contract used, Timestamp, Full JSON data)
• Get Avatar from MetaMask Wallet

• Get ENS Domain from Address
• Get All text records from an ENS name (Email, Avatar, Url, Twitter, etc.)

See details for each feature in the Elements section

Make sure to add the element on the page not inside a group or popup!

Adding more than 1 of each element on the page may result in errors.