Skip to content

Repository files navigation

Eventra - Event Equipment Rental Platform

A modern React-based web application for renting event equipment including furniture, sound systems, lighting, dΓ©cor, and appliances.

πŸš€ Features

  • User Authentication - Login/Signup with account types (Customer/Vendor)
  • Product Catalog - Browse 5 categories with multiple products each
  • Shopping Cart - Add items, manage quantities, persistent storage
  • Favorites - Save favorite items (requires login)
  • Razorpay Integration - Dummy payment gateway for checkout
  • Responsive Design - Mobile-first design with hamburger menu
  • Toast Notifications - User-friendly feedback for all actions
  • State Management - Zustand with localStorage persistence

πŸ› οΈ Tech Stack

  • Frontend Framework: React 19.1.1
  • Build Tool: Vite 7.1.7
  • Routing: React Router DOM 7.9.4
  • State Management: Zustand 5.0.8 with persist middleware
  • Form Handling: React Hook Form 7.65.0
  • UI Components: Lucide React 0.548.0 (icons)
  • Notifications: React Hot Toast 2.6.0
  • Payments: React Razorpay (dummy integration)

πŸ“ Project Structure

eventra-app/
β”œβ”€β”€ public/
β”‚   └── assets/          # Static assets (images, icons)
β”œβ”€β”€ src/
β”‚   β”œβ”€β”€ components/
β”‚   β”‚   β”œβ”€β”€ common/      # Navbar, Footer, RazorpayCheckout
β”‚   β”‚   β”œβ”€β”€ layout/      # MainLayout
β”‚   β”‚   └── products/    # ProductCard
β”‚   β”œβ”€β”€ pages/           # Home, Login, Signup, Cart, Categories, etc.
β”‚   β”œβ”€β”€ stores/          # authStore, cartStore
β”‚   β”œβ”€β”€ styles/          # index.css
β”‚   β”œβ”€β”€ App.jsx
β”‚   └── main.jsx
β”œβ”€β”€ index.html
└── package.json

🚦 Getting Started

Installation

npm install

Start Development Server

npm run dev

Open http://localhost:5173

πŸ“ Available Scripts

  • npm run dev - Start development server
  • npm run build - Create production build
  • npm run preview - Preview production build
  • npm run lint - Run ESLint

πŸ’³ Razorpay Integration (Dummy)

The app includes dummy Razorpay integration for testing checkout flows.

Test Mode:

  • Dummy key in code: rzp_test_1234567890
  • Amount: Auto-calculated from cart
  • Currency: INR

Razorpay Test Cards:

  • Card: 4111 1111 1111 1111
  • CVV: Any 3 digits
  • Expiry: Any future date

For Real Integration:

  1. Sign up at Razorpay
  2. Get your test API key
  3. Replace key in src/components/common/RazorpayCheckout.jsx

🎨 Pages

  • Home (/) - Hero, categories, testimonials, FAQ
  • Categories (/categories) - All categories
  • Category Detail (/category/:categoryId) - Products with filters
  • Login (/login) - Authentication
  • Signup (/signup) - Registration with password validation
  • Cart (/cart) - Shopping cart with Razorpay checkout
  • Dashboard (/dashboard) - User profile and stats
  • About (/about) - Company info
  • Contact (/contact) - Contact form

πŸ” Authentication

Password requirements:

  • At least 8 characters
  • One uppercase letter
  • One lowercase letter
  • One number
  • One special character (@, #, _, -)
  • No spaces

πŸš€ Deployment

Build

npm run build

Deploy to Vercel

npm install -g vercel
vercel

Deploy to Netlify

Drag dist folder to Netlify Drop

πŸ“„ License

MIT License


Made with ❀️ using React + Vite

Releases

Packages

Contributors

Languages