Rentivo

Overview

Rentivo is a modern property rental platform that combines traditional real estate functionality with cutting-edge AI capabilities. I built this as a comprehensive full-stack application to demonstrate my ability to integrate Large Language Models into real-world applications while maintaining production-ready code quality and architecture. The platform serves two user roles: renters who can browse, search, and rent properties, and owners who can list and manage their properties with detailed analytics. The application features 19 routes covering everything from property browsing and detailed listings to user profiles, rental history, and owner dashboards. What sets Rentivo apart is its AI integration—a conversational assistant that can search properties, provide details, access user's saved items, and offer personalized recommendations based on behavioral data. The entire stack is built with modern technologies: Next.js 16 App Router with React 19 on the frontend, Express 5 with TypeScript on the backend, MongoDB for data persistence, and Google's Gemini 2.5 Flash for AI capabilities. I implemented real payment processing through Stripe, complete authentication with Better Auth (email/password + Google OAuth), and a fully responsive UI using Tailwind CSS v4 with a custom warm neutral design system. The project includes comprehensive testing with Vitest, proper error handling, role-based access control, and production deployment on Vercel (frontend) and Render (backend).

Architecture & Engineering

The frontend is built with Next.js 16 using the App Router pattern, leveraging React 19 Server Components for optimal performance. I use TanStack Query for client-side state management and caching, React Hook Form with Zod validation for forms, and shadcn/ui components styled with Tailwind CSS v4. Authentication is handled client-side using Better Auth's React hooks. The backend is an Express 5 TypeScript API that connects to MongoDB using the native driver (no ORM) for flexibility. Better Auth runs server-side with JWT sessions managed by the jose library. AI features integrate Google's GenAI SDK—the chat assistant uses streaming with tool definitions for function calling, while recommendations use structured prompts with user context. Stripe handles payments with webhook verification for rental lifecycle updates. Images are hosted on imgbb via a dedicated upload utility. The entire application is deployed with the frontend on Vercel (automatic deployments from GitHub) and backend on Render with environment-based configuration.

Technical Challenges

• Implementing AI tool calling with proper error handling - I had to design a robust system where the LLM could call multiple backend functions (search, get details, access saved items) reliably. The challenge was validating tool parameters from AI-generated JSON and gracefully handling cases where the AI might request invalid data or make malformed function calls.
• Building a streaming chat interface with Server-Sent Events - Next.js App Router doesn't natively support SSE responses in Route Handlers, so I had to create a custom readable stream that pipes AI responses chunk-by-chunk to the frontend. Managing connection lifecycle, handling disconnects, and ensuring proper cleanup was complex.
• Designing an effective AI recommendation algorithm - Simply passing property data to an LLM wasn't enough. I had to engineer prompts that incorporate user interaction history, property metadata, and ranking criteria, then parse structured responses. Balancing between AI creativity and result consistency required multiple prompt iterations.
• Managing role-based access with Better Auth - Implementing custom role fields (renter/owner) in Better Auth required extending the default user schema and writing middleware that validates both authentication and authorization. I had to ensure protected routes properly redirect based on both login state and user role.
• Coordinating Stripe webhooks with database state - Stripe's webhook events arrive asynchronously and can be delivered multiple times. I implemented idempotent webhook handlers that verify signatures, deduplicate events, and safely update rental status in MongoDB while handling race conditions.

What I Learned

• Next.js 16 App Router best practices - I learned to leverage Server Components for data fetching, keep page files compositional rather than implementation-heavy, and extract interactive UI into dedicated Client Components. This pattern significantly reduced client-side JavaScript while maintaining excellent UX.
• LLM prompt engineering for structured outputs - Working with Gemini taught me that effective AI integration requires careful prompt design. I learned to provide clear schemas, examples, and constraints to get consistent, parseable responses. Function calling needs explicit parameter descriptions and validation.
• MongoDB indexing strategies - As I built search with multiple filter dimensions, I learned to create compound indexes on frequently queried fields (location, type, price, bedrooms). Using MongoDB's aggregation pipeline for complex queries like recommendations was more efficient than multiple separate queries.
• Implementing secure authentication patterns - Better Auth's architecture taught me modern auth patterns: httpOnly cookies for session management, CSRF protection for state-changing operations, and proper password hashing with bcrypt. I also learned OAuth flow implementation with Google's identity provider.
• Real-time data streaming in React - Building the chat interface taught me how to handle streaming responses in React: managing loading states during partial responses, updating UI incrementally, and providing smooth user feedback. I also learned to implement optimistic updates for better perceived performance.