Components
Createcustomtoken

Create Custon Token

The "Create Custom Token" component creates a custom token on Stellar network.

Features

  • Collects Issuer public and secret key, token name, token symbol, and token supply.
  • Provides a straightforward form for users to create custom tokens on Stellar.

Additional Resources

Asset issuance is a fundamental capability of the Stellar network, allowing any entity to tokenize and manage assets efficiently and affordably. These assets can represent various forms of value, including cryptocurrencies, fiat currencies, NFTs, pool shares, bonds, and equity. Any Stellar account holder can issue assets, ranging from banks and businesses to nonprofits and individuals, thanks to the network's accessible and permissionless nature.

Issuing an asset on Stellar is straightforward and involves only a few steps. However, depending on the specific use case, considerations such as asset information publication, compliance with regulations, and managing asset supply may need to be addressed.

C#

Install the Pakana.Stellar.Components NuGet package via the NuGet Package Manager Console.

.Net8.0 or greater is required.

dotnet add package Pakana.Stellar.Components
ℹ️

StellarSDK Dependency will install automatically

NuGet Package Implementation
<pakana.stellar.components.Pages.CreateCustomToken/>
C#
@page "/Customtoken"
@inject IJSRuntime JSRuntime
@rendermode InteractiveAuto
 
<h1>Create Custom Token</h1>
<form id="tokenForm">
    <label for="tokenName">Token Name:</label>
    <input type="text" id="tokenName" required><br><br>
    <label for="tokenSymbol">Token Symbol:</label>
    <input type="text" id="tokenSymbol" required><br><br>
    <label for="tokenAmount">Token Amount:</label>
    <input type="number" id="tokenAmountinsecret" required><br><br>
    <label for="issuingSecretKey">Issuing Account Secret Key:</label>
    <input type="text" id="issuingSecretKey" required><br><br>
    <label for="recipientPublicKey">Issuing Account Public Key:</label>
    <input type="text" id="recipientPublicKey" required><br><br>
    <button type="submit">Create Token</button>
</form>
 
 
<div id="messagethree">@Message</div>
 
@code {
    private TokenFormData FormData = new TokenFormData();
    private string Message;
 
    private async Task HandleValidSubmit()
    {
        try
        {
            var result = await JSRuntime.InvokeAsync<string>("createCustomToken",
                FormData.TokenName, FormData.TokenSymbol, FormData.TokenAmount,
                FormData.IssuingSecretKey, FormData.RecipientPublicKey);
 
            Message = result;
        }
        catch (Exception ex)
        {
            Message = $"Failed to create token. Please try again. Error: {ex.Message}";
        }
    }
 
    public class TokenFormData
    {
        public string TokenName { get; set; }
        public string TokenSymbol { get; set; }
        public decimal TokenAmount { get; set; }
        public string IssuingSecretKey { get; set; }
        public string RecipientPublicKey { get; set; }
    }
}
@{
    <script src="https://cdnjs.cloudflare.com/ajax/libs/stellar-sdk/11.2.2/stellar-sdk.js"></script>
    <script src="your-file-path/js/createCustomToken.js"></script>
 
}

Javascript

We've provided simple HTML and JavaScript that can be used in your project as partial-components or be customized and integrated into your existing codebase.

Stellar CDN
*Current Version as of 2024-24-02*
<script src="https://cdnjs.cloudflare.com/ajax/libs/stellar-sdk/11.2.2/stellar-sdk.js"></script>
JavaScript
 
<script>
    document.getElementById('tokenForm').addEventListener('submit', function (event) {
        event.preventDefault();
 
    const tokenName = document.getElementById('tokenName').value;
    const tokenSymbol = document.getElementById('tokenSymbol').value;
    const tokenAmount = document.getElementById('tokenAmount').value;
    const issuingSecretKey = document.getElementById('issuingSecretKey').value;
    const recipientPublicKey = document.getElementById('recipientPublicKey').value;
 
    const server = new StellarSdk.Horizon.Server('https://horizon-testnet.stellar.org');
 
    const issuingKeys = StellarSdk.Keypair.fromSecret(issuingSecretKey);
 
    server.loadAccount(issuingKeys.publicKey())
                .then(account => {
                    const customAsset = new StellarSdk.Asset(tokenSymbol, issuingKeys.publicKey());
 
    const transaction = new StellarSdk.TransactionBuilder(account, {
        fee: StellarSdk.BASE_FEE,
    networkPassphrase: StellarSdk.Networks.TESTNET
                    })
    .addOperation(StellarSdk.Operation.payment({
        destination: recipientPublicKey,
    asset: customAsset,
    amount: tokenAmount
                        }))
    .setTimeout(30)
    .build();
 
    transaction.sign(issuingKeys);
 
    return server.submitTransaction(transaction);
                })
                .then(result => {
        console.log('Token creation successful:', result);
    document.getElementById('message').textContent = `Token "${tokenName} (${tokenSymbol})" created successfully with amount ${tokenAmount}.`;
                })
                .catch(error => {
        console.error('Error creating token:', error);
    document.getElementById('message').textContent = 'Failed to create token. Please try again.';
                });
        });
</script>
 
HTML
 
<body>
    <h1>Create Custom Token</h1>
 
    <form id="tokenForm">
        <label for="tokenName">Token Name:</label>
        <input type="text" id="tokenName" required><br><br>
 
        <label for="tokenSymbol">Token Symbol:</label>
        <input type="text" id="tokenSymbol" required><br><br>
 
        <label for="tokenAmount">Token Amount:</label>
        <input type="number" id="tokenAmount" required><br><br>
 
        <label for="issuingSecretKey">Issuing Account Secret Key:</label>
        <input type="text" id="issuingSecretKey" required><br><br>
 
        <label for="recipientPublicKey">Issuing Account Public Key:</label>
        <input type="text" id="recipientPublicKey" required><br><br>
 
        <button type="submit">Create Token</button>
    </form>
 
    <div id="message"></div>
</body>