🎓 On-Chain Resume Verifier

A production-ready Web3 application for creating and verifying NFT-based professional achievements. Build your decentralized resume with verifiable on-chain credentials.

🌟 Features

User Features

• 🔐 MetaMask Integration - Secure wallet connection
• 🎨 Mint Achievement NFTs - Create verifiable credentials on-chain
• 📊 Dashboard - View all your achievements with stats
• 🌓 Dark Mode - Modern UI with dark mode support
• 📱 Responsive Design - Works on all devices

Admin Features

• ✅ Verify Achievements - Mark achievements as verified
• 📋 Admin Panel - Manage all achievements in the system
• 🎯 Role-Based Access - Only contract owner can verify
• 🔍 Filter & Search - Filter by verification status

Technical Features

• ⛓️ ERC-721 NFT Standard - Industry standard implementation
• 🔒 Access Control - Ownable pattern for admin functions
• 📡 Event Emission - Track all actions on-chain
• 🎭 IPFS Ready - Metadata storage support
• ⚡ Gas Optimized - Efficient smart contract design

🏗️ Tech Stack

Smart Contract

• Solidity ^0.8.20
• OpenZeppelin Contracts - ERC-721, Ownable
• Hardhat - Development framework

Frontend

• React 18.2.0
• TypeScript 5.3.0
• Tailwind CSS 3.3.6
• ethers.js 6.9.0

Network

• Ethereum Sepolia Testnet (default)
• Hardhat Local Network (for development)

📁 Project Structure

on-chain-resume-verifier/
├── contracts/                    # Smart contracts
│   └── AchievementNFT.sol       # Main ERC-721 contract
├── scripts/                      # Deployment scripts
│   └── deploy.js                # Contract deployment
├── frontend/                     # React frontend
│   ├── public/
│   │   └── index.html
│   └── src/
│       ├── components/           # React components
│       │   ├── Header.tsx
│       │   ├── AchievementForm.tsx
│       │   ├── AchievementCard.tsx
│       │   ├── AchievementList.tsx
│       │   ├── AdminPanel.tsx
│       │   └── Toast.tsx
│       ├── hooks/                # Custom React hooks
│       │   ├── useWallet.ts
│       │   └── useContract.ts
│       ├── utils/                # Utility functions
│       │   └── helpers.ts
│       ├── types/                # TypeScript types
│       │   └── index.ts
│       ├── contracts/            # Contract ABIs (generated)
│       ├── App.tsx               # Main app component
│       ├── index.tsx             # Entry point
│       └── index.css             # Styles
├── hardhat.config.js             # Hardhat configuration
├── package.json                  # Dependencies
├── .env.example                  # Environment variables template
└── README.md                     # This file

🚀 Quick Start

Prerequisites

• Node.js >= 16.0.0
• npm or yarn
• MetaMask browser extension
• (Optional) Alchemy or Infura account for testnet deployment

Installation

1. Clone the repository

git clone <repository-url>
cd on-chain-resume-verifier

2. Install root dependencies

npm install

3. Install frontend dependencies

cd frontend
npm install
cd ..

4. Set up environment variables

cp .env.example .env

Edit .env and add your configuration:

# Your MetaMask private key (NEVER commit this!)
PRIVATE_KEY=your_private_key_here

# Get free RPC from Alchemy: https://www.alchemy.com/
SEPOLIA_RPC_URL=https://eth-sepolia.g.alchemy.com/v2/YOUR_API_KEY

# Optional: For contract verification
ETHERSCAN_API_KEY=your_etherscan_api_key

📝 Development Workflow

Step 1: Compile the Smart Contract

npm run compile

This will:

• Compile the Solidity contract
• Generate TypeScript types
• Create ABI files in artifacts/

Step 2: Deploy the Contract

Option A: Local Hardhat Network (Recommended for Testing)

1. Start local blockchain:

npm run node

2. In a new terminal, deploy:

npm run deploy:local

Option B: Sepolia Testnet (For Production Testing)

1. Get testnet ETH from Sepolia Faucet

2. Deploy to Sepolia:

npm run deploy:sepolia

After deployment, you'll see:

✅ AchievementNFT deployed to: 0x123...abc
Contract owner: 0x456...def

The deployment script automatically:

• Saves contract address to frontend/src/contracts/contract-address.json
• Copies ABI to frontend/src/contracts/AchievementNFT.json

Step 3: Run the Frontend

cd frontend
npm start

The app will open at http://localhost:3000

Step 4: Configure MetaMask

1. Add Sepolia Network (if using testnet)

   • Network Name: Sepolia
   • RPC URL: https://rpc.sepolia.org
   • Chain ID: 11155111
   • Currency: ETH

2. Import Account (if using local network)

   • Use one of the private keys from Hardhat's local accounts

3. Connect Wallet in the app

🎯 Usage Guide

For Users

1. Connect Wallet

   • Click "Connect Wallet" button
   • Approve MetaMask connection

2. Mint Achievement

   • Fill in the form:
     • Title: e.g., "Full Stack Developer Certificate"
     • Description: Details about your achievement
     • Issue Date: When you earned it
   • Click "Mint Achievement NFT"
   • Confirm transaction in MetaMask

3. View Achievements

   • See all your minted achievements
   • Check verification status
   • View statistics

For Admins (Contract Owner)

1. Access Admin Panel

   • Connect with the contract owner account
   • Click "Manage All Achievements"

2. Verify Achievements

   • Browse all achievements in the system
   • Click "Verify Achievement" on pending items
   • Confirm transaction in MetaMask

3. Filter Achievements

   • All: View all achievements
   • Verified: Only verified achievements
   • Pending: Only unverified achievements

🧪 Testing

Run Smart Contract Tests

npm test

Test Locally

1. Start local node: npm run node
2. Deploy locally: npm run deploy:local
3. Run frontend: cd frontend && npm start
4. Use MetaMask with local network

🔧 Configuration

Network Configuration

Edit hardhat.config.js to add more networks:

networks: {
  polygon: {
    url: process.env.POLYGON_RPC_URL,
    accounts: [process.env.PRIVATE_KEY],
    chainId: 137,
  },
}

Contract Address

After deployment, the contract address is stored in:

frontend/src/contracts/contract-address.json

📊 Smart Contract Functions

User Functions

• mintAchievement(title, description, issueDate, tokenURI) - Mint new achievement NFT
• getTokensByOwner(address) - Get all token IDs owned by address
• getAchievement(tokenId) - Get achievement details
• isVerified(tokenId) - Check if achievement is verified

Admin Functions (Owner Only)

• verifyAchievement(tokenId) - Mark achievement as verified
• unverifyAchievement(tokenId) - Remove verification

Events

• AchievementMinted(tokenId, owner, title, issueDate)
• AchievementVerified(tokenId, verifier, verifiedDate)
• AchievementUnverified(tokenId, verifier)

🎨 UI Components

Header

• Wallet connection status
• Dark mode toggle
• Admin badge for owner

AchievementForm

• Title input with validation
• Description textarea
• Date picker
• Loading states

AchievementCard

• Achievement details
• Verification badge
• Admin actions
• Copy token ID

AdminPanel

• Filter tabs
• Statistics cards
• All achievements view

🔐 Security Best Practices

1. Never commit .env file - Contains private keys
2. Use test networks first - Before mainnet deployment
3. Verify contracts - On Etherscan after deployment
4. Test thoroughly - All functionality before production
5. Keep dependencies updated - Regular security updates

🐛 Troubleshooting

Common Issues

"Contract not deployed"

• Run deployment script: npm run deploy:local
• Check contract address in frontend/src/contracts/contract-address.json

"Please install MetaMask"

• Install MetaMask extension
• Refresh the page

"Transaction failed"

• Check you have enough ETH for gas
• Ensure you're on the correct network
• Try increasing gas limit

"Cannot connect to network"

• Verify RPC URL in .env
• Check network is running (for local)
• Ensure MetaMask is on correct network

📈 Future Enhancements

• IPFS integration for metadata storage
• ENS domain resolution
• Achievement categories/tags
• Public profile pages
• Achievement sharing on social media
• Multi-chain support
• Batch minting
• Achievement templates
• Reputation scoring system
• Integration with LinkedIn

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

📄 License

This project is licensed under the MIT License.

🔗 Resources

• Hardhat Documentation
• OpenZeppelin Contracts
• ethers.js Documentation
• React Documentation
• Tailwind CSS
• MetaMask Documentation

💬 Support

For issues and questions:

• Open an issue on GitHub
• Check existing documentation
• Review Hardhat/ethers.js docs

🎉 Acknowledgments

Built with ❤️ using:

• OpenZeppelin for secure smart contract libraries
• Hardhat for development framework
• React and TypeScript for modern frontend
• Tailwind CSS for beautiful UI
• ethers.js for blockchain interaction

---

Happy Building! 🚀