HomeSwipe

Tinder-style rental search app with smart filtering, map visualization, and side-by-side comparison. Swipe through properties, shortlist favorites, and find your next home faster.

Comment

Inspiration

Apartment hunting is exhausting. Scrolling through hundreds of listings on multiple sites, opening tabs, copying addresses into Google Maps, trying to remember which apartment had the good kitchen but bad commute—it's overwhelming. We wanted to bring the simplicity of swipe-based decision-making to rental search, combined with intelligent map visualization so you can actually see where these places are and make informed decisions quickly.

What it does

HomeSwipe transforms rental property search into an intuitive, visual experience:

  • Swipe Interface: Tinder-style cards let you quickly browse properties—swipe right to shortlist, left to pass
  • Smart Filtering: Filter by price range, bedrooms, bathrooms, and property type before you start swiping
  • Live Map View: See all your shortlisted properties on an interactive map with clustering for dense areas
  • Side-by-Side Comparison: Compare up to 4 properties simultaneously to spot the best deal
  • Intelligent Scoring: Properties are ranked using a deterministic algorithm that considers price, size, amenities, and market value
  • Real Data: Integrates with the RentCast API to fetch actual rental listings

How we built it

Frontend:

  • React + TypeScript for type-safe component architecture
  • TailwindCSS for rapid, responsive UI development
  • Mapbox GL JS for interactive map rendering with custom markers and clustering
  • Framer Motion for smooth swipe animations and page transitions

Backend/API:

  • Vercel Serverless Functions to proxy RentCast API requests and hide API keys
  • LocalStorage caching to work within API rate limits (500 calls/month)
  • Custom data validation layer to catch malformed listings before they break the UI

Key Technical Decisions:

  • Built a deterministic scoring system (no ML needed) that normalizes price-per-bedroom and value scores
  • Implemented request deduplication to prevent wasting API calls
  • Created a manual mapping layer to transform RentCast's inconsistent data into our clean Listing type

Challenges we ran into

  1. API Rate Limits: RentCast's free tier only allows 500 requests/month. We built an aggressive caching system with 7-day TTL and request deduplication to make it work.

  2. Inconsistent Data: Real-world API data is messy—missing images, invalid coordinates, null values everywhere. We wrote comprehensive validation logic and fallback mechanisms.

  3. Map Performance: Rendering 50+ markers simultaneously caused lag. Implemented Supercluster for marker clustering and optimized re-renders.

  4. Swipe Gesture Detection: Getting swipe animations to feel natural required fine-tuning thresholds, velocity calculations, and spring physics in Framer Motion.

  5. State Management: Keeping swipe state, filters, shortlist, and map view synchronized across components required careful React Context design.

Accomplishments that we're proud of

✅ Fully functional with real data—not just mockups ✅ Deployed and live on Vercel ✅ Smart caching makes a 500-request limit feel unlimited ✅ Responsive design works on mobile and desktop ✅ No crashes—data validation catches edge cases before they reach the UI ✅ Fast and smooth—optimized rendering keeps the swipe experience fluid

What we learned

  • API integration is harder than it looks: Handling rate limits, caching, and data validation in production requires thoughtful architecture
  • User experience matters: Small details like swipe velocity, animation timing, and visual feedback make or break the feel of an app
  • TypeScript saves time: Catching type errors at compile-time prevented countless runtime bugs
  • Real data is messy: Never trust external APIs—always validate, sanitize, and have fallbacks
  • Serverless functions are powerful: Vercel's edge functions let us securely proxy API requests without managing servers

What's next for HomeSwipe

Commute Integration: Calculate drive/transit times to a saved work address Saved Searches: Let users save filter preferences and get notifications for new matches Price Alerts: Track listing price changes over time Neighborhood Data: Integrate walk scores, crime stats, school ratings User Accounts: Save shortlists across devices with backend storage More Data Sources: Aggregate from Zillow, Apartments.com, Craigslist for broader coverage

*Built with React, TypeScript, Mapbox, and way too much coffee *

Built With

Share this project:

Updates