Hello World

Hello World Quickstart Guide

For this "hello world" quickstart guide, we will use Huione Playground, a browser the based IDE, to develop and deploy our Huione program.

To use it, you do NOT have to install any software on your computer.

Simply open Huione Playground in your browser of choice, and you are ready to write and deploy Huione programs.

What you will learn

How to get started with Huione Playground
How to create a Huione wallet on Playground
How to program a basic Huione program in Rust
How to build and deploy a Huione Rust program
How to interact with your on chain program using JavaScript

Using Huione Playground

Huione Playground is browser based application that will let you write, build, and deploy on chain Huione programs.

All from your browser. No installation needed.

It is a great developer resource for getting started with Huione development, especially on Windows.

Import our example project

In a new tab in your browser, open our example "Hello World" project on Huione Playground:

Next, import the project into your local workspace by clicking the "Import" icon and naming your project hello_world.

lib.rs

use huione_program::{
    account_info::AccountInfo,
    entrypoint,
    entrypoint::ProgramResult,
    pubkey::Pubkey
    msg,
};

// declare and export the program's entrypoint
entrypoing!(process_instruction);

If you do not import the program into your Huione Playground, then you will not be able to make changes to the code. But you will still be able to build and deploy the code to a Huione cluster.

Create a Playground wallet

Normally with local development, you will need to create a file system wallet for use with the Huione CLI. But with the Huione Playground, you only need to click a few buttons to create a browser based wallet.

Note:Your Playground Wallet will be saved in your browser's local storage. Clearing your browser cache will remove your saved wallet. When creating a new wallet, you will have the option to save a local copy of your wallet's keypair file.

Click on the red status indicator button at the bottom left of the screen, (optionally) save your wallet's keypair file to your computer for backup, then click "Continue".

After your Playground Wallet is created, you will notice the bottom of the window now states your wallet's address, your Huione balance, and the Huione cluster you are connected to (Devnet is usually the default/recommended, but a "localhost" test validator is also acceptable).

Create a Huione program

The code for your Rust based Huione program will live in your src/lib.rs file. Inside src/lib.rs you will be able to import your Rust crates and define your logic. Open your src/lib.rs file within Huione Playground.

Import the Huione_program crate#

At the top of lib.rs, we import the Huione-program crate and bring our needed items into the local namespace:

use huione_program::{
    account_info::AccountInfo,
    entrypoint,
    entrypoint::ProgramResult,
    pubkey::Pubkey,
    msg,
};

Write your program logic

Every Huione program must define an entrypoint that tells the Huione runtime where to start executing your on chain code. Your program's entrypoint should provide a public function named process_instruction:

// declare and export the program's entrypoint
entrypoint!(process_instruction);

// program entrypoint's implementation
pub fn process_instruction(
    program_id: &Pubkey,
    accounts: &[AccountInfo],
    instruction_data: &[u8]
) -> ProgramResult {
    // log a message to the blockchain
    msg!("Hello, world!");

    // gracefully exit the program
    Ok(())
}

Every on chain program should return the Ok result enum with a value of (). This tells the Huione runtime that your program executed successfully without errors.

Our program above will simply log a message of "Hello, world!" to the blockchain cluster, then gracefully exit with Ok(()).

Build your program

On the left sidebar, select the "Build & Deploy" tab. Next, click the "Build" button.

If you look at the Playground's terminal, you should see your Huione program begin to compile. Once complete, you will see a success message.


| ^^^^^^^^ help: if this is intentional,prefix it with an underscore:'_program_id'
|
= note: '#[warn(unused_vriables)]' on by default

warning: unused variable: 'accounts'
--> /src/lib.rs:15:5

  |
15| accounts: &[AccountInfo],
  | ^^^^^^^^ help: if this is intentional,prefix it with an underscore:'_accounts'

warning: unused variable: 'instruction_data'
--> /src/lib.rs:16:5

  |
16| instruction_data: &[u8],
  | ^^^^^^^^^^^^^^^^ help: if this is intentional,prefix it with an underscore:'_instruction_data'


warning: 'huionepg'(lib) generated 3 warnings
Build successful.Completed in 0.28s.

$[]

Note: You may receive warning when your program is compiled due to unused variables.

Don't worry, these warning will not affect your build.

They are due to our very simple program not using all the variables we declared in the process_instruction function.

Deploy your program

You can click the "Deploy" button to deploy your first program to the Huione blockchain. Specifically to your selected cluster (e.g. Devnet, Testnet, etc).

After each deployment, you will see your Playground Wallet balance change. By default, Huione Playground will automatically request Huione airdrops on your behalf to ensure your wallet has enough Huione to cover the cost of deployment.

Note: If you need more Huione, you can airdrop more by typing airdrop command in the playground terminal:

huione airdrop 2

lib.rs

use huione_program::{
    account_info::AccountInfo,
    entrypoint,
    entrypoint::ProgramResult,
    pubkey::Pubkey
    msg,
};

// declare and export the program's entrypoint
entrypoing!(process_instruction);

// program entrypoint's implementation
pub fn process_instruction(
    program_id:&Pubkey,
    accounts:&[AccountInfo],
instruction_data:&[u8]
)->ProgramResult {

Find your program id

When executing a program using web3.js or from another Huione program, you will need to provide the program id (aka public address of your program).

Inside Huione Playground's Build & Deploy sidebar, you can find your program id under the Program Credentials dropdown.

Congratulations!#

You have successfully setup, built, and deployed a Huione program using the Rust language directly in your browser.

Next, we will demonstrate how to interact with your on chain program.

Interact with your on chain program

Once you have successfully deployed a Huione program to the blockchain, you will want to be able to interact with that program.

Like most developers creating dApps and websites, we will interact with our on chain program using JavaScript.

Specifically, will use the open source NPM package @Huione/web3.js to aid in our client application.

NOTE: This web3.js package is an abstraction layer on top of the JSON RPC API that reduced the need for rewriting common boilerplate, helping to simplify your client side application code.

Initialize client

We will be using Huione Playground for the client generation. Create a client folder by running run command in the playground terminal:

run

We have created client folder and a default client.ts. This is where we will work for the rest of our hello world program.

Playground globals

In playground, there are many utilities that are globally available for us to use without installing or setting up anything.

Most important ones for our hello world program are web3 for @huione/web3.js and pg for Huione Playground utilities.

Note: You can go over all of the available globals by pressing CTRL+SPACE (or CMD+SPACE on macOS) inside the editor.

Call the program

To execute your on chain program, you must send a transaction to it. Each transaction submitted to the Huione blockchain contains a listing of instructions (and the program's that instruction will interact with).

Here we create a new transaction and add a single instruction to it:

// create an empty transaction
const transaction = new web3.Transaction();

// add a hello world program instruction to the transaction
transaction.add(
  new web3.TransactionInstruction({
    keys: [],
    programId: new web3.PublicKey(pg.PROGRAM_ID),
  })
);

Each instruction must include all the keys involved in the operation and the program ID we want to execute.

In this example keys is empty because our program only logs hello world and doesn't need any accounts.

With our transaction created, we can submit it to the cluster:

// send the transaction to the Huione cluster
console.log("Sending transaction...");
const txHash = await web3.sendAndConfirmTransaction(
  pg.connection,
  transaction,
  [pg.wallet.keypair]
);
console.log("Transaction sent with hash:", txHash);

Note: The first signer in the signers array is the transaction fee payer by default.

We are signing with our keypair pg.wallet.keypair.

Run the application

With the client application written, you can run the code via the same run command.

Once your application completes, you will see output similar to this:

Copy

Running client...
  client.ts:
    My address: GkxZRRNPfaUfL9XdYVfKF3rWjMcj5md6b6mpRoWpURwP
    My balance: 5.7254472 HC
    Sending transaction...
    Transaction sent with hash: 2Ra7D9JoqeNsax9HmNq6MB4qWtKPGcLwoqQ27mPYsPFh3h8wignvKB2mWZVvdzCyTnp7CEZhfg2cEpbavib9mCcq

Get transaction logs

We will be using Huione-CLI directly in playground to get the information about any transaction:

huione confirm -v <TRANSACTION_HASH>

Change <TRANSACTION_HASH> with the hash you received from calling hello world program.

You should see Hello, world! in the Log Messages section of the output. 🎉

Congratulations!!!#

You have now written a client application for your on chain program. You are now a Huione developer!

PS: Try to update your program's message then re-build, re-deploy, and re-execute your program.