πŸ“Έ Uploading NFT Metadata and Media to IPFS

This guide will show you how to:

Why do I need Media and Metadata files?

Let's provide some context before we dive into the details.

When you create a non-fungible token, you need to have two files hosted off-chain:

  • a media file
  • a metadata file

These files have to be hosted off-chain because blockchains are not designed to store large amounts of data (storage costs are the highest on EVM blockchains). The blockchain only keeps a record of ownership of an NFT, which points to the metadata file, offloading the storage cost.

Now, let's take a look at the two files:

  1. The media file: any type/format (picture, audio, video). This is the visual asset your token represents.
  2. The Metadata file: A JSON file that serves as a descriptor for your token. It enables you to specify the tokenname, base_uri, and other attributes of your choosing. If you want to facilitate the discovery of your NFT, it's a good idea to structure your metadata file using a standard scheme. In this article, we'll implement the ERC721 Metadata JSON Schema.

When deploying a ERC-721 contract on Co:Create, a base_uri parameter is required. The base_uri is simply a URI that points to the future contract's metadata file.

That's a lot to take in! But the process is quite straightforward, and this article will help you show you how to upload your media and metadata files to IPFS and obtain the base_uri that you'll need to deploy your token.

NFTs and IPFS

You can store media and metadata files anywhere, but IPFS is the most common choice in the NFTs ecosystem. IPFS is a decentralized storage system.
As you can see in the chart, each NFT is a record of ownership sitting in a blockchain. This record points to a metadata file which points to the media file itself.

Once a file has been uploaded to IPFS, you can "pin" the file in IPFS to ensure it stays available. There are providers which offer to maintain your files on IPFS. Here are a few of those pinning services:

Here, we'll use NFT Storage for its convenience.

Setting up NFT Storage

  1. Sign up or log into NFT Storage website and copy/save your API key
  2. Download and install NFT Storage's desktop application NFTUp for your OS
  3. Launch the application.

Uploading The Media File

Let's first create a directory called media and then add the image file(s) to it:

  • If all NFTs have the same image create a single image called 0.png in /media

  • If each NFT points to the same image file create one image for each token id: 0.png, 1.png, 2.png...

    Then:

  1. Open the NFTUp application
  2. Drag and drop the media directory
  3. Paste the API Key that you obtained from the Setup
  4. Wait for the upload to complete
  5. Copy and save the Gateway URL URI:

Creating The NFT's Metadata file:

Here are the steps to create the metadata file:

  1. Create a directory called metadata
  2. Inside the directory, create a file called 0 (no file extension)
  3. The contents of the 0 file should look something like this.
{
  "name": "street-art #294",
  "description": "Street art - CC BY 2.0 - https://www.flickr.com/photos/adulau/",
  "image": "https://bafybeicm4hja3ty6jq52nsredyluviugp5d5ekos4cy4337cp5adj5aru4.ipfs.nftstorage.link/0.jpg"
}

The image field should be a concatenation of the Gateway URL from the previous step and the first image file (eg: 0.png)

  1. Assuming all NFTs will have the same metadata, we can batch-copy the'0file to1, 2, 3, ... 9999using this command in ourTerminal. This command should be run from within the /metadata` directory. This assumes that you don't plan on minting more than 10,000 NFTs.
for i in {1..9999}; do cp 0 $i; done
  1. You should now have 10,000 files in /metadata named 0,1,...,9999

πŸ“˜

Note:

The process explained above saves you a lot of time when preparing for large NFT "drops".

Behind the scene, when you mint x amount of ERC-721s (mint_quantity), Co:Create assigns automatically the right metadata files (0, 1,2...) to each token.


Uploading The Metadata Files

1. Upload the /metadata using NFT Up

2. Copy and save the Gateway URL

  • Example link: https://nftstorage.link/ipfs/bafybeiasv4llnkervuprzfte5sulodkzobcmpfc7ldwybdwiqq5ywbbstu

3. Add a trailing slash to the gateway URL.

It should now look like this: https://nftstorage.link/ipfs/bafybeiasv4llnkervuprzfte5sulodkzobcmpfc7ldwybdwiqq5ywbbst/

4. Verify that you can access the metadata JSON file by adding the token ID to the end of the gateway URL and navigating to that URL in your web browser.

  • Example link: https://nftstorage.link/ipfs/bafybeiasv4llnkervuprzfte5sulodkzobcmpfc7ldwybdwiqq5ywbbstu/0
  • This link should show you the json metadata for token id 0

Using The Files' URI

You can now use the IPFS base_uri of your metadata file(s) to mint your NFT(s). It needs to have a trailing slash. The URL for each token is base_uri+token_id.

This is an example of a base_uri, used when deploying a ERC-721 NFT contract:

https://nftstorage.link/ipfs/bafybeiasv4llnkervuprzfte5sulodkzobcmpfc7ldwybdwiqq5ywbbstu/

You can try deploying a test contract with the above parameter in your browser!


That's all for this post. If you want to take it to the next step, deploy and mint your first ERC-721, you can keep building here!

πŸ‘

Get Help

If you get stuck at any time, reach out to us on Discord or contact us via email at [email protected].