I have deployed a smart contract using the Remix editor on the Mumbai testnet. Do I still need hardhat in order to interact with the smart contract?

Question

I have deployed a smart contract using the remix editor. I need to know that if I have to have the hardhat extension as well. I want a user to be able to set up their profile using the UI with some info like availability, profile picture hourly rate etc. In remix I have been able to achieve this by adding a new instance after deploying the smart contract. I am not too sure how I(or someone else) would be able to interact with the smart contract using the UI. I am intending use Moralis and the Web3uikit I also want the pictures to be uploaded to IPFS aswell.

Answer 1

No, hardhat is used to compile, test and deploy smart contracts, on your own local hardhat blockchain instance, or a testnet or mainnet. If you have already deployed the contract to a blockchain then you don't need hardhat anymore.

If you verified the contract, you should be able to interact with it via https://mumbai.polygonscan.com/ > search your contract's address > contract tab.

Yet, from what I can grasp from your question, I think what you'll need to do is create a website that would be used as an interface for the contract.

Answer 2

You do not need hardhat.

If you want to interact with a smart contract from your UI, you will need to connect a wallet like metamask from the application's UI. Using JS libraries like etherJs or web3JS you can connect and interact with the smart contract.

For example using etherjs:

async function payUser (amount){

  //connect to metamask
  const { ethereum } = window;

  //if ethereum is not found, it means that a user does not  
 //have metamask installed on their browser
  if (!ethereum) {
    return;
  }

  //Get wallet provider and signer
  const provider = new ethers.providers.Web3Provider(ethereum);
  const signer = provider.getSigner();

  //contract initialization: create an instance of the //contract
  const contractInstance = new ethers.Contract(contractAddress, abi, signer);

  //Interact with the contract using appropriate methods
  const transaction = await 
  contractInstance.pay(ethers.utils.parseEther(amount))

}