【GitHub开源】一款极简跨平台 Todo 应用：微信小程序 + Windows 桌面挂件 + 实时同步

项目功能

写这个项目出发点是本人没有一款可以跨平台查看的todolist，想实现Windows和IPhone即时同步。苹果自带的待办事项在win上只能通过iCloud操作感觉有点麻烦，于是想做一个能满足自己需求的小玩具。

这是一个支持 Web、移动端、微信小程序及 Windows 桌面端多端实时同步的极简跨平台待办事项（Todo List）应用。A minimalist, cross-platform Todo List application featuring real-time synchronization across Web, mobile, WeChat Mini Programs, and Windows desktop environments.

项目地址： plumqm/Todolist-demo

欢迎一键三连、Star 支持！

核心特性

1. 真正的"全端制霸"

Windows 桌面端：支持以"透明挂件"的形式常驻桌面，像壁纸一样自然，不占用任务栏，随时记录灵感。
微信小程序：依托微信生态，无需下载 App，下拉即可快速查看今日待办。
Web 与移动端：响应式极简 UI，无论是电脑浏览器还是手机 Safari，都能获得丝滑体验。

2. 毫秒级实时同步 (Real-time Sync)

告别手动刷新！应用底层接入了长连接实时同步机制。你在小程序里勾选完成一个任务，Windows 桌面挂件上的该任务会瞬间划掉，多设备协同如丝般顺滑。

3. 极简主义设计 (Minimalist UI)

没有复杂的番茄钟、没有繁琐的层级标签。专注于"记录"与"完成"本身，UI 风格克制，最大程度降低认知负担。

技术架构深度解析

要实现如此多端的兼容与实时响应，技术选型是重中之重。

跨端前端方案： 为了兼容微信小程序和 Web/H5，项目采用了目前主流的跨端编译框架（如 Uni-app / Taro）。一套代码，多端编译，极大地降低了维护成本。
桌面端封装： Windows 端借助了 Electron 。为了实现"桌面挂件"效果，对 BrowserWindow 进行了无边框 (frame: false) 和背景透明 (transparent: true) 处理。
实时数据流： 后端抛弃了传统的 HTTP 轮询，采用了 WebSocket 或云原生的实时数据库（如 Supabase Realtime / 微信云开发实时数据推送），确保数据变化能主动推送到各个客户端。

核心代码片段分享

很多朋友好奇 Windows 桌面挂件 是如何做到既能置顶又半透明的？这里分享一段 Electron 的核心配置代码：

JavaScript

复制代码

// Electron 主进程中创建透明挂件窗口
function createWidgetWindow() {
  const win = new BrowserWindow({
    width: 320,
    height: 500,
    transparent: true,      // 开启透明
    frame: false,           // 隐藏系统原生标题栏
    alwaysOnTop: true,      // 强制置顶
    skipTaskbar: true,      // 不在任务栏显示图标，保持纯粹的挂件感
    webPreferences: {
      nodeIntegration: true,
      contextIsolation: false
    }
  });

  win.loadURL('你的跨端项目本地/线上地址');
}

快速运行指南

想在本地跑起来体验一下？非常简单：

克隆项目到本地

Bash

复制代码

git clone https://github.com/plumqm/Todolist-demo.git

安装依赖并启动

Bash

复制代码

cd Todolist-demo
npm install
npm run dev

(注：具体打包为小程序或 Electron 客户端的指令，请参考仓库 README 文档)

未来规划 & 邀请共建

目前项目已经跑通了核心的 CRUD 与多端实时同步，但依然有很多可以拓展的空间：

引入离线缓存机制（Service Worker）。
增加对 Markdown 语法的轻量支持。
优化微信小程序的启动首屏加载速度。

这是一个由个人痛点驱动诞生的开源项目，个人的力量有限，非常欢迎前端、全栈领域的同学们提交 PR（Pull Request）或者提 Issue 交流思路！

👉 源码传送门： plumqm/Todolist-demo

如果你觉得这个项目思路对你有启发，别忘了点个赞或者去 GitHub 留个 Star！