A MERN Stack dapp the utilizes three solidity contracts

Overview

Public Record App

Overview

This app includes a MERN stack and 3 solidity contracts. This app extends the provenance of existing NFTs by creating new NFTs for verified owners of existing NFTs.

The new NFT generated by this app includes on-chain owner message, on-chain metadata and a new SVG image that is generated by the backend and incorporates the origninal NFT image.

  • The new NFT image is pinned on IPFS via the Pinata API.
  • On-chain metadata is returned by the contract in Base64 format and complies with Opensea standards.

After the new NFT is minted, the owner is able to save an email to the apps MongoDb database. The app automatically sends the users email at a later time once the minting and an authentication process is confirmed. The users email is retrieved from the db at an interval and sent by the server using the SendGrid API.

This app makes calls to Ethereum and Polygon contracts as well as mints NFTs from both the Node/express backend as well as the React frontend. This app's associated solidity contracts make calls to seperate Polygon contracts to control the visibility of on-chain metadata and minting.

Goal

To give verified NFT owners the ability build/extend their existing NFT's provenance with a new visual NFT record. The new NFT record is comprised of an image including embeded owner message, on-chain owners message up to 200 characters, ownership verification, IPFS image hash, on-chain metadata with description and traits per Opensea standard.

Functionality

Solidity Contracts

This app incorporates three solidity contracts.

BuilderToken Contract

The Builder Token contract is an ERC-721 contract that includes Openzeppelin imports with several modifications. Owning a Builder Token is required to use the app. If users do not own a Builder Token NFT, they are given the opportunity to mint one within the app during the NFT generation process. This contract includes:

  • this contract includes a mintCompliance modifier
  • a wallet of owner function that returns all the tokens owned by an address
  • IPFS metadata
  • mint loop for multiple transactions
  • lower gas usage than ERC721Enumerable by using an alternative mint token supply control mechanism

VisibleModes Contract

The Visible Modes contract is an ERC-721 contract that includes Openzeppelin imports with several modifications having to do with mint control, on-chain metadata and metadata visibility control. This contract includes:

  • call to Builder Token contract to ensure minter owns a Builder Token as requirement of minting on Visible Modes contract
  • address to string function to display addresses in on-chain metadata compliant with marketplace standards
  • a tokenURI function that only returns on-chain metadata if a sha3 hash of the data corresponds with a returned sha3 hash from the mirror contract. This is meant to control visibility of the metadata at marketplaces like Opensea and effectively control NFT visibility.
  • on-chain metadata returned in Base64 format that complies with and renders at Opensea
  • access controled public functions for accessing metadata state
  • a DNA function that takes in token ID and returns a sha3 hash of the metadata and NFT owner address
  • lower gas usage than ERC721Enumerable by using an alternative mint token supply control mechanism

ModeMirror Contract

The Mode Mirror contract is an ERC721 contract making use of Openzeppelin imports with several modifications. This contract mints "mirror" NFTs that correspond to already minted Visible Mode contract NFTs. Mirror contract NFTs do not have publicly viewable metadata. The ownership of these NFTs is retained by the app. These NFTs are valueless and their visibility minimal.

The purpose of the Mirror contract is to give the app initial control over the visibility of new NFTs minted on the frontend at the Visible Modes contract. Once verification is achieved that the user/minter on the Visible Modes contract is the owner of an existing NFT the claim (for example a BAYC NFT), the app mints an NFT on the mirror contract with metadata and owner address that corresponds to the Visibile Modes contract NFT. This info is hashed and callable by the tokenURI function of the Visible Modes contract where it is compared and serves as a control. In effect, only after the Mirror contract NFT is minted by the backend can the on-chain metadata of the Visible Modes NFT become callable by marketplaces and users.

This mirror NFT is a security measure against malicious actors spoofing NFT ownership or corrupting new NFT metadata at the last moment since minting at Visible Modes contract occurs on the frontend. Additionally, this is a confidence building measure for users. This pattern negates the need for NFT owners to sign a transaction/expose their private key to prove NFT ownership, a known fraud/theft vector for novice blockchain users. User addresses are accurately verified when the mint transaction is signed on the Visible Modes contract mint function. Once the mirror NFT has been minted, the users new Visible Mode NFT metadata is immutable and cannot be made invisible. This contract includes:

  • multiple authorized minters generated by admin seedphrase that is different from contract owner seedphrase and viable for internal distribution
  • DNA function that returns a hash of the owner address and metadata to be used by Visible Modes contract to control metadata visibility and authentication on server

Server

This Node/Express server follows a modified MVC pattern. It serves static frontend assets. It validates user inputs with express validator. It uses mongoose to perform CRUD operations with a MongoDb database.

User Controller Functions

initRecord

Calls the Ethereum NFT contract for which the user claims to own a token. It verifies that the connected address on the frontend does own the specified NFT. It gets the image for the existing NFT from IPFS and converts it to Base64 format. It uses the existing NFT image and text provided by user to generate an array of objects whose values include an image, a template name and a solidity sha3 hash. It creates a record from a mongoose model. It uses mongoose to make a new database entry for the user session. It returns the array of possible NFTs to the user on the React frontend for their selection.

mrrQueue

Receives from the frontend the user selected NFT to be minted. It pulls the record for the selected NFT from MongoDb by solidity sha3 hash and does basic authentication. It generates the requested NFT image and metadata and hashes for consistency/QC. It uses Pinata API to pin NFT image to IPFS. It formats NFT metadata and updates db record. It returns NFT data to frontend for immediate mint.

initMRR

It receives the mint transaction receipt from the frontend, it confirms that a mint occured at the Visible Modes contract and confirms the reliable owner address from the blockchain. It pulls the db record for the mint and performs basic authenication of frontend supplied data. It updates MongoDb record if authenication fails. If authentication succeeds then it mints a mirror NFT record that makes viewable the metadata from the Visible Modes NFT minted by on the frontend. It updates MongoDb records to show that mirror mint has been completed.

suggestion

It receives suggestions from users for requested features or NFT project support and creates a MongoDb record for review.

sendMail

It receives user generated email data and makes an email record in the db to be sent later by the backend after authentication occurs.

Events

These are functions that execute at an interval. They to interact with database records to mint mirror NFT's that failed at initMrr or send emails after successful mints have been confirmed.

mintInterval

It pulls 'pending' records from the db. It loops through pending records to confirm that the user has minted a Visible Modes NFT and basic authentication succeeds. It then mints a mirror NFT to make the user's corresponding Visible Modes NFT metadata visible. It updates db records to show mint is complete.

emailInterval

It pulls 'pending' email records from the db. It loops through pending emails to process basic authentication. If authentication succeeds, it sends the email requested by the user with the SendGrid API.

Frontend

It is a React front end making use of React hooks and custom hooks. It allows users to connect their metamask wallet, input an existing Ethereum NFT token they own, input a message and keyword, mint a Builders Token NFT on Polygon, select and mint a Visible Modes Token on Polygon and send an email. It uses both Material UI and CSS for styling. It uses Formik and YUP for forms and basic validation. It uses Web3 for contract interactions.

Contracts Folder

This Truffle project compiles and deploys contracts on the Polygon Mainnet and Mumbai Testnet.

You might also like...

Contracts with missing implementation details and unit tests to help guide junior solidity developers.

template-challenge-staking Contracts with missing implementation details and unit tests to help guide junior solidity developers. Getting started Open

Oct 7, 2022

A Technical Blogging Website that utilizes Notion as a CMS for ease of modification with the help of the notion-API & whose content has been rendered with next-js and react-notion-x

A Technical Blogging Website that utilizes Notion as a CMS for ease of modification with the help of the notion-API & whose content has been rendered with next-js and react-notion-x

GDSC MCE Blogs This repo is what GDSC MCE uses to power their blogging website gdsc-mce-blogs. It uses Notion as a CMS, fetching content from Notion a

Dec 16, 2022

This website utilizes JavaScript, HTML, and CSS to allow the user to create a to-do list that they can add to, remove from, and edit.

todo Description the project. "To-do list" is a tool that helps to organize your day. It simply lists the things that you need to do and allows you to

Jul 23, 2022

simple jquery Plugin that utilizes Google API to get data from a Place on Google Maps

jQuery Plugin to display Google Reviews of a Place on Google Maps this will get the 5 reviews, google offers you. But I need more than 5 reviews! if y

Dec 14, 2022

three.js examples. if you are first in learning three.js , this will give you much help.

three.js examples. if you are first in learning three.js , this will give you much help.

three-projected-material Three.js Material which lets you do Texture Projection on a 3d Model. Installation After having installed three.js, install i

Nov 2, 2022

Text Engraving & Extrusion demo based on Three.js is implemented with Typescript and webpack5. Used THREE-CSGMesh as the core tech to achieve engraving and extrusion results

Text Engraving & Extrusion demo based on Three.js is implemented with Typescript and webpack5. Used THREE-CSGMesh as the core tech to achieve engraving and extrusion results

Text Engraving & Extrusion Text Engraving & Extrusion demo is implemented using Three.js, with Typescript and webpack5. Used THREE-CSGMesh as the core

Oct 12, 2022

Build a Full Stack Marketplace on Ethereum with React, Solidity, Hardhat, and Ethers.js

Build a Full Stack Marketplace on Ethereum with React, Solidity, Hardhat, and Ethers.js

Building a Digital Marketplace on Ethereum The technologies used in this workshop are React, Next.js, Tailwind CSS, HardHat, Solidity, and Ethers. Get

Nov 15, 2022

This is my first attempt in creating a mern stack ecommerce website. Hope you like it!!

MERN E-COMMERCE PROJECT Hi! My name is Suhrrid Banerjee, This is my first attempt in creating a MERN stack e-commerce website. Prerequisite Nil Env Va

Jan 8, 2022

MERN stack application which serves as an online map journal where users can mark and rate the places they've been to.

MERN stack application which serves as an online map journal where users can mark and rate the places they've been to.

PlaceRate PlaceRate is a MERN stack application which serves as an online map journal where users can mark and rate the places they've been to. You ca

May 17, 2022
Owner
Max Girteit
Max Girteit
Using a Decentralized Application (DApp) to Sell artwork on the Ethereum blockchain with smart contracts written in Solidity.

Decentralized Applications For Selling Limited Time Artwork This repository houses the Solidity, JavaScript, and HTML code for a Decentralized Applica

Keyan Ahmadi 4 Mar 20, 2023
This is a full-stack exercise tracker web application built using the MERN (MongoDB, ExpressJS, ReactJS, NodeJS) stack. You can easily track your exercises with this Full-Stack Web Application.

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

WMouton 2 Dec 25, 2021
Online Inventory Control System for an apparel manufacturing company "CASANOVA" (Pvt) Ltd. Technology stack: Node.js, Express.js, MongoDB Atlas, React.js (MERN Stack).

Project Name - Online Inventory Control System for an apparel manufacturing company "CASANOVA". The project was given a "A" grade. Group Leader - IT20

Pasindu Rukshan 1 Dec 26, 2021
It is a solo Project and In this repo I try to build a E-Commerce full-stack website with MERN stack technologies. For Practice purpose.

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

Alok Kumar 5 Aug 3, 2022
Elven Tools Dapp - Elrond blockckchain frontend dapp demo. Primarily for NFT minting, but it can be used for other purposes.

Elven Tools Dapp Docs: elven.tools/docs/landing-page.html Demo: dapp-demo.elven.tools Sneak peek: youtu.be/ATSxD3mD4dc The Dapp is built using Nextjs

Elven Tools 24 Jan 1, 2023
A Bed and Breakfast dApp run on Ethereum. Includes a token + schedule system (Solidity) and full front-end (React + ethers.js) built with Hardhat.

Hotel ETH - Watch Demo Video Hotel ETH A (fictional) Bed-and-Breakfast run on Ethereum Come Book a Room on Kovan or Rinkeby Networks View the Demo ยป C

Ryan Lambert 20 Aug 20, 2022
Introductory fullstack ethereum dapp using: solidity, hardhat, react.js, ethers.js

Intro to Fullstack Ethereum Development Check out deployed dapp here! (Make sure you're connected to the Rinkeby Testnet) This article will help you e

Christian Chiarulli 77 Dec 21, 2022
A hardhat solidity template with necessary libraries that support to develop, compile, test, deploy, upgrade, verify solidity smart contract

solidity-hardhat-template A solidity hardhat template with necessary libraries that support to develop, compile, test, deploy, upgrade, verify solidit

ChimGoKien 4 Oct 16, 2022
A professional truffle solidity template with all necessary libraries that support developer to develop, debug, test, deploy solidity smart contract

solidity-truffle-template A professional truffle solidity template with necessary libraries that support to develop, compile, test, deploy, upgrade, v

ChimGoKien 6 Nov 4, 2022
timecapsule solidity contracts + app

timecapsule-contracts compile contracts: $ yarn compile run tests: $ yarn test deployed and verified on testnets: - rinkeby: https://rinkeby.ether

null 2 Sep 25, 2021