A feature-rich Airbnb clone built with Next.js, React, and MongoDB, delivering a seamless user experience for property rentals and bookings. Explore, book, and manage listings with ease!
This project is a full-stack web application mimicking core Airbnb functionalities, including property listings, user authentication, booking management, and responsive design. It showcases modern web development practices with a focus on scalability and performance.
- User Authentication: Secure sign-up/login via NextAuth with MongoDB integration.
- Property Listings: Browse, filter, and search rental listings with dynamic data rendering.
- Booking System: Seamless booking experience with date selection using
react-datepicker. - Responsive Design: Mobile-friendly UI crafted with Tailwind CSS and Swiper for carousels.
- Social Sharing: Integrated sharing options with
next-sharefor enhanced user engagement. - Notifications: User feedback with
react-toastifyfor smooth interactions. - PDF Generation: Generate booking confirmations using
pdf-lib(optional feature). - Image Optimization: High-quality visuals with
sharpfor fast loading.
- Frontend: Next.js 14, React 18, Tailwind CSS
- Backend: MongoDB, Mongoose, NextAuth
- Libraries:
react-datepicker: For booking date selectionswiper: For image carouselsreact-toastify: For notificationspdf-lib: For PDF generationnext-share: For social sharingsharp: For image optimizationdate-fns: For date manipulationresend: For email integration
- Tools: ESLint, PostCSS
- Node.js (v18 or higher)
- MongoDB (local or cloud instance)
- npm or yarn
- Clone the repository:
git clone https://github.com/your-username/airbnb-clone.git cd airbnb-clone - Install dependencies:
npm install npm run dev
- Build for Production:
npm run build npm start
.env.local:
MONGODB_CONNECTION_STRING=
IMGBB_API_KEY=
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
AUTH_SECRET=
NEXT_PUBLIC_API_BASE_URL=
NEXT_PUBLIC_RESEND_API_KEY=