Advanced DApp Concepts: Infura

Introduction

If we wanted to deploy your application to the main Ethereum network or any other test network, you had to connect to that particular network using the Go Ethereum client. It must also wait to sync with the network, connect to the client, and then deploy and run your application. But sometimes, running a client might not be possible due to system capabilities or something else.

Infura is a hosted Ethereum node cluster that lets your users run your application without requiring them to set up their own Ethereum node or wallet.

Let's see how we can integrate Infura into our certificate decentralized application. The steps included are:

1. Setting up the Infura project
2. Configuring Hardhat & deploying the contract
3. Creating transaction signing script
4. Changing the Ethers configuration
5. Updating the contract call

Setting Up Infura

Infura is an online service, so we must set up an account and get access to endpoints to integrate it into our project. Go to infura.io, create a new account, and log in.

After you sign in, select the 'CREATE NEW API KEY' button at the top right.

In the 'All Endpoints' tab, select the networks you wish to connect to and select 'SAVE CHANGES'.

To add the Infura endpoint to our Hardhat project, we simply need to edit the 'hardhat.config.js' file with the configuration for a new network.

require("@nomicfoundation/hardhat-toolbox");

/** @type import('hardhat/config').HardhatUserConfig */
module.exports = {
  defaultNetwork: "localhost",
  networks: {
    localhost: {
      url: "http://127.0.0.1:8545"
    },
    hardhat: {
      // See its defaults
    },
    infura: {
      url: "<your-infura-API-endpoint>",
      accounts: ["<your-private-key>"]
    },
  },
  solidity: "0.8.20",
};

As for deploying the contract, we can simply run:

npx hardhat ignition deploy ignition/modules/Cert.js --network infura

Integrating Infura in DApp

To update our initial configuration in DApp, open the 'instance.js' file in our server-side code and edit the provider and wallet declarations.

const provider = new JsonRpcProvider("<your-infura-API-endpoint>");
const wallet = new Wallet('<your-private-key>', provider);

Afterwards, run the application and see the changes yourself.

npm run dev