Ethereum Boilerplate Questions

[johnversus]

No, that should not affect authentication. Can you create a new topic in forum with more details on the error which you are receiving

[heyhey]

hi everyone! just started using the boilerplate and it seems great but when trying to connect my wallet on localhost, it throws an error “request failed with status code 500”

[YosephKS]

Hey @heyhey,

thanks for reaching out and hope you had a great day~

can you check the console or network tab what error message that you get from trying to connect the wallet? I suspect it has something to do with the Auth API

[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