跳到主要内容

Todo List

概览

概览

当你需要将用户的个人数据都存储到用户各自的 DID Space 时,那么这个教程一定能够帮助你。

这是一个基于 Typescript + React + Express + DID Spaces 构建的 Todo List 应用。在用户首次登录的时候需要连接一次 DID Space,之后产生的所有的 Todo List 数据都会持久化到用户各自的 DID Space 中。

先决条件

  • 安装 Todo List 应用:

Todo List

演示

首次登录连接 DID Space

在首次登录的时候需要连接 DID Space,这样应用才有权限读写 DID Space:

image.png

创建 Todo List

接下来,你可以在你的 Todo List 里面添加一些 Todo,并标记某些 Todo 的状态为已完成:

image.png

持久化存储

在你编辑你的 Todo List 的过程中,数据会自动存储到你的 DID Space 上。即使页面刷新,数据也不会消失,你还可以在你的 DID Space 上查看你存储的原始数据:

image.png

实现细节

如果你想了解实现的具体细节,那么你可以直接查看我们的代码仓库:

GitHub - blocklet/todo-list-example