It’s open season in the house hunt. We were inspired by the accessibility of mobile dating apps, and We’ll hook you up with open houses in your area! Open houses are a valuable opportunity for agents to showcase their properties and build relationships with potential buyers, and for potential buyers to get to know more about their future homes. Our website provides a platform to make this process simple and seamless. Say goodbye to the frustration of traditional home-buying and hello to a smoother, more efficient journey with our website.

What it does

Our website helps home buyers schedule open houses, quickly contact realtors and homeowners, and find their homes. At the same time, real estate agents are allowed easy access to advertise to and communicate with a wider audience than ever before!

Swipe right to "like" properties, RSVP for open houses, and contact real estate agents. Swipe left to "dislike" other property profiles, which include their location, photos, and a short bio.

The "liked properties" section allows you to RSVP for open houses and contact real estate agents. It gives home buyers a better idea of what estates they're looking for. Real estate agents are able to easily update information on the site in case of any changes. In case of a misclick, users can also review their disliked properties.

How we built it

We created OpenHouse using the React framework. We built unique components, such as the open house profile cards and swiping feature, and integrated them into the website pages. We used bootstrap four and CSS to stylized components and create a theme for our project. We utilized data structures like maps to store our information effectively. We also used MySQL to host profile information.

Challenges we ran into

Swiping Feature

Rendering the card list was a challenge as we had to keep track of which cards were swiped left and which were swiped right. We also had to append the cards that were swiped right into an array which involved using useEffect hooks. Also creating the animations for the swipe was challenging as we had to figure out how to stack the cards on top of each other.

Connecting AWS Amplify to APIs

We had an issue running the AWS server and connecting them to the API’s we wanted to use, like Twillio and Zillow. So we opted not to use an AWS server in the final build

Accomplishments that we're proud of

Implementing the swipe feature

We are proud of implementing a swipe animation using npm packages and CSS. While getting the cards to stack on top of each other and using useEffect hooks to refresh the UI was tough, we were able to successfully utilize and make use of it.

Creating a cohesive theme between all of our webpages

A stunning UI

What we learned

  • Two of our member’s first time using React and JavaScript.
  • We also were able to learn more about how to connect API’s to live servers.
  • We also learned great time management skills that we plan to use in future projects

What's next for OpenHouse

Implementing the Twilio API

  • Would send messages to buyers confirming rsvp and reminding them about open house information
  • Buyers would be able to communicate last minute changes
  • Sellers would be able to ask questions Saved information automatically input into RSVP form Create feature that automatically adds open house dates to your OpenHouse calendar as you RSVP
Share this project: