🚀 RentEase – Local Item Rental Platform

RentEase - Rental Marketplace Platform

🚀 Overview

RentEase is a high-fidelity rental marketplace where users can browse, search, and rent high-end electronics and equipment. The platform features a premium Flipkart-inspired UI with full dark mode support and responsive design.

🛠 Tech Stack

Frontend

• Framework: React.js + Vite
• Styling: Tailwind CSS
• Animations: Framer Motion
• State Management: Context API (Auth, Theme, Wishlist)
• Forms: React Hook Form + Zod Validation
• Icons: Lucide React

Backend (Status: Setup Complete, Integration Pending)

• Runtime: Node.js + Express.js
• Database: MongoDB + Mongoose
• Auth: JWT + bcryptjs

📦 Features Implemented

• Browse & Filter: Advanced search and filtering system for gear.
• Product Details: Rich product pages with image galleries and trust signals.
• User Dashboard: Account overview, listings management, and booking history.
• Authentication: Mock Login/Signup flow with secure validation.
• Theme Engine: Seamless toggle between Light and Dark modes.

🚥 Getting Started

Prerequisites

• Node.js (v16 or higher)
• npm or yarn

Frontend Setup

1. cd client
2. npm install
3. npm run dev

Backend Setup

1. cd server
2. npm install
3. Create .env based on .env.example
4. npm run dev

• List items they want to rent out
• Search for items available nearby
• Filter and sort rental listings
• Connect with item owners easily

The platform creates a community-driven rental marketplace.

---

✨ Key Features

🔐 Authentication System

• Secure user Signup and Login
• Password validation
• Authentication state stored using LocalStorage
• Protected routes for authenticated users

📦 Item Listings (CRUD Operations)

Users can:

• Create a rental listing
• View available items
• Update item details
• Delete their listings

Example listing:

Item: DSLR Camera
Price: ₹500/day
Location: Ahmedabad
Category: Electronics

---

🔎 Search, Filtering & Sorting

Users can easily find items using:

• Search by item name
• Filter by category
• Filter by location
• Sort by price or newest listings

---

⚡ Debounced Search

Search functionality uses debouncing to prevent unnecessary API calls while typing, improving performance and user experience.

---

📄 Pagination

Pagination is implemented to efficiently handle large datasets.

Example:

Page 1 | Page 2 | Page 3

MongoDB uses:

• limit()
• skip()

for backend pagination.

---

🎨 Theme Support

• Light Mode / Dark Mode toggle
• Theme preference persistence

---

📱 Fully Responsive UI

The application is responsive and optimized for:

• Desktop
• Tablet
• Mobile devices

Built using Tailwind CSS.

---

⚠ Error Handling

• Backend error responses using try–catch
• Frontend loading states and error messages

---

🛠 Technology Stack

Frontend

• React.js

• Tailwind CSS

• React Router

• React Hooks

  • useState
  • useEffect
  • useRef
  • useContext

Backend

• Node.js
• Express.js

Database

• MongoDB
• Mongoose

---

📂 Project Structure

RentEase/
│
├── frontend/
│   ├── src/
│   │   ├── components/
│   │   ├── pages/
│   │   ├── context/
│   │   ├── hooks/
│   │   └── App.jsx
│
├── backend/
│   ├── models/
│   ├── routes/
│   ├── controllers/
│   ├── middleware/
│   └── server.js
│
└── README.md

---

🌐 Application Pages

• Home Page
• Signup Page
• Login Page
• Dashboard
• Item Listings
• Post Item Page
• Profile / Settings

---

⚙ Installation & Setup

1️⃣ Clone the Repository

git clone https://github.com/your-username/rentease.git

---

2️⃣ Navigate to Project Directory

cd rentease

---

3️⃣ Backend Setup

cd backend
npm install

Start the backend server:

npm run dev

---

4️⃣ Frontend Setup

cd ../frontend
npm install

Run the frontend application:

npm run dev

---

🔑 Environment Variables

Create a .env file in the backend directory and add:

PORT=5000
MONGODB_URI=your_mongodb_connection_string

---

🔌 API Endpoints

Example API routes:

POST   /api/auth/signup
POST   /api/auth/login

GET    /api/items
POST   /api/items
PUT    /api/items/:id
DELETE /api/items/:id

---

🚧 Future Improvements

• Online booking system
• Payment integration
• Rating and review system
• Chat between renter and owner
• Map-based location search
• Image upload for items

---

🌐 Live Demo

(Add deployed project link here)

Example:

https://rentease-demo.vercel.app

---

👨‍💻 Author

Project Name: RentEase Purpose: Full Stack Hackathon Project Developer: Your Name

---

📜 License

This project is created for educational and demonstration purposes.