手上有几套出租房，每月最头疼的不是收不到租，而是记不住谁该交、几号交、交了没有。市面上的收租 App 要么太重、要么要租客也装一个，我不需要那么多。我只需要一个自己人用的小工具：能记房源、能存合同、到日子提醒我收租。于是我用 WorkBuddy 从零搭了一个，叫"收租宝"。这篇文章记录了从想法冒出来到部署上线的全过程。

故事的起点很朴素。我手上有几套房子在出租，租客来来去去，合同起止日期各不相同。每到月初，我得翻微信聊天记录确认这个月谁该交租、谁还没交、合同是不是快到期了。这件事不复杂，但足够烦人——尤其是你偶尔漏掉一家的时候。

我去市面上找了一圈，发现现有的收租管理软件要么是面向大型中介公司的 SaaS，功能臃肿、收费不菲；要么需要租客也下载 App 配合使用，这对我的租客来说不现实。我想要的其实很简单：

一个房东内部用的小工具。能录房源信息、传房屋照片、记合同信息、上传合同文件，首页有个看板提醒我本月谁该交租。2-3 个人用，手机操作为主，最好零成本。

需求不复杂，但我不会写代码。直到我遇见了 WorkBuddy。

用 WorkBuddy 开发，第一步不是写代码，而是"说需求"。这听起来简单，实际上是最关键的一步。你跟 AI 说的越清楚，它给你的东西就越接近你要的。

我的做法是：先在脑子里把需求过一遍，然后像跟一个新来的产品经理交代工作一样，把背景、目标、约束条件一次性讲清楚。下面是我给 WorkBuddy 的原始需求描述：

请帮我开发一个房东专属的"房屋出租管理系统"，名字叫做"收租宝"。核心定位：这是一个仅供房东（2-3人）内部使用的纯管理工具，不需要租客端。界面要求极简、清晰，操作方便。

核心功能：房源管理（录入房屋基础信息、上传多张实拍照片）、合同管理（记录租客信息、租期、上传合同文件）、收租提醒看板（首页自动高亮提醒本月需收租的房源）。

技术限制：希望后期运营完全零成本。

这段话里有几个关键要素，后来证明每一个都重要：

跟 AI 讲需求，本质上是跟自己讲需求。你得先想清楚你要什么，AI 才能帮你做出来。

WorkBuddy 收到这段需求后，没有急着写代码，而是先给出了一套技术方案：前端用 Vue 3 通过 CDN 引入（不需要打包工具），数据存储用 IndexedDB（浏览器本地数据库），部署用静态文件托管。整个方案围绕一个核心原则——零成本、零依赖、开箱即用。

我当时觉得这个方案合理，就让它开始干了。后来回头看，这个技术选型有几个好处是我当时没预料到的：一是纯前端架构意味着部署极其简单，丢到任何静态托管平台就能跑；二是数据先存在本地、后续再接云端，给了我去慢慢研究云服务的时间窗口。

开发过程比我预想的顺利得多。WorkBuddy 一次性生成了完整的项目结构，包括 HTML 页面、CSS 样式、JavaScript 逻辑和数据库层。我做的事情主要是：看效果、提反馈、让它改。

收租宝/
├── index.html          应用入口
├── manifest.json       PWA 配置
├── sw.js                离线缓存
├── css/style.css       样式（桌面+移动端）
├── js/
│   ├── app.js          Vue 应用逻辑
│   ├── db.js           数据库层（本地+云端）
│   └── lib/
│       ├── vue.global.prod.js    Vue 3
│       ├── dexie.min.js         IndexedDB 封装
│       └── cloudbase.full.js    腾讯云 SDK
└── assets/logo.png     应用图标

收租宝有三个核心模块，每一个都是 WorkBuddy 直接生成的：

——支持录入房屋名称、详细地址、月租金和当前状态（空置/出租中/待租）。最实用的是照片上传功能，可以给每套房源关联多张实拍照片，看房的时候不用再翻手机相册。

——记录租客姓名、联系电话、租期起止时间，并且可以上传线下签署的合同照片或 PDF。合同到期前会在首页看板自动提醒。

——这是我最想要的 功能。首页是一个月历视图，自动根据合同信息高亮本月需要收租的房源。一眼看过去就知道这个月还有几家没收、哪几家快到期了。

数据存储层的设计值得一提。WorkBuddy 给 

// 三种模式自动切换，优先级：CloudBase > Supabase > 本地
const USE_CLOUDBASE = CLOUDBASE_ENV !== 'YOUR_CLOUDBASE_ENV_ID'
  && CLOUDBASE_ENV.length > 0 && window.cloudbase;
const USE_SUPABASE = !USE_CLOUDBASE && SUPABASE_URL !== 'YOUR_SUPABASE_URL'
  && SUPABASE_URL.length > 0 && window.supabase;
const STORAGE_MODE = USE_CLOUDBASE ? 'cloudbase'
  : (USE_SUPABASE ? 'cloud' : 'local');

这段代码的意思是：如果配置了腾讯云环境 ID，就自动用云端同步；如果配置了 Supabase，就用 Supabase；如果都没配，就退回本地存储，离线也能用。这个设计让我可以先在本地把功能跑通，再慢慢接云端。

第一版做完后，我用手机打开看了一下，界面很奇怪——侧边栏挤成一团，按钮太小点不准。这在意料之中，因为最初生成的是桌面优先的布局。

我告诉 WorkBuddy："房东日常是手机操作，请改成移动端优先。"它随即做了一次完整的移动端改造：

改造后的界面把桌面端的左侧边栏换成了手机端的底部 Tab 导航，四个大按钮：首页看板、房源管理、合同管理、数据备份。按钮高度做到 56px，手指随便按都能命中。整体视觉风格也做了调整，圆角更大、间距更宽，符合手机端的交互习惯。

PWA 的好处是：用手机浏览器打开后，可以"添加到主屏幕"，之后就像一个原生 App 一样有图标、有启动页、全屏运行。不需要上架应用商店，不需要审核，房东之间分享一个链接就行。

功能做好、移动端适配完成，下一步就是部署到公网让其他房东也能用。这一步花了不少功夫研究，因为要同时满足"国内访问快"和"零成本"两个条件。

最初用的是纯本地存储，但很快发现问题：数据只存在当前手机上，换一个手机数据就没了。2-3 个房东之间也看不到彼此录入的数据。需要云端同步。

最终选了腾讯云 CloudBase。原因很简单：国内访问速度有保障，免费额度对 2-3 人使用绰绰有余，而且 CloudBase 是腾讯自家的服务——如果后续用 Workbuddy 部署，同一公司生态，兼容性最好。

最后一步是写一个部署脚本，让任何人（或者 Workbuddy）执行一行命令就能完成部署。核心就三条命令：

# 1. 安装腾讯云 CLI
npm i -g @cloudbase/cli

# 2. 登录（浏览器扫码）
tcb login

# 3. 部署到静态托管
tcb hosting deploy -e 你的环境ID

 脚本，加上配置文件和部署文档，打包成一个 zip。把这个包丢给 Workbuddy，告诉它环境 ID，它就能一键完成部署。部署完会得到一个 

 的公网地址，手机浏览器打开就能用。

部署成功后，必须在腾讯云控制台把访问域名加入安全域名白名单，否则前端连不上云数据库。这一步容易漏，漏了就会出现页面能打开但数据存不进去的情况。

整个项目从想法到上线，前后大概一天时间。这个速度在以前是不可想象的——就算我会写代码，从设计到开发到部署也得折腾好几天。而我的角色更接近一个产品经理：想清楚要什么、看了效果给反馈、决定技术方向。

需求描述能力比技术能力更重要。

你不需要懂 Vue 怎么写、IndexedDB 怎么调，但你得能清楚地描述：这个工具给谁用、解决什么问题、有什么约束。描述越具体，产出越精准。

不要期望一次对话就拿到完美产品。第一版肯定有问题——移动端不好看、按钮太小、逻辑有 bug。看到问题就提，WorkBuddy 会一轮一轮地改。我大概提了十几轮反馈，每一轮都让产品变好一点。

前端静态托管免费，腾讯云 CloudBase 免费额度对小型工具绰绰有余。这个项目长期运营的成本是零，唯一的"成本"是我花时间跟 WorkBuddy 对话。

一个 zip 包 + 一行命令 = 公网上线。而且因为有 Workbuddy 这种同公司的部署工具，连命令都可以让它帮你跑。

以前写一个工具的门槛是"会不会编程"，现在的门槛是"想不想得清楚自己要什么"。

收租宝现在每天在用。月初打开看板，谁该交租一目了然，收完打个勾。合同到期前自动提醒，再也不会漏。几套房子的管理一下子变得清晰了。

如果你也有类似的小需求——不复杂、市面上的工具太重、自己又不会编程——不妨试试这个路径：把需求想清楚，说给 WorkBuddy 听，一轮一轮迭代，然后打包部署。整个过程的门槛，已经比你想象的低太多了。

从零到上线：我用 WorkBuddy 搭了一个收租管理系统

编程语言

开发工具

后端

用WorkBuddy零代码搭建"收租宝"：房东专属房屋出租管理系统，支持房源合同管理、照片上传、收租月历提醒、PWA移动端适配、腾讯云免费部署，零成本运营，彻底告别漏收租烦恼。

数据备份

云数据库

数据存储

云存储

数据库

WorkBuddy 

AI编程

SaaS

WorkBuddy企业版限时双倍 Credits 活动

workbuddy

腾讯云BI特惠9.9元起！


热销域名限时优惠，新客首年免费！


domain

CDN免费试用


文章

问答

视频

教程

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

EdgeOne AI 安全实战专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

从零到上线：我用 WorkBuddy 搭了一个收租管理系统

从零到上线：我用 WorkBuddy 搭了一个收租管理系统

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐