A full-stack decentralized NFT marketplace built with React, TypeScript, and Solidity.

The NFT Marketplace follows a decentralized architecture with The Graph for indexing and IPFS for metadata storage:

sequenceDiagram
    participant Client as Client (React)
    participant IPFS as IPFS Network
    participant Contract as Smart Contract<br/>(Ethereum)
    participant Graph as The Graph<br/>(Indexer)

    Note over Client,Graph: 1. Initial Data Fetch
    Client->>Graph: Query NFTs & Marketplace Data
    Graph-->>Client: Return indexed data

    Note over Client,Graph: 2. Create/List NFT Flow
    Client->>IPFS: Upload NFT metadata & image
    IPFS-->>Client: Return IPFS hash (CID)
    
    Client->>Contract: Submit transaction<br/>(mint/list with IPFS hash)
    Contract-->>Client: Transaction confirmed
    
    Note over Contract,Graph: 3. Indexing
    Contract->>Graph: Emit events (NFTMinted, NFTListed)
    Graph->>Contract: Listen for events
    Graph->>Graph: Index blockchain data

    Note over Client,Graph: 4. Refresh Data
    Client->>Graph: Query updated data
    Graph-->>Client: Return latest indexed state

Before contributing or developing, please read our comprehensive coding guidelines:

👉 Coding Guidelines - Complete standards for React, TypeScript, Solidity, testing, and CI/CD

This document includes:

• Project structure and architecture
• Frontend coding standards (React + TypeScript with Airbnb style)
• Smart contract best practices (Solidity)
• ESLint and Prettier configurations
• Testing standards
• Common pitfalls and solutions

• Node.js >= 18.0.0
• npm >= 9.0.0

npm install

# Start frontend development server
npm run dev

# Start local Hardhat node
npm run node

# Compile smart contracts
npm compile

# Run tests
npm test
npm run test:contracts

• npm run dev - Start Vite dev server
• npm run build - Build for production
• npm run preview - Preview production build
• npm run lint - Lint TypeScript/React code
• npm run lint:fix - Fix linting issues
• npm run format - Format all files with Prettier
• npm run type-check - Run TypeScript type checking
• npm test - Run frontend tests

• npm run compile - Compile Solidity contracts
• npm run test:contracts - Run contract tests
• npm run lint:sol - Lint Solidity code
• npm run deploy:local - Deploy to local network
• npm run node - Start Hardhat node

• React 18+ - UI library
• TypeScript - Type safety
• Vite - Build tool
• TailwindCSS - Styling
• wagmi + RainbowKit - Web3 integration
• Zustand - State management
• React Query - Server state

• Solidity 0.8.20+ - Smart contract language
• Hardhat - Development environment
• OpenZeppelin - Secure contract libraries

• ESLint - Airbnb TypeScript standards
• Prettier - Code formatting
• Solhint - Solidity linting
• Husky - Git hooks
• Commitlint - Conventional commits

This project follows strict coding standards:

• Frontend: Airbnb TypeScript style guide
• Smart Contracts: Solidity best practices with OpenZeppelin patterns
• Commits: Conventional commits format
• Testing: Comprehensive test coverage required

See CODING_GUIDELINES.md for complete details.

# Frontend tests
npm test
npm run test:coverage

# Smart contract tests
npm run test:contracts

# Deploy to local network
npm run deploy:local

# Deploy to testnet (Goerli)
npm run deploy:testnet

MIT