nft-viewer

Project for generating images, storing the images/metadata on IPFS, and then minting them as NFTs on the Ethereum blockchain.

Demo

NFT-Demo.-.SD.480p.mov

A user requests an image to be generated as their avatar
The image generation service produces an image
The image is sent to the IPFS pinning service, which forwards it to Pinata (In reality, this should be done after the user approves the image (which should be generated client-side, not server side), to prevent sending unwanted data to IPFS).
The Pinata webservice writes the image to IPFS, and returns a content id (CID)
The user approves the image, connects their wallet, and approve the transaction for turning their image into an NFT.
Alchemey connects to the Goerli Ethereum test net, and uses an ERC721 smart contract to mint an NFT
The smart contract writes the CID of the image data to the address of the user. The NFT has been minted.
Later, a user wishing to see their NFT connects to the site. They will have to connect to Metamask.
The NFT Minting/Reading service sends a read transaction to Alchemy
Alchemy forwards this to the smart contract, which returns all NFT CIDs assocaited with the user's address
The CID is sent to the IPFS service
The IPFS service forwards the CID to Pinata, which returns the actual content from IPFS The NFT data can now be displayed as an image avatar for the user.

It contains the following services/folders:

fe -- run this to see the finished product. An initial image will load from storage. A user can generate a new image, mint it as an NFT, and then their profile picture will be replaced with the NFT
nft-generator -- Generates random jpegs
ipfs-service -- API for receiving image data and uploading it to ipfs
smart-contracts -- Contains contracts for minting NFTs. -- Contains Express api for sending transactions to Ethereum to mint NFTs

Currently all services communicate over HTTP. In future it's worth explorign gRPC

run npm i within nft-generator, ipfs-service, and smart-contracts.

TBD