🎯 BidMaster - Online Auction Platform

A modern, real-time auction platform built with React and Vite. Features a professional dark/light theme, live bidding, and comprehensive auction management.

✨ Features

For Bidders

Browse live auctions across multiple categories (Watches, Art, Collectibles, Furniture, Electronics, Jewelry)
Real-time bidding with live price updates
Bid history tracking
User profile management
Auction countdown timers

For Auctioneers/Sellers

Create and manage auctions
Auctioneer dashboard with analytics
Three-minute rule auto-extension
Extend, cancel, or finalize auctions
Track bids across all listings

For Admins

User management and approval
Seller verification system
Commission rate configuration
Platform-wide auction oversight

UI/UX

Professional dark theme with 60-30-10 color rule (Black/White/Gold)
Fully responsive design (mobile-first)
Smooth animations and transitions
WCAG AAA accessibility compliance

🚀 Quick Start

🖱️ One-Click Start (Fastest)

Double-click START_BIDMASTER.bat from the repo root. It launches backend + frontend and opens the browser automatically.

⚡ New User? Start Here!

For complete setup instructions, see:

📖 START_HERE.md - Simple explanation of what to do
✅ SETUP_CHECKLIST.md - Step-by-step checklist
🚀 QUICKSTART.md - Quick commands
📚 BACKEND_SETUP_GUIDE.md - Detailed backend guide

Prerequisites

Node.js 18+
MongoDB (Atlas or Local)
npm or yarn

Basic Setup

1. Setup MongoDB (choose one):

Cloud: Create free MongoDB Atlas account at https://mongodb.com/cloud/atlas
Local: Install MongoDB Community Server

2. Backend Setup:

cd backend
npm install
# Create .env file with MongoDB connection string
npm run dev

3. Frontend Setup:

cd project1
npm install
npm run dev

4. Seed Database (optional):

cd backend
node seed.js

5. Open: http://localhost:5174

Test Accounts (after seeding)

Admin: admin@auction.com / admin123
Seller: seller1@auction.com / seller123
Bidder: bidder1@auction.com / bidder123

Useful Commands

Backend: cd backend && npm run dev
Frontend: cd project1 && npm run dev
Seed data: cd backend && node seed.js

Old Installation Method (Frontend Only)

# Clone the repository
git clone https://github.com/Prashant730/BidMaster.git

# Navigate to project directory
cd BidMaster/project1

# Install dependencies
npm install

# Start development server
npm run dev

The app will be available at http://localhost:5173

Build for Production

npm run build
npm run preview

🛠️ Tech Stack

Frontend: React 19, React Router DOM
Build Tool: Vite 7
Styling: TailwindCSS 3.4, Custom CSS
Real-time: Socket.io Client
HTTP Client: Axios
Linting: ESLint 9

📁 Project Structure

project1/
├── src/
│   ├── components/          # React components
│   │   ├── Header.jsx       # Navigation header
│   │   ├── Hero.jsx         # Landing hero section
│   │   ├── AuctionGrid.jsx  # Auction listings grid
│   │   ├── AuctionDetail.jsx # Single auction view
│   │   ├── CreateAuction.jsx # Auction creation form
│   │   ├── LoginModal.jsx   # Authentication modal
│   │   ├── UserProfile.jsx  # User profile page
│   │   ├── Admin.jsx        # Admin dashboard
│   │   ├── AuctioneerDashboard.jsx # Seller dashboard
│   │   └── ...
│   ├── context/             # React Context providers
│   ├── services/            # API services
│   ├── index.css            # Global styles
│   └── dark-theme-professional.css # Dark theme
├── public/                  # Static assets
└── package.json

🧭 Documentation Map

INDEX.md – master index for every guide
SYSTEM_VERIFICATION.md – end-to-end test checklist
PROJECT_SUMMARY.md – delivery/feature summary
IMPLEMENTATION_COMPLETE.md – integration details
DEPLOY_BACKEND.md / VERCEL_DEPLOY.md – deployment playbooks

🎨 Theme

The app features a professional dark theme following the 60-30-10 design rule:

60% Black: Backgrounds (#000000, #111111)
30% White/Gray: Text (#ffffff, #e5e7eb)
10% Gold: Accents (#fbbf24) - prices, badges, CTAs

👤 User Roles

Role	Access
Bidder	Browse auctions, place bids, view profile
Auctioneer	Create auctions, manage listings, track bids
Admin	Full platform access, user management, approvals

Demo Login

Regular user: user@example.com
Admin: admin@admin.com
Seller: seller@seller.com

📜 Scripts

Command	Description
`npm run dev`	Start development server
`npm run build`	Build for production
`npm run preview`	Preview production build
`npm run lint`	Run ESLint

🌐 Deployment

The project includes Vercel configuration for easy deployment:

# Deploy to Vercel
vercel --prod

📄 License

MIT License

🤝 Contributing

Fork the repository
Create your feature branch (git checkout -b feature/amazing-feature)
Commit your changes (git commit -m 'Add amazing feature')
Push to the branch (git push origin feature/amazing-feature)
Open a Pull Request

Built with ❤️ by Prashant- Bid history tracking

User profile management
Auction countdown timers

For Auctioneers/Sellers

Create and manage auctions
Auctioneer dashboard with analytics
Three-minute rule auto-extension
Extend, cancel, or finalize auctions
Track bids across all listings

For Admins

User management and approval
Seller verification system
Commission rate configuration
Platform-wide auction oversight

UI/UX

Professional dark theme with 60-30-10 color rule (Black/White/Gold)
Fully responsive design (mobile-first)
Smooth animations and transitions
WCAG AAA accessibility compliance

🚀 Quick Start

⚡ New User? Start Here!

For complete setup instructions, see:

📖 START_HERE.md - Simple explanation of what to do
✅ SETUP_CHECKLIST.md - Step-by-step checklist
🚀 QUICKSTART.md - Quick commands
📚 BACKEND_SETUP_GUIDE.md - Detailed backend guide

Prerequisites

Node.js 18+
MongoDB (Atlas or Local)
npm or yarn

Basic Setup

1. Setup MongoDB (choose one):

Cloud: Create free MongoDB Atlas account at https://mongodb.com/cloud/atlas
Local: Install MongoDB Community Server

2. Backend Setup:

cd backend
npm install
# Create .env file with MongoDB connection string
npm run dev

3. Frontend Setup:

cd project1
npm install
npm run dev

4. Seed Database (optional):

cd backend
node seed.js

5. Open: http://localhost:5174

Old Installation Method (Frontend Only)

# Clone the repository
git clone https://github.com/Prashant730/BidMaster.git

# Navigate to project directory
cd BidMaster/project1

# Install dependencies
npm install

# Start development server
npm run dev

The app will be available at http://localhost:5173

Build for Production

npm run build
npm run preview

🛠️ Tech Stack

Frontend: React 19, React Router DOM
Build Tool: Vite 7
Styling: TailwindCSS 3.4, Custom CSS
Real-time: Socket.io Client
HTTP Client: Axios
Linting: ESLint 9

📁 Project Structure

project1/
├── src/
│   ├── components/          # React components
│   │   ├── Header.jsx       # Navigation header
│   │   ├── Hero.jsx         # Landing hero section
│   │   ├── AuctionGrid.jsx  # Auction listings grid
│   │   ├── AuctionDetail.jsx # Single auction view
│   │   ├── CreateAuction.jsx # Auction creation form
│   │   ├── LoginModal.jsx   # Authentication modal
│   │   ├── UserProfile.jsx  # User profile page
│   │   ├── Admin.jsx        # Admin dashboard
│   │   ├── AuctioneerDashboard.jsx # Seller dashboard
│   │   └── ...
│   ├── context/             # React Context providers
│   ├── services/            # API services
│   ├── index.css            # Global styles
│   └── dark-theme-professional.css # Dark theme
├── public/                  # Static assets
└── package.json

🎨 Theme

The app features a professional dark theme following the 60-30-10 design rule:

60% Black: Backgrounds (#000000, #111111)
30% White/Gray: Text (#ffffff, #e5e7eb)
10% Gold: Accents (#fbbf24) - prices, badges, CTAs

👤 User Roles

Role	Access
Bidder	Browse auctions, place bids, view profile
Auctioneer	Create auctions, manage listings, track bids
Admin	Full platform access, user management, approvals

Demo Login

Regular user: user@example.com
Admin: admin@admin.com
Seller: seller@seller.com

📜 Scripts

Command	Description
`npm run dev`	Start development server
`npm run build`	Build for production
`npm run preview`	Preview production build
`npm run lint`	Run ESLint

🌐 Deployment

The project includes Vercel configuration for easy deployment:

# Deploy to Vercel
vercel --prod

📄 License

MIT License

🤝 Contributing

Fork the repository
Create your feature branch (git checkout -b feature/amazing-feature)
Commit your changes (git commit -m 'Add amazing feature')
Push to the branch (git push origin feature/amazing-feature)
Open a Pull Request

Built with ❤️ by Prashant

Name		Name	Last commit message	Last commit date
Latest commit History 57 Commits
.vscode		.vscode
backend		backend
project1		project1
README.md		README.md
START_BIDMASTER.bat		START_BIDMASTER.bat
package-lock.json		package-lock.json
render.yaml		render.yaml

Folders and files

Latest commit

History

Repository files navigation

🎯 BidMaster - Online Auction Platform

✨ Features

For Bidders

For Auctioneers/Sellers

For Admins

UI/UX

🚀 Quick Start

🖱️ One-Click Start (Fastest)

⚡ New User? Start Here!

Prerequisites

Basic Setup

Test Accounts (after seeding)

Useful Commands

Old Installation Method (Frontend Only)

Build for Production

🛠️ Tech Stack

📁 Project Structure

🧭 Documentation Map

🎨 Theme

👤 User Roles

Demo Login

📜 Scripts

🌐 Deployment

📄 License

🤝 Contributing

For Auctioneers/Sellers

For Admins

UI/UX

🚀 Quick Start

⚡ New User? Start Here!

Prerequisites

Basic Setup

Old Installation Method (Frontend Only)

Build for Production

🛠️ Tech Stack

📁 Project Structure

🎨 Theme

👤 User Roles

Demo Login

📜 Scripts

🌐 Deployment

📄 License

🤝 Contributing

About

Resources

Uh oh!

Stars

Watchers

Forks

Releases

Packages 0

Uh oh!

Contributors

Uh oh!

Languages

Packages