Beginner Launch Tutorial
Beginner Launch Tutorial

Beginner Launch Tutorial

Beginner Launch Tutorial - Building an NFT Project with Niftory Web3 APIs

Niftory is a third party partner with Dapper Labs that provides a set of APIs for interacting with the Flow Blockchain, all without writing any Cadence contracts, transactions or scripts. Niftory does an excellent job of providing the core functionality of most NFT projects, that allows you to focus on your project and app, instead of the complexities of smart contracts on Flow.

This tutorial uses the MonsterMaker app as inspiration to create a similar app with Niftory that mints MonsterMaker NFTs.

MonsterMaker is an example dApp that demonstrates the basic structure of a Flow blockchain app that works with the Dapper Platform.

Live Demo:

MonsterMaker x Niftory Example Github Repo:

Add NFTs to Niftory

  1. Create Account on Niftory
    2. image

  1. Initialize the SmartContract
    2. image

  1. Create a Set
    2. image
    image

  1. Add Collectibles to the Set. We will use some pre-generated Monsters for this example.
    2. image

    Add information about your NFT. You can set a limit on the number of NFTs that can be minted and specify the rarity of the NFT:

    image

    Upload the image for your NFT:

    image

    Add any blockchain metadata about the NFT:

    image

    Your NFT will be added:

    image

  1. Mint the Collectible. This will mint the NFTModel that Niftory uses to the blockchain, which will allow the NFTs to be minted properly.
    2. image
    image

Build the App

  1. Clone the repo:
  2. Go to the dapper-wallet-storefront directory
  3. Copy .env.example to .env
  4. Add API Key, Client ID and Client Secret to the .env file:
    5. image

  1. Add contract and transactions to your Dapper Organization and App by following the steps outlined in this blog post:
    1. Add a new App
    2. Add the contract. The address will be in the form of A.<ADDRESS>.<NAME>. In the example below this will be A.ab764e6874389c75.MonsterMaker.
      3. image
    3. Add the public and storage paths using the CollectionPath (ie /public/<CollectionPath> and /storage/<CollectionPath>)
    4. Download the Dapper Transactions, and add setup.cdc as a Custom transaction and purchase.cdc as a Purchase transaction. Copy and paste the contents of metadata.cdc to the Metadata Script section for the Purchase transaction.
  2. Launch Sample App - Go to Drops and your NFT will be displayed
> yarn install
> yarn dev

You can easily modify/theme/style the UI:

image

Clicking on a Monster will allow a user to Mint that monster:

image

👋
Next: Back Home →