Todo App

Todo App

site icon
2025.04.05 0
TypeScript待办事项管理跨平台应用日程管理
Todo App 是一个全面的待办事项应用程序,包含一个 React Native 移动应用和一个 Node.js/Express 后端 API。该应用程序支持用户认证、任务列表创建和管理、任务创建(包括名称、描述、截止日期和优先级)、标记任务完成、删除任务和列表等功能。适用于需要跨平台(iOS 和 Android)管理日常任务的用户。
View on GitHub

Overview

基本能力

产品定位

Todo App 是一个用于管理日常任务的跨平台应用程序,旨在帮助用户高效地组织和跟踪任务。

核心功能

  • 用户认证(注册、登录)
  • 任务列表创建和管理
  • 任务创建(包括名称、描述、截止日期和优先级)
  • 标记任务完成
  • 删除任务和列表
  • 跨平台支持(iOS 和 Android)

适用场景

  • 个人日常任务管理
  • 团队任务分配和跟踪
  • 跨平台任务管理需求

技术栈

移动应用

  • React Native with Expo
  • TypeScript
  • Redux Toolkit 用于状态管理
  • Expo Router 用于导航
  • React Native Safe Area Context 用于安全区域处理

后端 API

  • Node.js with Express
  • TypeScript
  • MongoDB with Mongoose
  • JWT 认证
  • Express Validator 用于请求验证

使用教程

使用依赖

前置依赖

  • Node.js 18+
  • MongoDB
  • Expo CLI (npm install -g expo-cli)
  • iOS Simulator(用于 iOS 开发)
  • Android Studio with an emulator(用于 Android 开发)

安装教程

移动应用设置

# 进入移动应用目录
cd mobile-app

# 安装依赖
npm install

# 启动开发服务器
npm start

# 在 iOS 上运行
npm run ios

# 在 Android 上运行
npm run android

API 设置

# 进入 API 目录
cd api

# 安装依赖
npm install

# 创建 .env 文件并添加以下变量
# PORT=3000
# MONGODB_URI=mongodb://localhost:27017/todo-app
# JWT_SECRET=your-secret-key

# 启动开发服务器
npm run dev

# 构建项目
npm run build

# 启动生产服务器
npm start

调试方式

移动应用

mobile-app 目录下创建 .env 文件,内容如下:

EXPO_PUBLIC_API_URL=http://localhost:3000/api

API

api 目录下创建 .env 文件,内容如下:

PORT=3000
MONGODB_URI=mongodb://localhost:27017/todo-app
JWT_SECRET=your-secret-key

API 端点

认证

  • POST /api/auth/register - 注册新用户
  • POST /api/auth/login - 用户登录

列表

  • GET /api/lists - 获取当前用户的所有列表
  • POST /api/lists - 创建新列表
  • GET /api/lists/:listId - 获取特定列表
  • PUT /api/lists/:listId - 更新列表
  • DELETE /api/lists/:listId - 删除列表

任务

  • GET /api/lists/:listId/tasks - 获取列表的所有任务
  • POST /api/lists/:listId/tasks - 创建新任务
  • GET /api/lists/:listId/tasks/:taskId - 获取特定任务
  • PUT /api/lists/:listId/tasks/:taskId - 更新任务
  • DELETE /api/lists/:listId/tasks/:taskId - 删除任务

许可证

该项目遵循 MIT 开源许可条款。