Skip to content

Mirak29/nft-marketplace

Repository files navigation

Yu-Gi-Oh! NFT Marketplace

A thematic NFT marketplace for Yu-Gi-Oh! trading cards built on Ethereum with ERC721 standard. Users can discover, collect, and trade authentic Yu-Gi-Oh! cards as NFTs.

Features

  • 🎴 Yu-Gi-Oh! Theme: Dedicated marketplace for Yu-Gi-Oh! card NFTs
  • 🔗 Wallet Integration: Connect MetaMask for full functionality
  • 🛒 Buy & Sell: List NFTs for fixed prices and purchase with ETH
  • 📱 Portfolio Management: View and manage your NFT collection
  • 🔍 Advanced Filters: Filter by card type, attribute, rarity, and price
  • Submit NFTs: Add existing ERC721 NFTs from any contract

Quick Setup

Follow these steps to run the marketplace locally:

Prerequisites

  • Node.js (v16 or higher)
  • MetaMask browser extension

Installation & Deployment

  1. Install dependencies

    npm install
  2. Start local blockchain

    npx hardhat node

    Keep this terminal running. The blockchain will be available at http://127.0.0.1:8545

  3. Deploy smart contracts (in a new terminal)

    npm run deploy
  4. Deploy sample NFTs

    npm run samples
  5. Start the API server (for NFT submissions)

    npm run api
  6. Launch the website

    npm run serve

The website will be available at http://localhost:8080

Sample NFTs Available

After running npm run samples, the following Yu-Gi-Oh! NFTs will be available for testing:

YugiohNFT Contract (0x5FbDB2315678afecb367f032d93F642f64180aa3)

  • Blue-Eyes White Dragon - Token ID: 0 (Listed for 2.5 ETH)
  • Dark Magician - Token ID: 1 (Listed for 1.8 ETH)
  • Red-Eyes Black Dragon - Token ID: 2 (Listed for 2.0 ETH)
  • Exodia the Forbidden One - Token ID: 3 (Listed for 5.0 ETH)
  • Kuriboh - Token ID: 4 (Not listed)

SimpleNFT Contract (0x9fE46736679d2D9a65F0992F2272dE9f3c7fa6e0)

  • Neo the Magic Swordsman - Token ID: 0 (Not listed)
  • Baron of the Fiend Sword - Token ID: 1 (Not listed)
  • Man-Eating Treasure Chest - Token ID: 2 (Not listed)
  • Gemini Elf - Token ID: 3 (Not listed)
  • 4-Starred Ladybug of Doom - Token ID: 4 (Not listed)
  • 7 Colored Fish - Token ID: 5 (Not listed)

Testing Guide

1. Connect Wallet

  • Click "Connect Wallet" on the homepage
  • Connect MetaMask to the local network (Localhost 8545)
  • Import test accounts if needed

2. Browse NFTs

  • Visit the "Explore" page to see all available NFTs
  • Use filters to find specific card types or attributes
  • Click on any NFT to view details

3. Submit an NFT

  • Go to "Add Your NFT" page
  • Enter a contract address and token ID (use the sample NFTs above)
  • Example: Contract 0x9fE46736679d2D9a65F0992F2272dE9f3c7fa6e0, Token ID 0
  • Preview and submit the NFT

4. Portfolio Management

  • After connecting wallet, visit "Portfolio" page
  • View all NFTs you own
  • List NFTs for sale using the shopping cart icon

5. Buy/Sell NFTs

  • To buy: Click "Buy Now" on any listed NFT
  • To sell: Go to Portfolio → Click shopping cart icon → Set price
  • Test with different accounts to simulate real trading

Project Structure

nft-marketplace/
├── contracts/           # Solidity smart contracts
├── scripts/            # Deployment and seeding scripts
├── frontend/           # React frontend application
├── api-server/         # Backend API for NFT submission
└── test/              # Smart contract tests

Smart Contracts

  • YugiohNFT: Main NFT contract with Yu-Gi-Oh! specific metadata
  • YugiohMarketplace: Marketplace contract for buying/selling
  • SimpleNFT: Additional contract for external NFT testing

Development Commands

# Blockchain
npm run node          # Start local blockchain
npm run deploy        # Deploy main contracts (YugiohNFT + Marketplace)
npm run deploy-simple # Deploy SimpleNFT contract (for testing)
npm run samples       # Deploy sample Yu-Gi-Oh NFTs
npm run samples-simple # Deploy sample SimpleNFTs
npm run accounts      # Show test accounts

# API Server
npm run api           # Start API server (required for NFT submissions)
npm run api-dev       # Start API server in development mode

# Frontend
npm run serve         # Start frontend (localhost:8080)

# Quick Setup
npm run setup         # Deploy + seed main contracts
npm run setup-simple  # Deploy + seed SimpleNFT contract

# Testing
npm run test          # Run smart contract tests
npm run verify        # Verify deployment
npm run verify-audit  # Verify audit setup requirements

Additional NFT Contracts

For testing external NFT submissions, you can deploy SimpleNFT:

# Deploy SimpleNFT contract
npm run deploy-simple

# Mint 6 sample SimpleNFTs with Yu-Gi-Oh data
npm run samples-simple

# Or do both at once
npm run setup-simple

This creates 6 additional NFTs perfect for testing the Submit NFT feature!

MetaMask Setup

  1. Add Local Network:

  2. Import Test Accounts (from npx hardhat node output):

    • Use private keys shown in terminal
    • Each account has 10,000 ETH for testing

Troubleshooting

Port 8080 already in use?

# Kill any process using port 8080
sudo lsof -ti:8080 | xargs kill -9

MetaMask connection issues?

  • Reset MetaMask account (Settings → Advanced → Reset Account)
  • Ensure you're on the correct network (Localhost 8545)

NFTs not loading?

  • Check that blockchain is running (npx hardhat node)
  • Verify contracts are deployed (npm run deploy)
  • Refresh the page after wallet connection

License

MIT License

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published