Help with how to

Moralis General
#1

I want to create a site that is one page like the one here: https://dumplingpets.com/

I checked in the documentation for Moralis and the forum, but there was no question that I could see that pointed to the exact video or documents that show how to build this.

Can someone help me please?

Thanks in advance.
Aims

#2

Hey @DappDiva

You need to create a smartcontract and a front end for it. For showing NFTs on frontend you can use https://docs.moralis.io/moralis-server/transactions-and-balances/nft-balances

For calling smart contract methods: https://docs.moralis.io/moralis-server/web3/web3-1

Take a look at:


#3

hi im have this error using moralis login and logout crypto feature in react

import Moralis from 'moralis';

import { useState } from 'react';

const Home =  props => {

    const [Logout, setLogin] = useState(props.logout);

    const Login = async () => {
        setLogin(
            Moralis.Web3.authenticate().then(function (user) {
                return user;
            })

        )
    }
    
    let currentUser =  Moralis.User.current()
    //console.log(currentUser);
    

    if(!currentUser){
        return(
            <div>
                <button onClick = { Login} >Authenticate</button>
            </div>            
        )

    }else{
        return(
            <div>
                <button onClick={ Logout}>logout</button>
            
            </div>

        )    
    }

this is the error im getting

Expected `onClick` listener to be a function, instead got a value of `object` type.
    at button
    at div
    at Home (http://localhost:3000/static/js/main.chunk.js:523:91)
    at div
    at App
#4

Hey @ross

Try to use:

<button onClick = {() => Login()} >Authenticate</button>
<button onClick={() => Logout()}>logout</button>

Probably you have the problem because of logout prop. Make sure you pass it to the component correctly.

Also take a look at:

Hope this will help you :man_mechanic:

P.S Next time please post your question in new topic :raised_hands:

#5

thanks this is the solution that seem to work for me.

    const  currentUser =  false

    const logout =  () => {
        Moralis.User.logOut()

    }
    

    const [Logout, setLogin] = useState(logout)
    const [User, setUser] = useState(currentUser)



    const Login = async () => {

        setLogin(
            Moralis.Web3.authenticate().then(function () {
                setUser(Moralis.User.current()) ;
            })

        )
    }
    

    

    if(User === false){
        const user = console.log(User)

        return(
            <div>
                <button onClick = {() => Login() && user } >Authenticate</button>

            </div>            
        )

    }else{
        return(
            
            <div>
                <button onClick={ () => Logout && setUser(false) }>logout</button>
            

            </div>

        )    
    }
1 Like
#6

Thank @Yomoo, I am working on this now, I am bit confused - what is the code below your response?

#7

Hi @DappDiva

What do you mean? :sweat_smile: