1. Project Overview

An open-source property rental management system that challenges the traditional rental platform model dominated by intermediaries and introduces a new P2P rental model, enabling tenants and landlords to connect directly. Initially, it provides features such as property listings for landlords and rental requests from tenants. Once a rental relationship is established, it offers features such as rent payments and property repair requests for tenants, as well as tenant information management and property maintenance for landlords. When the rental relationship ends, tenants can rate and review landlords, providing useful references for future tenants.

A fully JavaScript-based application that includes a Node.js backend, a Vue-based admin management system, and separate tenant and landlord applications built with uni-app.

The client applications are built with uni-app and can be deployed to iOS, Android, Web (responsive), various mini-program platforms (WeChat/Alipay/Baidu/ByteDance News/Feishu/QQ/Kuaishou/DingTalk/Taobao), Quick Apps, and other platforms.

2. Open Source License

Licensed under MIT

3. Screenshots

Operation Logic Diagram

The red flag icon indicates a completed feature.

System Demonstration

4. Feature Overview

Entirely developed using JavaScript.

Includes a Node.js backend, a Vue-based admin management system, and separate tenant and landlord applications built with uni-app.

Cross-Platform Compatibility

The client applications are built with uni-app and can be deployed to iOS, Android, Web (responsive), various mini-program platforms (WeChat/Alipay/Baidu/ByteDance News/Feishu/QQ/Kuaishou/DingTalk/Taobao), Quick Apps, and other platforms.

Latest Technology Stack

The frontend uses the latest Vue ecosystem: Vue 3 + TypeScript + Pinia + Vite. The backend uses Alibaba's Node.js development framework, Egg.js.

Complete Frontend-Backend Separation

The backend interacts with the database and server, while the frontend interacts with the browser. Each has its own responsibilities.

5. Tech Stack

Technology Stack Overview

Backend Administration System

The admin management system is a web application that provides centralized management of the entire system, including landlords, properties, tenants, reviews, repairs, property communities, likes, and rental requests. It has the highest level of access permissions.

The technology stack uses the Vue ecosystem, developed with Vue 3 + TypeScript + Vite.

The UI framework uses the Vue version of arco.design, developed by ByteDance.

arco.design is more than just a UI framework. It provides a comprehensive enterprise-level design system that combines development and design. It also has its own distinctive design philosophy. Element UI has long been the first choice in the Vue ecosystem for UI frameworks. However, arco.design is not simply an alternative replacement. Its underlying design philosophy has been rethought and rebuilt, offering a more efficient design experience.

Tenant and Landlord Mini-Programs

Both the tenant and landlord mini-programs are developed using uni-app.

uni-app is a framework for developing all frontend applications using Vue.js. Developers write a single codebase that can be deployed to iOS, Android, Web (responsive), various mini-program platforms (WeChat/Alipay/Baidu/ByteDance News/Feishu/QQ/Kuaishou/DingTalk/Taobao), Quick Apps, and other platforms.

Compared with native mini-program syntax, uni-app is more suitable for Vue developers. Native syntax can be quite unintuitive and difficult to adapt to. Its cross-platform deployment capability is another major advantage.

The mini-program UI framework uses uview.

To put it plainly, uview is the preferred UI framework for uni-app. It has gained significant popularity in the official uni-app plugin marketplace, at times even surpassing official offerings in popularity. Developers have reached a consensus: there is no need to reinvent the wheel when open-source frameworks can solve the problem. However, UI frameworks vary greatly in quality. Some large companies have even produced KPI-driven projects that are widely criticized and receive virtually no maintenance afterward. Once developers adopt such frameworks, it can be difficult to migrate away. Replacing a UI framework midway through a project can be disastrous. Therefore, choosing a suitable UI framework at the beginning of a project is essential.

The backend is built with Egg, which inherits from Koa. Egg standardizes Node.js development by adopting the MVC development pattern and following the principle of 'Convention over Configuration', reducing the overhead of team collaboration. It also eliminates the inconsistent and fragmented code structures commonly found in Node.js projects.

The Egg community is relatively comprehensive, with many commonly used plugins included. Thanks to its inheritance from Koa, it also fully inherits Koa's ecosystem of community plugins. However, Egg offers greater efficiency than Koa when it comes to plugin usage.

Database

Use egg-sequelize to manage the MySQL database.

Sequelize is a promise-based Node.js ORM that currently supports Postgres, MySQL, MariaDB, SQLite, and Microsoft SQL Server. It provides powerful features such as transaction support, associations, eager and lazy loading, and read replication.

Object Storage (OSS)

Use MinIO to manage file storage.

MinIO is an object storage service released under the Apache License v2.0 open-source license. It is compatible with the Amazon S3 cloud storage API, making it ideal for storing large volumes of unstructured data, such as images, videos, log files, backup data, and container/virtual machine images. An object file can be virtually any size, ranging from a few KB to a maximum of 5T. MinIO is an extremely lightweight service that can be easily integrated with other applications.

Redis Cache

Redis is an open-source, network-enabled, in-memory and persistent log-structured Key-Value database written in ANSI C. It also provides APIs for multiple programming languages.

Egg can use egg-redis to integrate with Redis.

Storing mini-program platform access tokens and user-system-generated tokens in Redis is a good choice.

File Directory

Server-side

Root directory: /RH-server

bash

/RH-server
├── package.json
├── app
│   ├── controller
│   ├── model
│   ├── service
│   ├── middleware
│   ├── routerModules
│   ├── public
|   ├── router.js
├── config
|   ├── plugin.js
|   ├── config.default.js
└── test

To standardize the directory structure, all routes are organized by module and stored in the routerModules folder.

Backend Administration System

Root directory: /RH-admin

Tenant Mini-Program

Root directory: /RH-tenant

Subpackage loading is used. See pages.json for the specific directory structure.

Landlord Mini-Program

Root directory: /RH-landlord

Subpackage loading is used. See pages.json for the specific directory structure.

Source: Official right-house documentation