Chidume Nnamdi I'm a software engineer with over six years of experience. I've worked with different stacks, including WAMP, MERN, and MEAN. My language of choice is JavaScript; frameworks are Angular and Node.js.

Create an NFT and upload your metadata to IPFS

5 min read 1524

The non-fungible token (NFT) industry has grown at a rapid pace in the past few years. It began as a crazy idea, but then all of a sudden, boom! It became the next big thing. People were still processing the idea behind blockchain, but now, the industry is finally ready to take the blockchain to the next level.

In February 2021, Figma CEO Dylan Fields sold a piece of NFT art for $7.5M. Twitter ex-CEO Jack Dorsey sold his first tweet (and the first tweet on Twitter) for $2.9M. The figures are maddening, especially for such a brand new art form. So even though I can’t promise you’ll be able to make that much, I hope you will be excited to learn about how to build and sell your own NFT!

Don’t worry, I got you covered. I will be sharing the steps to build an NFT and upload the metadata on IPFS.

What is an NFT?

NFT is an acronym for non-fungible token. In the world of smart contracts, we can create tokens and deploy them on a blockchain.

A fungible token means that the token is interchangeable, like a dollar or Bitcoin. The value is the same everywhere. For example, in physical currency, bills are fungible. This means that you can exchange a ten dollar bill for a ten one dollar bills. The worth remains the same and they are interchangeable, because one ten dollar bill is not individually more valuable than another.

Non-fungible tokens are different because they are not interchangeable. For example, land and properties are non-fungible. Two pieces of land may not be worth the same price, because one piece may have many natural resources while the other has none. That’s non-fungibility; the prices depend on certain outside factors.

Now, how do we relate all of this to the blockchain? Fungible tokens on the blockchain are called ERC-20 tokens. This ERC-20 is a standard format created by the Ethereum Foundation that is used to define a token. Many popular tokens have been created, like Tether (USDt), Bitcoin (BTC), BitTorrent Token (BTT), and many more.

These tokens are virtual currencies that can be traded just like real currencies. You can trade a real-world item like cars, land, or other goods and be paid in any of the tokens.

NFTs are created using the ERC-721 standard, which recognizes ownership. This ERC-721 is used to store ownership of collectibles in the blockchain. These collectibles can be anything, like deeds of ownership, houses, pieces of art, and so on.

Images, and more specifically digital art pieces, are popular collectibles NFTs because they are easy to store, share, and sell.



How to create an NFT

Building NFTs entails selecting (or creating) the image we want to own. We will use the IPFS to store the image, generate the JSON NFT metadata, and upload the metadata to IPFS.

Note, however, that images themselves are not stored on the blockchain; their references are. An NFT has a unique ID (the hash of the token), a URI (the location of the token), and the address of the owner. These are stored in a tabular format on the blockchain, like so:

ID Metadata Address
1 https://ipfs.io/ipfs/Qm 0x1234567890123456789012345678901234567890
2 https://ipfs.io/ipfs/Zn 0x3214567890123456789012345678901234567890

The URIs we will used above are not real, they are used to show how the real ones might look. 😄

The URIs in the table above only contain the URI of the token. This URI points to the storage of the token in the IPFS storage. There should be more information about the token; information like the description of the token or the symbol of the token. We will change it to JSON metadata, which contains more info about the NFT:

{
  "name": "My NFT",
  "description": "This is my NFT",
  "image": "https://ipfs.io/ipfs/Qm.png"
}

The name is the name of the NFT, description is the description of the NFT, and the image is the location of the image. There are other fields, but we will not use them for now.

This is the JSON metadata of the NFT, which will be stored in the blockchain and replicated across all of the nodes. With this, ownerships is immutable and can never be tampered with unless the owner wants to transfer the NFT to someone else.

On the blockchain, the table will look like this:

ID Metadata Address
1 { “name”: “My NFT”, “description”: “This is my NFT”, “image”: “https://ipfs.io/ipfs/Qm.png” } 0x1234567890123456789012345678901234567890
2 { “name”: “My NFT”, “description”: “This is my NFT”, “image”: “https://ipfs.io/ipfs/Zn.png” } 0x3214567890123456789012345678901234567890

You might be asking, why generate metadata? Why not store the image on the blockchain? That is technically feasible, but it will require a large chunk of data being saved on the blockchain.

Remember that gas fees are required to be paid before data is stored on the blockchain. So, imagine you have a single, small image that is 4.1MB in size. It will cost you thousands of dollars in gas fees. You can imagine how expensive it will be to store every image you want on the blockchain.

This is where the JSON metadata comes in to save the day. The metadata points to the details of the image or token, the token is uploaded to IPFS, and the URI from the IPFS is referenced from the metadata.

What is IPFS?

IPFS stands for InterPlanetary File System. It is a decentralized file system that is used to share and store files. According to DataDrivenInvestor, IPFS uses content-addressing to uniquely identify each file in a global namespace. This is important for our NFTs to link the NFT metadata to the place where the asset or artwork is stored.

IPFS is similar, but not the same, as Google Drive or Dropbox. Google Drive and Dropbox are centralized storage systems, which means they are governed by the proprietors of the website and the images in the servers can be changed at will.

For example, this is an image of a red house in Google Drive. This image resides in a centralized storage system, so the owners of the image can change the image at will. Now, the contents of the link can be changed to be an image of a green house (or anything at all) but still maintain the same URL.


More great articles from LogRocket:


So we now see why a centralized storage system is not good for NFTs. IPFS is decentralized, and is not tied to any specific company, so these problems are avoided. Plus, the URL of a file in IPFS is tied to the content of the file, so changes cannot be made without changing the URL.

Uploading images to IPFS

We will be using Tatum to upload the images to IPFS. Tatum is a command-line tool that is used to upload files to IPFS.

We can do this with a few API calls. First, we have to select an image we want to mint. In our case, we will be minting an image of an ape with swag. 😁

NFT ape with sunglasses

We can upload our ape image to Tatum using the following command:

curl --request POST \
  --url https://api-eu1.tatum.io/v3/ipfs \
  --header 'content-type: multipart/form-data' \
  --header 'x-api-key: REPLACE_KEY_VALUE' \
  -F [email protected]_path_to_our_ape_image.jpg

The above command will upload the image to Tatum IPFS. It will return an IPFS CID identifier of the stored file:

{
  "ipfsHash": "bAerseretERrfdin3gdf"
}

With this, we will create our NFT metadata:

// JSON
// nft-json-metadata.json
{
  "name": "My NFT",
  "description": "This is my NFT",
  "image": "ipfs://bAerseretERrfdin3gdf"
}

We will then upload it to Tatum using the previous CMD command:

curl --request POST \
  --url https://api-eu1.tatum.io/v3/ipfs \
  --header 'content-type: multipart/form-data' \
  --header 'x-api-key: REPLACE_KEY_VALUE' \
  -F [email protected]

This will return a CID identifier of the stored file. This IPFS CID hash points uniquely to the NFT metadata. Now, the next thing we have to do is to mint our NFT JSON metadata.

Tatum has an API to mint NFTs. We will mint our ape NFT to the Ethereum blockchain like so:

curl --request POST \
  --url https://api-eu1.tatum.io/v3/nft/mint \
  --header 'content-type: application/json' \
  --header 'x-api-key: REPLACE_KEY_VALUE' \
  --data '{
    "chain": "ETH",
    "tokenId": "100000",
    "to": "0x687422eEA2cB73B5d3e242bA5456b782919AFc85",
    "contractAddress": "0x687422eEA2cB73B5d3e242bA5456b782919AFc85",
    "erc20": "0x687422eEA2cB73B5d3e242bA5456b782919AFc85",
    "url": "ipfs://bAerseretERrfdin3gdf",
    "provenance": true,
    "authorAddresses": [
      "0x687422eEA2cB73B5d3e242bA5456b782919AFc85"
    ],
    "cashbackValues": [
      "0.5"
    ],
    "fixedValues": [
      "0.5"
    ],
    "fromPrivateKey": "0x05e150c73f1920ec14caa1e0b6aa09940899678051a78542840c2668ce5080c2",
    "nonce": 0,
    "fee": {
      "gasLimit": "40000",
      "gasPrice": "20"
    }
}'

With that, we have minted our NFT to the Ethereum blockchain!

Conclusion

We started this tutorial by learning what NFTs are, and how people have been making millions from them. Next, we demonstrated how to mint NFTs to the Ethereum blockchain using the Tatum API. We also saw how to generate metadata for NFTs and upload it to the Tatum IPFS.

NFT is not as complex as people think, you can easily create NFTs out of your favorite photos and videos and even make cash by selling them.

Join organizations like Bitso and Coinsquare who use LogRocket to proactively monitor their Web3 apps

Client-side issues that impact users’ ability to activate and transact in your apps can drastically affect your bottom line. If you’re interested in monitoring UX issues, automatically surfacing JavaScript errors, and tracking slow network requests and component load time, try LogRocket.https://logrocket.com/signup/

LogRocket is like a DVR for web and mobile apps, recording everything that happens in your web app or site. Instead of guessing why problems happen, you can aggregate and report on key frontend performance metrics, replay user sessions along with application state, log network requests, and automatically surface all errors.

Modernize how you debug web and mobile apps — .

Chidume Nnamdi I'm a software engineer with over six years of experience. I've worked with different stacks, including WAMP, MERN, and MEAN. My language of choice is JavaScript; frameworks are Angular and Node.js.

Leave a Reply