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 using the following third party libraries:
nft.storageto store the image of the NFT and metadata.json file to the IPFS. You can find out more about nft.storage here.
@openzeppelin/contractsfor implementation of ERC721
- Reuse the codes of
truffle-assertionsfor writing unit tests.
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:
Clone the github repository. This also takes care of installing the necessary dependencies.
git clone email@example.com:limcheekin/eth-erc721-physical-asset-delivery.git
Install dependencies in the root directory.
npm i # or yarn
Install Truffle globally.
npm install -g truffle
Run the development console in the root directory of the project.
Compile and migrate the smart contracts. Note inside the development console we don't preface commands with
Please note down the contract address of the deployed smart contracts. We will need to update it in the front-end's
// If inside the development console. test // If outside the development console. truffle test
Deploy smart contract to Rinkeby testnet
.envfile with the configuration of Infura Project ID and private key of your Rinkeby account, for example:
truffle migrate --network rinkebycommand to deploy smart contract to Rinkeby network.
dApps Front End
The client is created by derived/adapted the codes from the following excellence articles:
- Build a Web3 Dapp in React & Login with MetaMask
- Global State Using Only React Hooks with the Context API (TypeScript Edition)
- Build Your First Solidity Dapp With Web3.js and MetaMask
Steps to run the client locally:
npm i # or yarn
.env.localfile in the
clientdirectory and define the following environment variables:
NEXT_PUBLIC_CONTRACT_ADDRESS=0x... NEXT_PUBLIC_INFURA_PROJECT_ID=... NEXT_PUBLIC_NFT_STORAGE_API_KEY=...
.env.localfile is not stored in the repo, you need to add the content of the
DOT_ENV_DOT_LOCALsecret for Skynet deployment.
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:
Run with MetaMask
truffle developexposes the blockchain onto port
9545, you'll need to add a Custom RPC network of
http://localhost:9545in your MetaMask to make it work.
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.
After the token created successfully then click the list tab to view it, you will see the following screen:
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:
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!"
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.