Skip to main content
You’re most likely building the frontend for your Sui, and you want to improve efficiency as you do so, so this article is for you. Here, you’ll learn production-centric operations to ship frontends and backends that interact with the Sui blockchain.

Getting Started with Sui & TypeScript

This is not the first or introductory piece I’m working on for Sui and TypeScript. If you need to get some basics to get more comfortable, please check out this introductory article on the Sui TypeScript SDK. Install the Sui TypeScript SDK in your project with this command:
[Terminal]
Now that you’re good to go, let’s start with programmable transactions, one of Sui’s special features.

Programmable Transactions Blocks

Programmable transaction blocks (PTB) allow you to combine multiple transactions into one block and execute them. Add these imports to your projects, let us send a programmable transaction.
[index.ts]
In this programmable transaction, I want to split a coin and send them to multiple recipients all in one transaction. First, I’ll have to create the transaction keypair and define a new transaction instance for the programmable transaction.
[index.ts]
Now, we need to split the gas coin int multiple amounts for transfer with the splitCoins function like this.
[index.ts]
The transfers.forEach makes the transfers to each recipient and then you’ll sign the programmable transaction with the signAndExecuteTransaction function by passing in the keypair and the transaction you’ve built. Programmable Transactions on Explorer

Gas Management on Sui

By default, your transaction uses one of your owned SUI coins as the gas coin. The Sui TypeScript SDK automatically selects a coin not otherwise used in your transaction inputs. However, you can customize gas handling for special cases like sponsored transactions.

Standard Gas Payments

You can explicitly control the gas settings on a transaction: Set a custom gas price:
[index.ts]
Set a custom gas budget:
[index.ts]
Specify exactly which coins to use as gas payment:
[index.ts]
When splitting coins or transferring tokens, you can reuse the gas coin itself as input, because it can be used by reference multiple times safely inside the same transaction block. If you want to transfer your entire gas coin (send your full balance), you can simply:
[index.ts]
This will move your SUI to the recipient and consume the gas object. In a sponsored transaction, another account (the sponsor) pays for the gas fees instead of the original sender. Here’s a typical example of sending a coin to a recipient where the sender pays for gas.
[index.ts]
In this case, the sender is automatically paying, but what if you want another account to pay the gas? Here’s how you’d implement that.
[index.ts]
We build the transaction into kind bytes using tx.build({ onlyTransactionKind: true }) so no gas owner is assigned yet. Next, we reload the transaction using Transaction.fromKind(kindBytes), set the sender again with sponsoredTx.setSender(), and assign the sponsor as the gas payer with sponsoredTx.setGasOwner(). After building the final transaction bytes using sponsoredTx.build({ client }), both the user and the sponsor sign the transaction with signTransaction(), and finally, we submit the transaction along with both signatures using client.executeTransactionBlock(). On the explorer you’d be able to see that it’s a sponsored transaction like this: sponsored Transactions on Explorer

Calling Smart Contracts

You’ll use the moveCall function inside your transaction to call any Move function on-chain. First, make sure you have your imports set:
[index.ts]
Here’s how you can call a Move function:
[index.ts]
After you add your moveCall, you can sign and execute the transaction like before.

Conclusion

You’ve learned more advanced, development-centric functions you’ll probably use if you’re building on Sui. Now, you can go ahead and start building more sophisticated full stack apps on Sui