I have just made the authentication work in NextJS.
https://cyberhornetscolony.club/staging
Next I tried this to get the NFT count.
const nftCount = await Moralis.Web3.getNFTsCount();
But maybe because that I am a newbie I couldnât successfully do it.
Can you please provide me a sample script in NextJS to try this.
Here is my login script inside navbar component.
// import Image from 'next/image'
import styles from '../styles/Navbar.module.css'
import { useMoralis } from "react-moralis";
const Navbar = () => {
const { authenticate, isAuthenticated, logout, user } = useMoralis();
return (
<div className={styles.container}>
<div className="container-fluid">
<div className="row">
<div className="col-6">
<img src="/nft-nextjs/img/logo.png" alt="" width="210px" height="94px" />
</div>
<div className="col-6 ">
<div id="login-header-icons">
{isAuthenticated ? (
<>
<button onClick={logout}>Logout</button>
<h4>{maskEthAddress(user.get('ethAddress'))}</h4>
</>
) : (
<button
onClick={() => {
authenticate({ provider: "metamask" });
}}
>
Sign in with MetaMask
</button>
)}
</div>
</div>
</div>
</div>
</div>
)
}
function maskEthAddress(eth_address) {
return eth_address.substring(0,4) + "..." + eth_address.slice(-4);
}
export default Navbar