All projects

Confidential (student housing marketplace) · Property technology

The Bidnest marketplace wrapped with Capacitor so students and parents can bid from their phones.

Client project, name changed on request

Category

Mobile

Year

2024

Capabilities

Full-Stack, Cloud & Automation

Industry

Property technology

Bidnest Mobile App on a phone
Bidnest Mobile App on a phone

The problem

Students live on their phones. A bid placed from a laptop can be outbid while they are in a lecture, and a browser tab does not wake anyone up. Building two native apps from scratch would have doubled the work for a marketplace that already existed.

Our approach

Rather than rebuild the product natively, we wrapped the existing Next.js application with Capacitor, tuned the bidding and messaging screens for touch and safe areas, and shipped the result to both stores from the same repository as the website.

Inside the product

More than one screen.

The product name and data have been changed at the client's request; these screens recreate Bidnest Mobile App as it was built.

Bidnest Mobile App: Student dashboard on a phone

Student dashboard

Bids, lease steps and services inside the native shell.

Bidnest Mobile App: Messaging on a phone

Messaging

Threads with landlords and providers, opened by deep link from notifications.

Bidnest Mobile App: Browse on a phone

Browse

The map and search from the web platform, tuned for touch.

How it is built

Architecture

Capacitor hosts the production web build inside a native WebView on iOS and Android. Native plugins cover what the browser cannot; everything else, from real-time bids to Stripe checkout, is the same code that serves the web platform, so a fix ships to three platforms at once.

Key features

Native iOS and Android builds from the web codebase
Same bidding, messaging and payment flows as the web platform
Touch-first layouts with safe-area handling
Session kept on device between launches
Deep links from notifications into the exact listing
Offline screen instead of a browser error

Challenges & solutions

Where it got hard.

Challenge

WebSocket connections drop when the app moves to the background, so bids could arrive late after resume.

Solution

Reconnect on resume with a full state re-sync, so the listing shows the committed bid history the moment the app returns.

Challenge

Store review rejects apps that behave like a website in a frame.

Solution

Native navigation gestures, safe-area layouts and an offline screen, with the web chrome removed inside the shell.

Results

What shipping it changed.

1codebase shipping the website, the iOS app and the Android app.
2app stores served from the same release branch as the web platform.
0features rebuilt: every marketplace flow works inside the native shell.

Stack

  • Native shell

    • Capacitor
    • iOS
    • Android
  • Frontend

    • Next.js
    • TypeScript
  • Styling

    • TailwindCSS
    • ShadCN
  • Backend

    • Supabase
    • PostgreSQL
  • Real-time

    • WebSockets
  • Payments

    • Stripe
  • Notifications

    • Resend
    • Twilio
  • Analytics

    • PostHog

Let's talk

We can usually tell within one call whether the approach above transfers to your problem, and what would need to change.