Was this helpful?
Build on Tempo
Create your own stablecoin on Tempo using TIP-20 Tokens. TIP-20 tokens are designed specifically for payments with built-in compliance features, role-based permissions, and integration with Tempo's payment infrastructure.
By the end of this guide, you will be able to create a stablecoin on Tempo.
When the user is creating a stablecoin, we should show loading state to indicate that the process is happening.
We can use the isPending property from the useCreateSync hook to show pending state to the user on our "Create" button.
<button
disabled={create.isPending}
type="submit"
>
{create.isPending ? 'Creating...' : 'Create'}
</button>If an error unexpectedly occurs, we should display an error message to the user.
We can use the error property from the useCreateSync hook to show error state to the user.
export function () {
// ...
if (create.error)
return <div>Error: {create.error.message}</div> {}
Ensure that you have set up your project with Wagmi, a Tempo chain config, and a wallet connector:
Before we send off a transaction to deploy our stablecoin to the Tempo testnet, we need to make sure our account is funded with a stablecoin to cover the transaction fee.
As we have configured our project to use AlphaUSD (0x20c000…0001)
as the default fee token, we will need to add some AlphaUSD to our account.
Luckily, the built-in Tempo testnet faucet supports funding accounts with AlphaUSD.
import { } from 'wagmi/tempo'
import { } from 'wagmi'
export function () {
const { } =
import { , } from 'wagmi'
import {
Now that we have some funds to cover the transaction fee in our account, we can create a stablecoin.
Let's create a new component and add some input fields for the name and symbol of our stablecoin, as shown in the demo.
Now that we have some input fields, we need to add some logic to handle the submission of the form to create the stablecoin.
After this step, your users will be able to create a stablecoin by clicking the "Create" button!
Tokens can also carry an optional on-chain logoURI that wallets and explorers read directly from the token contract. It's set on the token contract and is independent of this creation flow; for the recommended format, use a square, rasterized PNG or WebP (max 256 bytes; https, http, ipfs, or data scheme).
Now that users can submit the form and create a stablecoin, let's add a basic success state to display the name of the stablecoin and a link to the transaction receipt.
Now that you have created your first stablecoin, you can now:
export function () {
return (
<div>
<form
={() => {
.preventDefault()
const = new (.target as HTMLFormElement)
const = .('name') as string
const = .('symbol') as string
}}
>
<input ="text" ="name" ="demoUSD" />
<input ="text" ="symbol" ="DEMO" />
<button ="submit">
Create
</button>
</form>
</div>
)
}import { , } from 'wagmi'
import {
import { } from 'wagmi/tempo'
export function () {
const = ..()
return (
<>
<
={() => {
.()
const = new (. as HTMLFormElement)
const = .('name') as string
const = .('symbol') as string
.({
,
,
: 'USD',
})
}}
>
< ="text" ="name" ="demoUSD" />
< ="text" ="symbol" ="DEMO" />
< ="submit">
Create
</>
</>
</>
)
}import { , } from 'wagmi'
import {
import { } from 'wagmi/tempo'
export function () {
const = ..()
return (
<>
<
={() => {
.()
const = new (. as HTMLFormElement)
const = .('name') as string
const = .('symbol') as string
.({
,
,
: 'USD',
})
}}
>
< ="text" ="name" ="demoUSD" />
< ="text" ="symbol" ="DEMO" />
< ="submit">
Create
</>
</>
{. && (
<>
{..} created successfully!
< ={`https://explore.tempo.xyz/tx/${...
View receipt
</>
</> {}
)}
</>
)
}import { , } from 'wagmi'
import {