Real Estate Project

Demo

Visit the Real Estate Project to explore the live demo.

Description

The Real Estate Project is a web application designed for browsing and managing real estate listings. It provides users with the ability to search for properties, view details, and contact agents. The project utilizes the MERN stack (MongoDB, Express.js, React.js, Node.js) for the backend and frontend development, Tailwind CSS for styling, React Form Hook for form management, JWT token for authentication, Firebase OAuth for user authentication, Firestore for storing data, Vite for the build tool, and is hosted on Render.

Features

• User authentication and authorization using Firebase OAuth and JWT token
• Real-time property listings with search and filter functionality
• Property detail pages with images, descriptions, and contact information
• Contact forms for reaching out to agents
• Responsive design for mobile and desktop devices

Technologies Used

• Frontend:

  • React.js
  • React Form Hook
  • Tailwind CSS
  • redux

• Backend:

  • Node.js
  • Express.js
  • MongoDB

• Authentication:

  • Firebase OAuth
  • JWT token

• Database:

  • Firestore (Firebase) For Image

• Build Tool:

  • Vite

• Hosting:

  • Render

Installation

1. Clone the repository: git clone <repository-url>

2. Navigate to the project directory: cd real-estate-project

3. Install dependencies:

4. Set up Firebase:

• Create a project on Firebase (https://console.firebase.google.com/)
• Enable Firebase Authentication with OAuth providers
• Set up Firestore database
• Obtain Firebase config credentials

5. Set up environment variables:

• Create a .env file in the root directory
• Add the following variables in this file: .env.sample

6. Start the development server: npm run dev

Usage

• Sign in with your Google account using Firebase OAuth to access the application.
• Browse through property listings, search for properties, and view detailed information.
• Contact agents using the contact forms provided.

Credits

• React: https://reactjs.org/
• React Form Hook: https://react-hook-form.com/
• Tailwind CSS: https://tailwindcss.com/
• Node.js: https://nodejs.org/
• Express.js: https://expressjs.com/
• MongoDB: https://www.mongodb.com/
• Firebase: https://firebase.google.com/
• Vite: https://vitejs.dev/
• Render: https://render.com/