Your job is to build a simple UX to visualize and manipulate ERC721 Tokens.
This repo contains the references (code + ABI) for two ERC721 tokens deployed on the Rinkeby testnet, which you'll need to use.
- Fake BAYC ( 0x6b740C7a965d75A4801642Fabc650DA92CeA47ef on Rinkeby ) (get the ABI)
- Fake Nefturians (0x14e68d0ba29c07478bd68f4a479a0211bd48ca4e on Rinkeby ) (get the ABI)
- Fake Meebits (0x66e0f56e86906fd7ee186d29a1a25dc12019c7f3 on Rinkeby ) (get the ABI)
- Fake Meebits Claimer (0x656ec82544a3464f07bb86bea3447a4fdf489c1b on Rinkeby ) (get the ABI)
To get started using these tokens, I suggest you use the truffle generated ABI and MyCrypto in order to claim/buy a token for each.
- Create a repo to host your work
- Create a React / Vue JS app and create a page /chain-info(2 pts)
- Connect your app to the Rinkeby network through Metamask and display the ChainId, the last block number, and user address with view /chain-info (2 pts)
- Show an error page and redirect user to it if the chain is not Rinkeby (1 pt)
- Create a page /fakeBayc
- Display the name and the total token number (2 pts)
- Create a button to claim a new token for the current user(2 pts)
- Create a page /fakeBayc/{token number}
- Display the information (image, name and description) referenced in the Metadata URI for token {token number} (2 pts)
- Show a clean error message on /fakeBayc/{token number} if the token does not exist (1pt)
- Create a page /fakeNefturians
- Display the minimum token price, and create a button to buy a token (this one needs to be paid for) (2 pts)
- Create a page /fakeNefturians/{user address}
- Display all the tokens {user address} has on tout doucement (2 pts)
- Create a page /fakeMeebits
- Create a button to mint a token.
- Read the contract
- Let the user pick a token number that wasn't minted yet
- use signature data to call function
claimAToken()on fake meebits claimer correctly (4 pts)