Skip to content

grasshopper47/NFTOpt

Repository files navigation

CI/CD

Contents

  1. PREPARATION
  2. SMART CONTRACTS
  3. SUBGRAPHS
  4. FRONTEND
  5. TUTORIAL


PREPARATION


Update and source dependecies using nodejs

npm install


Generate the types used throughout the project

npm run clean
npm run compile


Run tests through HardHat (optional)

npm run tests


SMART CONTRACTS


Start Hardhat blockchain node ⚠️ Run in a separate terminal session ⚠️

npm run "start blockchain"

A live ETH (Ganache) node under HardHat management; closing the console will require smart contracts to be re-published


Publish smart contracts on local blockchain node

npm run "solidity publish all"

When successful, this task generates the following files:

  • addresses of contracts deployed by scripts/publish/all.ts are outputted in ./addresses.json
  • Graph generator JSON files are outputted in ./graphs/{name}/config.JSON

SUBGRAPHS


These steps are optional, as the app can work without a Graph node, albeit with reduced functionality

Clone and build Graph (GRT) for local deployment

Consult the README of graph-node GitHub repo
⚠️ Store cloned graph-node repo one level above ( ../ ) this project's location on disk ⚠️


Start ipfs node ⚠️ Run in a separate terminal session ⚠️

npm run "start ipfs"


Start graph node ⚠️ Run in a separate terminal session ⚠️

npm run "start graph"


Create and publish indexer nodes on local graph node

npm run "graph generate all"
npm run "graph publish all"


FRONTEND


Setup Metamask with the locally-deployed node and import accounts

Step 1:
 Go to the console/terminal window where the Hardhat blockchain node was previously deployed
 Import the private keys for account #0 (buyer) and account #1 (seller) in Metamask

Step 2:
 Check that the local node running at http://127.0.0.1:8545 is visible in Metamask via Networks tab in Settings
 You may need to edit the chain ID of this network to be 31337 (elite = eleet = 31337)

Start react-next frontend node ⚠️ Run in a separate terminal session ⚠️

npm run "start webserver"

React components ( .jsx files ) can be edited and viewed without rebuilding, as react-next auto-refreshes the view on save


TUTORIAL

After completing all of the operations described above, you should be able to access http://localhost:3003 and connect Metamask using account #0 (buyer) imported earlier, as it has 1000 ETH in its wallet

image

Notice a new tab labeled Mint in the header menu; click it
image

In the new page, select an NFT collection from the dropdown of collections
image

Click the "Mint" button to create an NFT for the connected account and confirm the transaction

Once it completes you will be able to publish a request for option via the Publish tab in the header menu
image



PORT LIST

3003 : react-next
5002 : ipfs
5432 : postgres
8000 : graphiQL
8020 : graph-indexer
8545 : ganache/hardhat