A meme NFT marketplace built with React, TypeScript, and modern web technologies. Buy, sell, and create meme NFTs on the KEKW marketplace.
- Browse Marketplace - Explore meme NFTs from the Imgflip API
- Create Memes - Upload or select meme templates and add your own text
- Wallet Integration - Connect your wallet to access marketplace features
- Profile - View your owned NFTs and created memes
- NES-style UI - Retro gaming aesthetic with pixel art design
- Frontend Framework: React 18 with TypeScript
- Build Tool: Vite 5
- Styling: Tailwind CSS + shadcn-ui components
- Routing: React Router DOM
- Notifications: Sonner toast notifications
- Testing: Vitest
- Node.js 18+
- npm or bun
# Clone the repository
git clone <repository-url>
cd kekw-arcade
# Install dependencies
npm install
# Start development server
npm run dev| Command | Description |
|---|---|
npm run dev |
Start development server with hot reload |
npm run build |
Build for production |
npm run preview |
Preview production build |
npm run lint |
Run ESLint |
npm run test |
Run tests |
src/
├── components/ # Reusable UI components
│ ├── ui/ # shadcn-ui components
│ ├── NFTCard.tsx # NFT display card
│ ├── Navbar.tsx # Navigation bar
│ └── ConnectWalletPrompt.tsx
├── contexts/ # React contexts
│ └── WalletContext.tsx
├── pages/ # Page components
│ ├── Marketplace.tsx # NFT marketplace
│ ├── CreateMeme.tsx # Meme creator
│ ├── Profile.tsx # User profile
│ └── Landing.tsx # Landing page
├── hooks/ # Custom React hooks
├── lib/ # Utility functions
└── data/ # Mock data
The app uses a mock wallet implementation for demonstration. In production, you would integrate with:
- MetaMask
- WalletConnect
- RainbowKit
- Imgflip API - Fetches popular meme templates for the marketplace and meme creator
MIT