Skip to content

Latest commit

 

History

History

ethers

Getting started with Dapp on Asset Hub

⚠️ Warning: Hardhat plugins are not available yet for Contracts on Asset Hub. This repository serves as a temporary solution until we can use the hardhat tools.

This repository contains a sample project that you can use as the starting point for your Smart Contracts on Asset Hub project. It's also a great fit for learning the basics of smart contract development.

Quick start

Prerequisites

The first things you need to do are cloning this repository and installing its dependencies:

git clone https://github.com/paritytech/contracts-boilerplate.git
cd contracts-boilerplate/ethers

We will use Bun, a modern alternative to node/npm with batteries included. To install Bun, run the following command:

curl -fsSL https://bun.sh/install | bash

Once installed, you can use Bun to install the project dependencies:

bun install

Building contracts

We can now compile the contracts located in the contracts/ directory:

bun tools/build.ts

This does the following:

  • Compile the bytecode for each contract into codgen/bytecode/*.polkavm
  • Generate the abi for each contract into codgen/abi/*.json

Deploying contracts

Update tools/deploy.ts to include new contracts you want to deploy. Make sure to specify the constructor arguments and the value, if needed.

Before you can deploy contracts, let's copy the .env.example file to .env and fill in the required environment variables.

cp .env.example .env

To deploy to Westend, you will need to specify the WESTEND_PRIVATE_KEY. For local development, checkout the instructions here to setup and start a local chain.

Now that you have the environment variables setup, you can deploy the contracts by running:

bun tools/deploy.ts

This command will update the src/contracts/contract-address.json file with the deployed contract addresses, so that you can easily import them in your frontend.

Running the frontend

Once the contracts are deployed you can run the frontend by running:

bun dev --open

Architecture of the Dapp

This Dapp consists of multiple React Components, which you can find in src/components.

Most of them are presentational components, have no logic, and just render HTML.

The core functionality is implemented in src/components/Dapp.tsx, which has examples of how to connect to the user's wallet, initialize your wallet connection and contracts, read from the contract's state, and send transactions.

You can use the Dapp component as a starting point for your project. It has comments explaining each part of its code, and indicating what's specific to this project, and what can be reused.

Learn more