Ethereum Boilerplate Questions

[heyhey]

here’s the err msg and .env

[johnversus]

Hi @heyhey,
Can you remove # replace for production text from the env variable and try again?

[heyhey]

hi, thanks for your help it works now!

[heyhey]

So i was trying to make a call to a contract on the mumbai testnet, not sure why i’m getting this as i can connect wallet and access erc20 or NFT data using moralis api

didn’t touch this part either

env should be correctly setup?

[johnversus]

Hi @heyhey

It seems like you are using Morlais runContractFunction in your frontend react client component.
However, the API key that is set using the MoralisNextApi is only accessible on next js server component.

Try using the useEvmRunContractFunction() hook from @moralisweb3.next package. That should work.

Moralis-JS-SDK/packages/next at main · MoralisWeb3/Moralis-JS-SDK - useEvmRunContractFunction()

Here is an example code

const { fetch, data } = useEvmRunContractFunction();
  useEffect(() => {
    data && console.log(data);
  }, [data]);

//...
//  Call the fetch function through a button click or through a function. 
<button
        onClick={async () => {
          const data = await fetch({
            abi: [
              {
                inputs: [],
                name: "getPrice",
                outputs: [
                  {
                    internalType: "uint256",
                    name: "",
                    type: "uint256",
                  },
                ],
                stateMutability: "view",
                type: "function",
              },
            ],
            address: "0x1A92f7381B9F03921564a437210bB9396471050C",
            functionName: "getPrice",
            chain: 1,
          });
          console.log(data);
        }}
      >
        fetch contract data
      </button>

[heyhey]

what i’m trying to do is call a function from the smart contract to write data to it, it seems like useEvmRunContractFunction() is for read only. any suggestions?

[johnversus]

Hi @heyhey

The API only supports calling read-only contract functions. For calling the write function I would recommend using web3.js or ether.js directly as it requires interaction with the wallet. You can also use other libraries like wagmi which uses ether.js internally and provides react hooks to call smart contract functions. You can find more about it here.

I hope this helps😃

[heyhey]

How do i change the logo and displayed tab name? i don’t want ‘boilerplate’ in the tab name

I would also like to change the logo in the nav bar

[Va55]

Hello all,

This might be a total newbie question, but I am completely new to programming, Next.js and Moralis. Trying to learn.

I successfully installed the boilerplate and everything seems to be working fine. Because the boilerplate automatically runs Moralis I thought that I can now use Moralis where I have previously used ethers to connect to my smart contract.

In my old code I had

const { ethers } = require(“ethers”);

export async function displayContract() {
const contractAddress = “…”
const provider = new ethers.providers.Web3Provider(window.ethereum);
const signer = provider.getSigner();
const deal = new ethers.Contract(contractAddress, Abi, signer);
}

And I was expecting that I could now replace this bit by:

import { useMoralis, useMoralisWeb3Api, useMoralisWeb3 } from “@moralis/next”;

export async function displayContract() {
const { Moralis, web3 } = useMoralis();
const { accounts } = useWeb3();
const contractAddress = “…”
const deal = useWeb3Contract(contractAddress, Abi);
}

However, this doesn’t work… at least not out of the box. I’ve tried react-moralis too. What should I do to get the moralis functionality in the ethereum-boilerplate?

Thank you for helping a newcomer

[johnversus]

Hi @heyhey

The code related to name on tab can be found in the below path. You can remove boilerplate text from there
src/components/layouts/Default/Default.tsx

And the code to update the logo can be found in the below path. The logo from this file is imported and used in header component.
src/components/elements/MoralisLogo/MoralisLogo.tsx

[johnversus]

Hi @Va55

Moralis v2 sdk does not use the ether js library. So we recommend using the ether js library directly to call smart contract write functions.
Ethereum boilerplate use wagmi library to interact with wallets. So you can also wagmi to call the smart contract functions and it also provides react hooks to call smart contract functions.

useContractWrite

I hope this helps

[rishabhv471]

hey i am not able to use moralis server now what to do for that requirements of .env file

[YosephKS]

Hey @rishabhv471, server has been fully deprecated. If you like to use server you can do self-hosting

https://v1docs.moralis.io/moralis-dapp/getting-started/self-hosting-moralis-server

Check this out to see how you can do that~

[rishabhv471]

will starting my own server (self hosting )i will get those paramsin “.env”?

[Deckard]

Hello, since today I have the following warning everytime I try to connect my account the eth boilerplate with metamask:

I have no idea no idea where it’s coming from but I have it even if I start a new project with the last version the ethereum boilerplate.

[Iulian]

Hi, this is because of the latest metamask version. It tells you that the URI (http:// localhost:3000) and the domain used (ethereum-boilerplate.dapp) are not the same, this is because you are testing it locally. You can continue and click sign in, it is not an issue

[Deckard]

Thank you very much. So a new version of metamask just arrived and that’s why we have this warning.

[mmsixth]

Hi. New to the forum and novice at web3. Started off with implementing the ethereum boilerplate with intention to develop an NFT marketplace of my own.

1. Has anyone here done that?
2. For starters though, what steps do I need to take to style the moralis boilerplate the way I want it?
3. Is this boilerplate merely to show me what I own on the blockchain?
4. How can it be useful?

Thanks in advance to anyone who can give some guidance.