Giter Club home page Giter Club logo

eth-erc721-physical-asset-delivery's Introduction

Ethereum NFT(ERC721) with Physical Asset Delivery and Secondary Royalties PRs Welcome Add to Homescreen

made for ethereum to the moon MIT license

I think the NFT(ERC721) is an important use case that every Solidity developer needs to get familiar besides ERC20.

The token of the dApps known as Physical Asset Token with symbol PA as it is involved physical item delivery. The seller of the NFT needs to specify the "Lock From Date" and "Unlock Password" upon minting the NFT. The NFT is locked starting from the "Lock From Date". The buyer cannot sells/transfers the NFT until he/she unlocks the NFT with the "Unlock Password" that come with the physical item.

The project is created by referred to excellent tutorials on ERC721 and Secondary Sales Royalties published by Thomas Wiesner.

The project is using the following third party libraries:

  • Use nft.storage to store the image of the NFT and metadata.json file to the IPFS. You can find out more about nft.storage here.
  • Use @openzeppelin/contracts for implementation of ERC721
  • Reuse the codes of @rarible/royalties/contracts.
  • Use truffle-assertions for writing unit tests.

It is tested with MetaMask Chrome extension and Android. I think it is good idea to test out the dApp hosted on Skynet yourself before looking into the code.

The dApps is interacting with smart contracts running on Rinkeby testnet, hence you need some ETH in your wallet. If you don't have any, you can request some ETH from Rinkeby Faucet.

Smart Contract Development

The project is bootstrapped with Truffle using truffle init command.

Steps to run the smart contracts locally:

  1. Clone the github repository. This also takes care of installing the necessary dependencies.

    git clone [email protected]:limcheekin/eth-erc721-physical-asset-delivery.git
  2. Install dependencies in the root directory.

    npm i
    # or
    yarn
  3. Install Truffle globally.

    npm install -g truffle
  4. Run the development console in the root directory of the project.

    truffle develop
  5. Compile and migrate the smart contracts. Note inside the development console we don't preface commands with truffle.

    compile
    migrate

    Please note down the contract address of the deployed smart contracts. We will need to update it in the front-end's .env.local.

  6. Truffle can run tests written in Solidity or JavaScript against your smart contracts. Note the command varies slightly if you're in or outside of the development console.

    // If inside the development console.
    test
    
    // If outside the development console.
    truffle test
  7. Deploy smart contract to Rinkeby testnet

    • Create a .env file with the configuration of Infura Project ID and private key of your Rinkeby account, for example:

      INFURA_PROJECT_ID=Your_Infura_Project_Id
      RINKEBY_PRIVATE_KEY=Your_Rinkeby_Private_Key
      
    • Run the truffle migrate --network rinkeby command to deploy smart contract to Rinkeby network.

dApps Front End

The front-end code of the dApps is located in client directory. It is a Next.js project bootstrapped with create-next-app.

The client is created by derived/adapted the codes from the following excellence articles:

Steps to run the client locally:

  1. Install dependencies.

    npm i
    # or
    yarn
  2. Create the .env.local file in the client directory and define the following environment variables:

    NEXT_PUBLIC_CONTRACT_ADDRESS=0x...
    NEXT_PUBLIC_INFURA_PROJECT_ID=...
    NEXT_PUBLIC_NFT_STORAGE_API_KEY=...
    

    As the .env.local file is not stored in the repo, you need to add the content of the .env.local file as DOT_ENV_DOT_LOCAL secret for Skynet deployment.

  3. Run the development server

    npm run dev
    # or
    yarn dev

    Open http://localhost:3000 with your browser, you will see the following screen of the React client:

    Main Screen

  4. Run with MetaMask

    As truffle develop exposes the blockchain onto port 9545, you'll need to add a Custom RPC network of http://localhost:9545 in your MetaMask to make it work.

  5. After connected to MetaMask from the main screen, you will see the following screen which allow you to upload image to the IPFS and mint the NFT by click on the "Create" button.

    Create Screen

  6. After the token created successfully then click the list tab to view it, you will see the following screen:

    List Screen

  7. Run with Rinkeby network

    After the NFT token minted in the Rinkeby network, you can view it in the testnet/testsite of the following NFT marketplaces:

    • OpenSea

      OpenSea Screen

    • Rarible

      Rarible Screen

    • Mintable

      However, it is unable to view on Mintable as per response from the Customer Support on 17 Nov 2021: "I've made a check with the devs. Our Rinkeby Testnet is currently outdated. The devs are working on it to get it updated, unfortunately, I do not have an ETA on when it'll be updated. Hope this explains!"

Continuous Integration

The repository setup Continuous Integration build pipeline with GitHub Actions. If you use it as your project template, the first build will fail upon project creation. To fix it, you need to setup the CC_SECRET encrypted secret for Codechecks and DOT_COVERALLS_YML encrypted secret for Coveralls. Please refer to Continuous Integration Setup for more information.

eth-erc721-physical-asset-delivery's People

Contributors

actions-user avatar limcheekin avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.