artist-popup

The Artist Pop-Up NFT Platform is an innovative decentralized application that connects artists, attendees, and event organizers by combining physical pop-up art events with digital NFT technology. This platform allows artists to showcase their artwork and create NFTs that represent their pieces, giving collectors and attendees the opportunity to own unique digital collectibles linked to exclusive content. Using MetaMask, users can securely connect and interact with the platform, including minting new NFTs, transferring ownership, and accessing special content.

Revised Replit Instructions for Artist Pop-Up Event with NFT Integration

We’re simplifying the process for developing your artist pop-up event application, focusing on security, user experience, and reducing complexity by leveraging MetaMask for all user interactions—including admins, artists, and attendees. Here’s a comprehensive guide to set up and deploy your app on Replit, incorporating what we’ve learned so far.

Agent Instructions for Replit Setup

Step 1: Set Up the Replit Project

1. Create a New Replit Project:

   • Use Node.js as the base template for the project.
   • Make sure the workspace has an appropriate name, e.g., artist-popup-nft.

2. Install Required Dependencies:

   • Run the following command in the Replit console to install necessary packages:

     npm install @openzeppelin/contracts ethers dotenv hardhat web3 @walletconnect/client lit-js-sdk
     

   • These packages will enable the project to interact with Ethereum-compatible blockchains, manage smart contracts, and facilitate user authentication.

3. Add Environment Variables:

   • Click on the lock icon in the Replit sidebar to set up environment variables:
     • SKALE_ENDPOINT: Endpoint URL for SKALE network (e.g., https://testnet.skalenodes.com/v1/giant-half-dual-testnet).
     • NFT_CONTRACT_ADDRESS: The address of the deployed NFT contract.
     • Note: No private keys should be stored as environment variables.

Step 2: Hardhat Local Deployment for Smart Contract

1. Write the NFT Smart Contract:

   • Create a new Solidity file named ArtistPopupNFT.sol that uses OpenZeppelin's ERC721 standards.
   • The contract should implement role-based permissions for Artists, Attendees, and Admins.

2. Deploy the Contract Using Hardhat:

   • Configure the hardhat.config.js to point to the SKALE testnet.
   • Deploy locally using the following command:

     npx hardhat run scripts/deploy.js --network skale
     

   • After deploying, save the contract address and add it as an environment variable (NFT_CONTRACT_ADDRESS).

Step 3: Implement MetaMask Wallet Interactions

1. Add MetaMask Login Functionality:

   • Update main.js to connect to MetaMask for all blockchain interactions.
   • Implement the connectWallet() function to prompt users to connect their MetaMask wallet:

     async function connectWallet() {
       if (typeof window.ethereum !== 'undefined') {
         const accounts = await ethereum.request({ method: 'eth_requestAccounts' });
         console.log("Connected account:", accounts[0]);
       } else {
         alert("MetaMask is not installed. Please install it to continue.");
       }
     }
     

2. Use MetaMask for Admin and User Actions:

   • Admins, Artists, and Attendees will use MetaMask to authenticate, verify roles, and interact with the blockchain.
   • Ensure that functions like minting NFTs, transferring ownership, and admin controls are handled by prompting MetaMask for transaction approval.

Step 4: Build a Unified Dashboard

1. Create a Role-Based Dashboard (dashboard.html):

   • Implement one dashboard where the UI changes dynamically based on the authenticated user role.
   • Artist: Options for creating and minting artwork.
   • Attendee: Options for viewing owned NFTs and accessing exclusive content.
   • Admin: Special controls, such as pausing contracts or managing artists.

2. Show/Hide Features Based on Role:

   • Use main.js to determine the user role based on wallet address.
   • Example for showing admin controls:

     async function checkAdminStatus() {
       const accounts = await ethereum.request({ method: 'eth_requestAccounts' });
       const userAddress = accounts[0];
       // Assuming you have a smart contract method to verify admin status
       const isAdmin = await adminContract.methods.isAdmin(userAddress).call();
       if (isAdmin) {
         document.getElementById("admin-controls").style.display = "block";
       }
     }
     

Step 5: Exclusive Content Using Lit Protocol

1. Set Up Exclusive Content Encryption:

   • Use Lit Protocol to manage encryption and decryption of exclusive artist content.
   • When an attendee tries to access exclusive content, verify NFT ownership using ethers.js and Lit Protocol for secure decryption.

2. Front-End Interaction:

   • In exclusive_content.html, provide an “Unlock Exclusive Content” button that connects to MetaMask for verification.
   • If the user holds a qualifying NFT, Lit Protocol will decrypt the content and make it accessible.

Step 6: Testing and Deployment on Replit

1. Test the Interaction Flow:

   • Test all major flows including minting NFTs, transferring NFTs, verifying ownership, and accessing exclusive content using MetaMask.
   • Ensure users can log in securely, verify their roles, and interact with the smart contract deployed on SKALE.

2. Deploy on Replit:

   • Use Replit to host the front-end interface.
   • Make sure the smart contracts are deployed locally or using a secure cloud solution. Only the front-end interaction should happen through Replit.

Step 7: No API Required for Sign Protocol

• Sign Protocol Integration: Note that using Sign Protocol does not require a traditional API key. Instead, it involves direct interactions using wallet signatures, making the integration straightforward without needing extra API credentials.
• For example, SIWE (Sign-In with Ethereum) is handled via direct message signing and on-chain verification, eliminating the need for centralized API access.

Key Security Practices

• No Private Keys in Code: Avoid storing any private keys within Replit or any online environment.
• Role Management via Wallet: Use MetaMask to control access and verify actions securely without relying on centralized authentication.

Summary The entire app—including Admin, Artist, and Attendee roles—operates securely using MetaMask for authentication and blockchain transactions. Hosting on Replit is focused on the front-end, while smart contracts are managed securely using Hardhat and MetaMask to ensure a consistent, user-friendly experience without compromising security.