Giter Club home page Giter Club logo

nft-ipfs's Introduction

LW3Punks NFT Dapp

Welcome to the LW3Punks NFT Dapp! This dapp allows you to mint unique LW3Punks NFTs on the Polygon Mumbai testnet. Here's how you can get started:

Upload Images and Metadata to IPFS

  1. Sign up for Pinata to upload and pin your NFT images and metadata on IPFS.

  2. Download the LW3Punks folder to your computer and upload it to Pinata, naming the folder "LW3Punks".

  3. Note the CID (Content Identifier) generated for your folder.

  4. To check if your folder is on IPFS, use this URL: https://ipfs.io/ipfs/your-nft-folder-cid, replacing "your-nft-folder-cid" with the CID you received from Pinata.

  5. Upload metadata files for each NFT as JSON files. Example metadata structure is provided in the project.

  6. Name the folder containing metadata files "metadata" and upload it to Pinata.

  7. Note the CID generated for your metadata folder.

  8. To check if your metadata folder is on IPFS, use this URL: https://ipfs.io/ipfs/your-metadata-folder-cid, replacing "your-metadata-folder-cid" with the CID you received from Pinata.

Deploy the Smart Contract

  1. Set up a Hardhat project by following the commands in the project description.

  2. Create a new file named "LW3Punks.sol" in the NFT-IPFS/backend/contracts directory and paste the provided smart contract code.

  3. Set up your environment variables by creating a .env file in the NFT-IPFS/backend folder, as described in the project description.

  4. Compile the contract using npx hardhat compile.

  5. Deploy the contract to the Mumbai network using npx hardhat run scripts/deploy.js --network mumbai.

  6. Note the LW3Punks contract address provided in the terminal.

Create the Website

  1. Create a new Next.js app in the frontend folder using npx create-next-app@latest.

  2. Run the app with cd frontend and npm run dev.

  3. Install the required libraries (Web3Modal and ethers.js) using npm install web3modal and npm i ethers@5.

  4. Add your NFT contract address and ABI to the constants/index.js file.

  5. Customize the website by replacing the content in the pages/index.js file and updating the CSS in styles/Home.module.css.

  6. Run the website locally using npm run dev to test it.

Deploy the Website

  1. Sign in to Vercel with your GitHub account.

  2. Create a new project, select your IPFS-Practical repo, and configure it.

  3. Set the Root Directory to "my-app" and select "Next.js" as the framework.

  4. Click "Deploy" to deploy your dapp.

  5. Your deployed website's domain will be available in your Vercel dashboard.

Now, your LW3Punks NFT Dapp is live and ready to be used! Share the domain with your friends and start minting unique LW3Punks NFTs on the Polygon Mumbai testnet. Have fun! ๐Ÿš€

nft-ipfs's People

Contributors

lukman-01 avatar

Watchers

 avatar

Forkers

luvnft

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.