Docs
Deploying contracts

Deploying Clarity smart contracts

This transaction type is how we deploy a smart contract to the blockchain.

Usage

@micro-stacks/react exports a hook that you will use to call contract functions: useOpenContractDeploy.

import { useOpenContractDeploy } from '@micro-stacks/react';

Parameters

  • contractName: the name of the contract.
  • codeBody: the Clarity code for this contract as a string value.

Example

We will be deploying this simple Clarity contract:

(define-fungible-token connect-token)
(begin (ft-mint? connect-token u10000000 tx-sender))
(define-public (transfer
    (recipient principal)
    (amount uint)
  )
  (ok (ft-transfer? connect-token amount tx-sender recipient))
)
(define-public (faucet)
  (ok (ft-mint? connect-token u100 tx-sender))
)
(define-non-fungible-token hello-nft uint)
(begin (nft-mint? hello-nft u1 tx-sender))
(begin (nft-mint? hello-nft u2 tx-sender))

And this is how you'd request someone sign a transaction to deploy it:

import { useOpenContractDeploy } from '@micro-stacks/react';
import { useState } from 'react';
 
export const ContractDeploy = () => {
  const { openContractDeploy, isRequestPending } = useOpenContractDeploy();
  const [response, setResponse] = useState(null);
 
  const onClick = async () => {
    await openContractDeploy({
      contractName: `demo-deploy`,
      // the clarity contract above
      codeBody,
      onFinish: async data => {
        console.log('finished contract deploy!', data);
        setResponse(data);
      },
      onCancel: () => {
        console.log('popup closed!');
      },
    });
  };
 
  return (
    <div>
      <h4>Deploy a contract!</h4>
      {response && (
        <pre>
          <code>{JSON.stringify(response, null, 2)}</code>
        </pre>
      )}
      <button onClick={() => onClick()}>
        {isRequestPending ? 'request pending...' : 'Deploy a contract'}
      </button>
    </div>
  );
};