融合Anki与OpenAI的个人笔记管理实践——RecallNote

融合Anki与OpenAI的个人笔记管理实践——RecallNote

项目概览

RecallNote是一款基于SM-2算法的个人笔记应用，通过将笔记内容转化为记忆卡片，并结合科学的复习计划，帮助用户更有效地掌握和记忆知识。

开发初衷

源于本人在记录笔记时的痛点
痛点一：记了满满一长篇，复习时根本看不完。
痛点二：记录过的笔记一看过就忘，笔记数量多难以规划复习。
痛点三：为追求记录速度，笔记变成零散的关键词堆砌。

现有工具无法综合解决以上痛点：
传统笔记应用：只记录不复习，没有科学的记忆机制，笔记越积越多，最后变成“电子废纸”，动辄几千字的长篇笔记，复习时无从下手。
Anki ：编辑体验差，不支持Markdown，无法插入代码块/表格等技术内容
AI助手：对话记录散落各处，难以形成知识体系

项目定位

由于个人技术水平有限以及开发精力不足，这不是成熟产品，而是验证以下命题的实验：

“如何用卡片式+AI+间隔重复学习算法解决笔记管理以及遗忘问题？”

期待交流：正值暑假，技术交流开放，包括并不限于找茬代码缺陷/贡献优化思路/探讨设计取舍

项目：https://gitee.com/atuo-200/recall-note
联系邮箱: 2314393852@qq.com

✨ 功能特点

• 卡片式笔记管理：创建和组织笔记本—卡片，记录学习内容

• 间隔重复学习：基于SM-2算法的科学复习系统

• AI润色功能：一键优化笔记内容，提升表达质量

• Markdown支持：markdown文本格式化与预览功能

• 图片插入：支持直接粘贴图片到笔记中，并上传到第三方图床（图床服务相关代码在proxy-upload.js，请自行部署）
  

🔧 技术栈

选择了React+TypeScript前端（易维护、适合复杂交互），Flask+Supabase后端（Python方便算法开发，Supabase免费且免运维），搭配OpenAI API（快速实现AI优化）。

前端

• React 18
• TypeScript
• CSS Modules

后端

• Flask (Python)
• Supabase (数据库)
• OpenAI API (AI润色功能)

🚀 快速开始

安装步骤

1. 克隆仓库

git clone https://gitee.com/atuo-200/recall-note
cd recall_note

2. 安装前端依赖

npm install

3. 安装后端依赖

cd backstage_service
pip install -r requirements.txt

4. 环境配置

# 在backstage_service目录创建.env文件
cd backstage_service
touch .env

# 编辑.env文件，添加必要配置
UPLOAD_API_URL=your_upload_api_url
UPLOAD_API_TOKEN=your_upload api_token
SUPABASE_URL=your_supabase_url
SUPABASE_KEY=your_supabase_key
OPENAI_API_KEY=your_openai_api_key

5. 启动应用

# 启动后端服务（在backstage_service目录下）
python app.py

# 启动前端开发服务器（在项目根目录）
npm start

# 启动图床上传服务-端口转发，解决cors跨域问题（在项目根目录下）
node proxy-upload.js

6. 访问应用
   浏览器访问 http://localhost:3000

数据结构与存储

RecallNote使用Supabase作为数据存储解决方案。
supabase：一个基于PostgreSQL的开源Firebase替代品。

数据库表结构

notebooks表

字段名	类型	说明
id	uuid	主键
name	varchar	笔记本名称
card_count	integer	笔记本中的卡片数量
created_at	timestamp	创建时间

cards表

字段名	类型	说明
id	uuid	主键
notebook_id	uuid	外键，关联notebooks表
title	varchar	卡片标题
content	text	卡片内容（Markdown格式）
created_at	timestamp	创建时间
next_review	timestamp	下次复习时间
ease_factor	numeric	难度因子(SM-2算法参数)
repetition	integer	已复习次数
interval	integer	复习间隔(天)

实体关系图