Getting Started with Mint.club protocol on Klaytn — An Overview and Walkthrough Tutorial
*Note: The following will remain technically applicable to Kaia Chain after the launch of Kaia Chain.
Introduction
Generally, creating tokens in the crypto ecosystem requires the creator to have technical and basic programming skills. However, in recent times, we have seen advancements in the way tokens are created, thanks to no-code solutions like Mint.club. Mint.club is a no-code solution for creating bonding curve-backed tokens, or NFTs, using any ERC20 token as the base asset in the bonding curve pool. Mint.club employs a unique approach to token creation and liquidity provision, giving token creators the opportunity to create tokens that people can trade at any time.
In this article, we will be delving into Mint.club Protocol, its key features, and how to use the Mint.club v2 SDK to build bonding curve assets on Klaytn.
To get started quickly, you’ll find the entire code for this tutorial on GitHub. This way, you can explore the inner workings of the application as you follow along.
The final output will look like this:
Prerequisite
Before getting started, you need the following prerequisites:
- Node.js and its package manager NPM, version 18. Verify Node.js is installed by running the following terminal command: node -v && npm -v
- A basic understanding of JavaScript,
- A working React project (by executing npx create-react-app project-name)
What Makes Mint Club Unique?
The bonding curve, a mathematical concept that links the price of a token to its current supply through a predefined price-supply relationship, forms the foundation of Mint.club. Typically, Mint.club uses a distinct type of bonding curve system called the Discrete Bonding Curve (DBC), which segments the curve into stepped price intervals. With this, when someone buys or sells bonded curve-backed tokens, the smart contract automatically calculates the corresponding amount of payment tokens (base asset), mints new tokens for buyers by taking payment tokens into the bonding curve pool, or burns sold tokens, returning the base asset from the pool to the seller.
The Mint.club automated bonding curve system allows token creators to design their tokenomics by setting the price-supply curve, allowing for autonomous operation without relying on centralized exchanges, or order books. Other unique benefits of Mint.club include the following:
- Flexibility in Bonding Curve Design and Base Asset Selection on EVM Chains
- Easy Monetization with Creator Royalties
- Automatic Liquidity Pool via Bonding Curve (Instantly Tradable)
- Easy Airdrop and Lockup Tools
Getting Started with Mint.club v2 SDK
In this tutorial, we will be exploring the Mint.club v2 SDK to build bonding curve assets on Klaytn. Developers and token creators can perform a wide range of functionalities with the Mint.club v2 SDK, including connecting wallets, storing data in IPFS, network customization, executing token (ERC20 or ERC1155) functions, and also executing functions related to bonds, airdrop, and lockup.
For the sake of this guide, we will be performing some write functions, such as creating bonding curve tokens, approving tokens and also buying tokens. We will also execute some read functions, such as retrieving the details of a token after its creation.
Setting Up Your Development Environment
To use the Mint.club SDK, we must first set up our development environment and install the Mint.club v2 SDK. To do that, follow these steps:
Step 1: Install Mint Club v2 SDK
Type the following command in your terminal to install Mint.club v2 SDK:
bash
npm i mint.club-v2-sdkStep 2: Initialize SDK and project
Copy and paste the following code into your App.jsx file:
import mintclub from "mint.club-v2-sdk";
import useState from "react";
import curveData from "./data";Next, create a new file called data.js and copy and paste the following code into it:
export const stepData = [
rangeTo: 50, price: 0 , // Since price is 0, the first 50 tokens will be allocated to the creator
rangeTo: 100, price: 0.01 , // 0.01 WKLAY for the next 50 tokens
rangeTo: 1000, price: 0.1 , // 0.1 WKLAY for the next 900 tokens
rangeTo: 10_000, price: 1 , // 1 WKLAY for the next 9000 tokens
]
export const curveData =
curveType: 'LINEAR',
stepCount: 10,
maxSupply: 10_000,
initialMintingPrice: 0.01, // 0.01 WKLAY
finalMintingPrice: 0.1, // 0.1 WKLAY
creatorAllocation: 100,*Note: data.js contains stepData and curveData, an optional parameter for the create function. This tutorial will use this bonding curve data to create the bonding curve asset.
Now that we have the SDK installed and instantiated, lets go over the following functionalities:
- Connecting wallet
- Disconnecting wallet
- Creating tokens
- Buying Tokens
- Approving Tokens
- Getting Tokens Details
Connecting Wallet
To establish a connection to a user’s wallet, call the connect method available in the Mint.club SDK. This requests that the user connect their wallet to the application. To connect the user’s wallet in your application, copy and paste the following code into your App.jsx file.
export default function App()
const [address, setAddress] = useState("");
const handleConnectWallet = async () =>
const address = await mintclub.wallet.connect();
setAddress(address);
;
return (
<>
Connect Wallet
address && (Connected Address is: address)
)
Disconnecting wallet
To disconnect a user’s wallet from the application, call the disconnect method available in the Mint.club SDK. To do that, copy and paste the following code into your App.jsx file.
export default function App()
const handleDisconnectWallet = async () =>
mintclub.wallet.disconnect();
setAddress("");
;
return (
<>
Disconnect Wallet
)Creating tokens
To deploy a bonding-curved ERC-20 contract, call the create function. You can also deploy a bonding-curved ERC-1155 contract. For the sake of this tutorial, we will be focusing on deploying a bonding-curved ERC-20 contract. To do so, copy and paste the following code into your App.jsx file:
export default function App()
const [createTokenTxHash, setCreateTokenTxHash] = useState("");
const handleCreateTokens = async (event) =>
event.preventDefault();
const _symbol = event.target.symbol.value;
const _tname = event.target.tname.value;
console.log(_symbol, _tname);
await mintclub
.network('klaytn')
.token(_symbol)
.create(
name: _tname,
reserveToken:
address: '0x19aac5f612f524b754ca7e7c41cbfa2e981a4432', // mainnet WKLAY token address
decimals: 18,
,
curveData,
onSuccess: (receipt) =>
setCreateTokenTxHash(receipt.transactionHash);
,
onError: (error) => console.log(error);
)
;
return (
<>
onSubmit=handleCreateTokens
className="flex flex-col justify-items-center justify-center w-full m-auto bg-slate-200 shadow-md p-5 rounded-md"
>Create Tokens
type="text"
placeholder="token symbol"
name="symbol"
className="text-2xl font-bold rounded-md border-2 border-black text-black m-3 p-2 w-4/4"
/>
type="text"
placeholder="token name"
name="tname"
className="text-2xl font-bold rounded-md border-2 border-black text-black m-3 p-2 w-4/4"
/>
type="submit"
placeholder="recipient"
value="Create"
className="text-2xl font-bold rounded-md border-2 border-black text-white bg-black m-3 p-2 w-4/4 cursor-pointer"
/>
createTokenTxHash && (Create Tokens Tx Hash:: createTokenTxHash)
)
*Note: To execute this function, you need to have a minimum of 8 KLAY in your connected wallet address.
Buying tokens
To buy tokens from the bonding curve contract, you need to call the buy method available in the Mint.club SDK. To do so, copy and paste the following code into your App.jsx file:
import wei from "mint.club-v2-sdk";
export default function App()
const [buyTokensTxHash, setBuyTokensTxHash] = useState("");
const handleKkakdogBuyTokens = async (event) =>
event.preventDefault();
const _amount = event.target.amount.value;
const _recipient = event.target.recipient.value;
const result = await mintclub.network("klaytn").token("KKAKDOG").buy(
amount: wei(_amount, 18),
slippage: 0,
recipient: _recipient,
);
console.log(result.transactionHash);
setBuyTokensTxHash(result.transactionHash);
;
return (
<>
onSubmit=handleKkakdogBuyTokens
className="flex flex-col justify-items-center justify-center w-full m-auto bg-slate-200 shadow-md p-5 rounded-md"
>Buy Details
type="text"
placeholder="amount"
name="amount"
className="text-2xl font-bold rounded-md border-2 border-black text-black m-3 p-2 w-4/4"
/>
type="text"
placeholder="recipient"
name="recipient"
className="text-2xl font-bold rounded-md border-2 border-black text-black m-3 p-2 w-4/4"
/>
type="submit"
placeholder="recipient"
value="Buy"
className="text-2xl font-bold rounded-md border-2 border-black text-white bg-black m-3 p-2 w-4/4 cursor-pointer"
/>
buyTokensTxHash &&Buy Tx Hash: buyTokensTxHash)
*Note: This function executes an order to buy the KKADOG tokens. To execute this order you need to have WKLAY in your wallet address. Kindly perform a swap from KLAY to WKLAY using DragonSwap before executing this order.
Approving Tokens
To approve token allowance for a spender, call the approve method available in the mint.club SDK. To do so, copy and paste the following code into your App.jsx file:
export default function App()
const [approveTokensTxHash, setApproveTokensTxHash] = useState("");
const handleApproveTokens = async (event) =>
event.preventDefault();
const _symbol = event.target.symbol.value;
const _amount = event.target.amount.value;
const _spender = event.target.spender.value;
console.log(_symbol, _amount, _spender);
try
const result = await mintclub
.network("klaytn")
.token(_symbol)
.approve(
amount: wei(_amount, 18),
spender: _spender,
);
console.log(result.transactionHash);
setApproveTokensTxHash(result.transactionHash);
catch (error)
console.log(error);
;
return (
<>
onSubmit=handleApproveTokens
className="flex flex-col justify-items-center justify-center w-full m-auto bg-slate-200 shadow-md p-5 rounded-md"
>Approve Tokens
type="text"
placeholder="token symbol"
name="symbol"
className="text-2xl font-bold rounded-md border-2 border-black text-black m-3 p-2 w-4/4"
/>
type="text"
placeholder="token amount"
name="amount"
className="text-2xl font-bold rounded-md border-2 border-black text-black m-3 p-2 w-4/4"
/>
type="text"
placeholder="token spender"
name="spender"
className="text-2xl font-bold rounded-md border-2 border-black text-black m-3 p-2 w-4/4"
/>
type="submit"
placeholder="recipient"
value="Approve"
className="text-2xl font-bold rounded-md border-2 border-black text-white bg-black m-3 p-2 w-4/4 cursor-pointer"
/>
approveTokensTxHash &&Approval Tx Hash: approveTokensTxHash)
Getting Tokens Details
To return tokens details after creation, call the getDetail() method available in the Mint.club SDK. To do so, copy and paste the following code into your `App.jsx` file:
export default function App()
const [tokenDetails, setTokenDetails] = useState()
const handleGetTokenDetails = async (event) =>
event.preventDefault();
const _symbol = event.target.symbol.value;
console.log(_symbol);
try
const detail = await mintclub.network('klaytn').token(_symbol).getDetail();
console.log(detail.info);
setTokenDetails(detail.info);
catch (error)
console.log(error);
// console.log(receipt.transactionHash);
// setCreateTxHash(receipt.transactionHash);
;
return (
<>
onSubmit=handleGetTokenDetails
className="flex flex-col justify-items-center justify-center w-full m-auto bg-slate-200 shadow-md p-5 rounded-md"
>Get Tokens Details
type="text"
placeholder="token symbol"
name="symbol"
className="text-2xl font-bold rounded-md border-2 border-black text-black m-3 p-2 w-4/4"
/>
type="submit"
placeholder="recipient"
value="Get Details"
className="text-2xl font-bold rounded-md border-2 border-black text-white bg-black m-3 p-2 w-4/4 cursor-pointer"
/>
tokenDetails &&Token Contract Address: tokenDetails.token)
The getDetail() method returns an object that contains token details such as mintRoyalty, burnRoyalty, creator, decimals, symbol etc. But for the sake of this guide, we only returned the token contract address.
Conclusion
Congratulations on successfully creating a bonding-curved asset on Klaytn. In this guide, we showed how easy it is to create a bonding curve asset using the Mint.club v2 SDK. Additionally, we checked out the other functions available in the SDK.
You may want to check out Mint.club v2 SDK bounty by Klaytn on DoraHacks. To qualify for this bounty, you are expected to contribute a dApp that leverages the Mint.club v2 SDK. For more information on Mint.club SDK and its possibilities, visit Mint Club Documentation. Also, If you want more information about the Klaytn blockchain, visit Klaytn Documentation. If you have any questions, visit Klaytn Forum.
