Effortless Smart Contract Deployment on Rootstock Using ThirdWeb

Pranav KondePranav Konde
10 min read

Deploying smart contracts on Rootstock has never been easier, thanks to Thirdweb's user-friendly tools that allow you to set up scalable dApps in just five minutes. This guide will walk you through the essential steps to quickly and efficiently deploy your smart contracts, whether you're a seasoned developer or just starting out. With Thirdweb's intuitive interface and powerful SDKs, you can streamline your development process and create, manage, and interact with your smart contracts effortlessly. Additionally, you'll discover how to seamlessly connect your smart contracts to the Rootstock network, enhancing your project's capabilities. Join us as we explore this straightforward process, empowering you to take your web3 projects to the next level.


What is Rootstock?

Rootstock (RSK) is a smart contract platform that is built on top of the Bitcoin blockchain. It aims to extend Bitcoin's functionality by enabling the execution of smart contracts, similar to what Ethereum offers. Rootstock achieves this by utilizing a two-way peg mechanism that allows Bitcoin to be converted into RSK tokens (RBTC) and vice versa. This integration allows developers to create decentralized applications (dApps) that benefit from Bitcoin's security while leveraging the flexibility of smart contracts.

Key Features of Rootstock:

  1. EVM Compatibility: Rootstock is compatible with the Ethereum Virtual Machine (EVM), allowing developers to easily port their existing Ethereum dApps to the Rootstock platform without significant modifications. This compatibility fosters a broader ecosystem of decentralized applications and services.

  2. Smart Contracts: Rootstock supports smart contracts, enabling developers to create complex applications that can automate processes and facilitate transactions without intermediaries.

  3. Decentralized Finance (DeFi): Rootstock incorporates DeFi functionalities, making it a versatile platform for developers and users alike.

  4. Scalability: By utilizing sidechains, Rootstock addresses some of the limitations of the Ethereum network, such as high gas fees and slow transaction times, providing a robust environment for building and deploying decentralized applications.


What is ThirdWeb?

ThirdWeb is a comprehensive web3 development platform that offers tools for creators, artists, and entrepreneurs to build, launch, and manage web3 projects. It provides a full stack of resources for developers to connect applications to decentralized networks across various EVM chains.

Key Features of ThirdWeb:

  1. No-Code and Low-Code Solutions: ThirdWeb allows users to create web3 applications without extensive coding knowledge. It offers no-code features like widgets for NFT sales and low-code options for developers.

  2. NFT Management: Users can easily create and manage NFT collections, which can serve various purposes such as membership tokens or access to exclusive content.

  3. Marketplace Creation: ThirdWeb enables the development of marketplaces for trading digital assets, including NFTs and augmented reality items.

  4. Decentralized Autonomous Organizations (DAOs): The platform supports the creation of DAOs, allowing communities to organize and govern themselves through blockchain technology.

  5. Integration with Existing Platforms: ThirdWeb provides tools to integrate web3 features into existing applications, enhancing their functionality with blockchain capabilities.


Prerequisites for Deploying Smart Contracts on Rootstock with ThirdWeb

Before you begin, ensure you meet the following requirements to streamline the deployment process:

  1. Basic Knowledge of Solidity and JavaScript (Including Frameworks of Your Choice)

    • A fundamental understanding of Solidity is essential, as it is the primary language used for writing smart contracts.

    • Familiarity with JavaScript is recommended, especially if you plan to integrate your smart contract with a frontend application.

    • Knowledge of frameworks like React.js, Next.js, or Vue.js can be helpful for building a user-friendly dApp interface.

  2. Fund Your Wallet with RBTC (Rootstock Bitcoin) via Faucet

    • Since Rootstock (RSK) uses RBTC (Rootstock Bitcoin) as its native currency for transaction fees, you will need some RBTC in your wallet.

    • Obtain RBTC from a Rootstock Testnet Faucet to cover gas fees for deploying and interacting with smart contracts.

    • Example faucet: Rootstock Testnet Faucet (Ensure you select the Testnet option).

  3. Ensure Your Wallet is Connected to the Rootstock Testnet

    • Configure your MetaMask or preferred wallet to support the Rootstock Testnet network.

    • Add Rootstock Testnet manually in MetaMask by using the following network details:

      Rootstock Testnet (RSK Testnet) Configuration:

    • After adding the network, switch to Rootstock Testnet and ensure your wallet is funded before proceeding.


Step 1: Sign Up and Log In to ThirdWeb

Visit ThirdWeb’s website: Navigate to ThirdWeb.

Sign Up: ThirdWeb provides multiple sign-up options:

  • Connect using a crypto wallet (e.g., MetaMask, WalletConnect, Coinbase Wallet).

  • Sign up with an email address.

  • Use other Web3 authentication methods.

Log In: After signing up, log in to your account. You will be redirected to your ThirdWeb dashboard.


Step 2: Create a New Project

Go to the ThirdWeb Dashboard.

Click "Add New" to create a new project.

Enter Project Name: Name the project "Rootstock Dapp".

Enable Permissions: Check all the “Allow All” options to ensure that the project has full access.

Click "Create" to finalize the project creation.

After successfully creating the project, you will receive your:

✅ Client ID
✅ Secret Key

Important: Store the Secret Key securely, as it will be required for further development.

Your project dashboard will look similar to this. You can interact with ThirdWeb according to your requirements, as they offer SDKs with support for multiple programming languages and much more.


Step 3: Set Up the Local Development Environment

Create a Project Directory

Open your terminal and create a folder for your project:

mkdir RootstockDapp
cd RootstockDapp

Install ThirdWeb CLI

To interact with ThirdWeb in your local environment, install the ThirdWeb CLI globally:

npm install -g @thirdweb-dev/cli@latest

Initialize a ThirdWeb Project

Run the following command to create a new ThirdWeb smart contract project:

npx thirdweb create

You will be prompted to configure your project. Select the following options:

  • What type of project do you want to create?Contract

  • What is your project named?thirdweb-contracts

  • What framework do you want to use?Hardhat

  • What will be the name of your new smart contract?MyContract

  • What type of contract do you want to start from?ERC20

  • What extensions do you want to add to your contract?None

Once the setup is complete, ThirdWeb will generate a fully functional Hardhat environment where you can develop and deploy smart contracts.


Step 4: Writing the Solidity Smart Contract

Now, let's write a simple Solidity smart contract that allows users to store and retrieve a message.

  • Navigate to your contracts directory in the project folder.

  • Create a new Solidity file named SimpleStorage.sol.

  • Paste the following Solidity code:

// SPDX-License-Identifier: MIT
pragma solidity ^0.8.18;

contract SimpleStorage {
    string private message;

    // Event to notify when the message is updated
    event MessageUpdated(string oldMessage, string newMessage);

    // Function to set a message
    function setMessage(string memory _message) public {
        emit MessageUpdated(message, _message);
        message = _message;
    }

    // Function to get the stored message
    function getMessage() public view returns (string memory) {
        return message;
    }
}

What this contract does:

  • It stores a message on the blockchain.

  • Users can set a new message using setMessage().

  • Anyone can retrieve the stored message using getMessage().

  • An event is emitted whenever the message is updated


Step 5: Deploying the Smart Contract on Rootstock

Using ThirdWeb to Deploy the Contract

After writing the smart contract, ThirdWeb will provide a deployment link.

Click on the deployment link to start the deployment process.

Select the Network: Ensure that Rootstock Testnet is selected.

Click “Deploy Now” to deploy your smart contract on the Rootstock blockchain.

Wow! The contract has been successfully deployed to the Rootstock Testnet.


Step 6: Exploring ThirdWeb’s Features

Once the contract is deployed, ThirdWeb provides a powerful dashboard with several key features that make it easier to interact with and manage smart contracts. These features include Code Snippets, Explorer, Events, Analytics, Settings, and Sources, which streamline the development process and provide deep insights into smart contract performance.

Let’s explore each of these features in detail:

1. Code Snippets

The Code Snippets tab in ThirdWeb allows developers to quickly integrate their deployed smart contracts into various applications. ThirdWeb provides ready-to-use code snippets in multiple programming languages, including:
JavaScript
Python
React
Go

These snippets help developers interact with the contract without manually writing complex blockchain logic.

Key Features of Code Snippets:

  1. Pre-generated contract interaction methods (no need to write ABI decoding manually).

  2. Supports multiple languages for seamless integration.

  3. Secure and optimized SDK usage for blockchain interactions.

2. Explorer

The Explorer tab provides a detailed overview of the deployed contract and its interactions. It is particularly useful for debugging and auditing.

Features of the Explorer Tab:

  1. Smart Contract Details: View the ABI (Application Binary Interface), contract functions, and storage variables.

  2. Transaction History: Track all deployments, function calls, and state changes.

  3. Blockchain Interactions: Get real-time updates on contract executions and user transactions.

  4. User-Friendly UI: Allows easy contract interaction without writing custom scripts.

3. Events

The Events tab helps developers track blockchain events emitted by the smart contract. Events are essential for monitoring on-chain activities and triggering off-chain actions.

Why Are Events Important?

  1. Real-time tracking: Monitor contract updates in real-time.

  2. Efficient off-chain triggers: Automatically update UI components when a contract state changes

  3. Better debugging: Helps developers understand how users interact with the contract.

4. Analytics

The Analytics tab provides insights into how the contract is being used. This is essential for monitoring engagement and optimizing smart contract interactions.

Features of the Analytics Tab:

  1. Transaction Count: Shows the number of transactions executed.

  2. User Interactions: Displays how many unique users interacted with the contract.

  3. Execution Metrics: Tracks gas consumption and contract execution times.

Why is Analytics Useful?

  1. Helps track contract usage trends.

  2. Identifies bottlenecks in contract execution.

  3. Provides data-driven insights for improvements.

5. Settings

The Settings tab allows developers to configure various aspects of their contract.

Available Settings:

  1. Manage Permissions & Access Roles: Assign read/write access to specific wallet addresses.

  2. Configure Contract Visibility: Make the contract public or private as per requirements.

  3. Update Network Settings: Modify chain configurations without redeploying the contract.

Why Are Settings Important?

  1. Enables multi-user collaboration by assigning roles.

  2. Helps protect sensitive contract data from public access.

  3. Allows seamless modifications without complex migrations.

6. Sources

The Sources tab provides:

  1. Solidity Contract Code (view and verify deployed contract code).

  2. ThirdWeb SDK & API Documentation (access to SDK functions and usage examples).

Why is the Sources Tab Important?

  1. Allows developers to verify contract security by checking the deployed code.

  2. Provides API documentation to streamline integration.

  3. Enables code review for better debugging and security auditing.


Step 7: Using the ThirdWeb SDK in a Web App

After deploying the contract, it can be integrated into a React application for a seamless user experience.

Example: Using the ThirdWeb SDK in a React App

import { ThirdwebProvider, useContract, useContractRead } from "@thirdweb-dev/react";

export default function App() {
  const contract = useContract("YOUR_CONTRACT_ADDRESS");
  const { data: message } = useContractRead(contract, "getMessage");

  return (
    <div>
      <h1>Stored Message: {message}</h1>
    </div>
  );
}

Why Use ThirdWeb SDK in a Web App?

  1. Provides easy contract interaction without writing Web3.js/Ethers.js manually.

  2. Supports React hooks for real-time contract state updates.

  3. Secure, optimized, and works across multiple blockchain networks.


Conclusion

Deploying smart contracts on Rootstock using ThirdWeb is a streamlined and efficient process, making it accessible for both seasoned developers and newcomers. With ThirdWeb’s intuitive interface, powerful SDKs, and no-code/low-code solutions, developers can quickly set up and manage decentralized applications with minimal effort.

By leveraging Rootstock’s EVM compatibility, scalability, and DeFi functionalities, projects benefit from a secure and cost-effective blockchain environment. The step-by-step guide covers everything from setting up a ThirdWeb project, writing and deploying smart contracts, and utilizing ThirdWeb’s robust features like code snippets, analytics, and event tracking.

With seamless integration into web applications using the ThirdWeb SDK, developers can enhance user experience and interact with smart contracts effortlessly. Whether you're building an NFT marketplace, a DeFi application, or a DAO, ThirdWeb simplifies the process and accelerates deployment on the Rootstock network. Now, you're fully equipped to take your web3 projects to the next level with ThirdWeb and Rootstock!

If facing any errors, join Rootstock discord and ask under the respective channel.

Until then, dive deeper into Rootstock by exploring its official documentation. Keep experimenting, and happy coding!

2
Subscribe to my newsletter

Read articles from Pranav Konde directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Written by

Pranav Konde
Pranav Konde