andreafspeziale / pokemon-ERC721-app

🐯 Display owned ERC721 Pokemon cards based on Metamask account

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Pokemon ERC-721 App

ERC-721 is the Ethereum standard for non-fungible tokens.

Full working sample

This project is composed by two components:

The Truffle project contains the smart contracts and all the tools for the contracts deployment and testing.

Before continuing you should clone and follow th Truffle project README.
You should have a directory structure like follows:

working_dir/pokemon-ERC721
working_dir/pokemon-ERC721-app

The App project contains a simple server to retrive the Pokemon tokenURI information and a HTML page to display and transfer the tokens and so the related Pokemons.

To quickly run the whole project

  • clone and follow the readme of the Truffle project
  • install Metamask on your browser
  • connect Metamask to your local Ethereum node launched during the Truffle project setup, it should be exposed on http://127.0.0.1:7545
  • import into Metamask (using the private keys) the local Ethereum node accounts, the most important account is the eth.accounts[1] (it is the receiver of all tokens)
  • clone this repository
  • $ npm i
  • $ cd config && cp config.js.sample config.js
  • use the following as config.js:
module.exports = {
  truffleBuildPath: '../pokemon-ERC721/build/contracts/Pokemon.json',
  networkId: 47,
}
  • $ npm run server:start
  • open your browser, unlock Metamask and select the previously imported eth.accounts[1]
  • go to http://localhost:3000
  • thats all, you should see all the Pokemon tokens that eth.accounts[1] you previously imported owns

browser dapp sample

System used

System used during the development of the project

  • node v10.9.0
  • npm 6.2.0

Install

Install project dependencies

Command: $ npm i

Run the server

Run the project

Command: $ npm run server:start

Config

The config folder contains a config file where you can specified the path of the ERC721 Pokemon token build folder and the NetworkId where it has been deployed.

About

🐯 Display owned ERC721 Pokemon cards based on Metamask account


Languages

Language:JavaScript 86.3%Language:HTML 13.7%