clmirabent / Realista

Real Estate web app for rent and buy houses

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Realista

Realista is a web application exclusively for individuals and without traditional real estate portals ads. Realistic prices and market transparency are the main features of our site.

Users can publish and search for properties, contact directly with the owner through our chat, without intermediaries. Browse properties by location, view them on the map and dive into their details with photos and detailed descriptions.

User Interface

Home Page: This page allows the user to search, log in and register to the application.     

Screenshot 2024-02-27 at 8 45 56 PM

Login: The user can log in to start saving their favorite properties, chat with an owner and/or publish their ads. If the user does not have a Realista account, he can create an account by clicking here.

Screenshot 2024-02-27 at 8 46 43 PM

Registro: The user can create an account by filling in the required fields, if the user does not accept the privacy policies, he/she will not be able to create an account, which can be accessed directly from the link.

Screenshot 2024-02-27 at 8 50 13 PM

Publicar Anuncios: Once the user is logged in, he/she can publish ads with a specific description and include photos of the property, and can also consult his/her published ads on the "My Ads" page.

Screenshot 2024-02-27 at 9 42 39 PM

Anuncios Publicados: All published ads are displayed and the user can search through the filters.

Screenshot 2024-02-28 at 7 01 33 PM

Mis Anuncios: The user can see the ads he/she has posted.

Screenshot 2024-02-28 at 7 03 58 PM

Demo

You can take a small tour of the application and visit our demo video on our Youtube channel.

https://youtu.be/ZoCQC8MAHoA

🛠️ Built with

Frontend:

  • React
  • React hook forms
  • React router dom
  • JWT decode
  • Cloudinary React
  • Claudinary url-gen
  • Socket.io Client
  • React micro-animations library
  • React icons
  • Mui
  • @googlemaps/js-api-loader
  • @googlemaps/react-wrapper"
  • Bcrypt

Backend:

  • Node
  • Express
  • Socket.io
  • Mongoose
  • Mailgun
  • Bcrypt
  • JsonWebToken

⌗ Entities diagrams

Realista-DataModel

🚀 How to start the project?

Requisitos previos

To run Realista on your local machine, you must have the following installed:

  • Node.Js
  • MongoDB (if you want to use a local database)

Settings

Clone the project:

 git clone https://github.com/nds-fsd/idealista.git
  1. Go to the root of the project and install npm:

Desde carpeta idealista: cd frontend

npm install
  1. Set the following variables in the .env file

MONGO_URL GOOGLE_APIKEY JWT_SECRET JWT_EXPIRES_IN REACT_APP_BACKEND_URL MAILGUN_API_KEY MAILGUN_DOMAIN

  1. Start the project in the terminal:
npm run dev
  1. If you want to start the project separeted in frontend and backend:

Frontend:

npm run start:frontend

Backend:

npm run start:backend
  1. Go to your browser and naviagte http://localhost:3000 to see the app

Authors

About

Real Estate web app for rent and buy houses


Languages

Language:JavaScript 83.3%Language:CSS 15.6%Language:Handlebars 0.8%Language:HTML 0.3%Language:Dockerfile 0.1%