词刻 WordMoment (放弃不难，但坚持一定很酷。)

January 4, 2026 · View on GitHub

通过输入与重复强化，把单词真正刻进记忆。

词刻 (WordMoment) 是一个专注于高效背单词的纯前端 Web 应用。它摒弃了传统的“看卡片”模式，强调通过键盘输入（Active Recall）和视觉强化（Smash & Shrink Animation）来加深记忆痕迹。

WordMoment Preview

✨ 核心特性 (Features)

  • ⌨️ 输入式记忆 (Input-based Learning): 每一个单词都需要你亲自拼写，拒绝无效的“眼会手生”。
  • 💥 视觉强化 (Smash & Shrink): 独创的“粉碎与收缩”动画。单词拼写完成后，需按下空格键触发“粉碎”特效，展示中文释义，通过强烈的视觉反馈强化记忆。
  • 📚 丰富的词库: 内置 CET4 (四级)、CET6 (六级) 等核心词汇，支持按单元划分学习进度。
  • 🎨 沉浸式体验: 极简设计，无广告，无干扰。支持多种动画风格和主题配色。
  • 📱 响应式设计: 完美适配桌面端和移动端，随时随地开启训练。
  • 🔒 纯前端隐私: 所有进度数据存储在本地，无需注册登录，保护你的隐私。

🛠️ 技术栈 (Tech Stack)

本项目基于现代前端技术栈构建：

  • Core: React (Hooks, Functional Components)
  • Language: TypeScript
  • Build Tool: Vite
  • Styling: Tailwind CSS
  • Animation: CSS Keyframes & Transitions
  • State Management: React useState, useEffect

🚀 快速开始 (Getting Started)

前置要求

请确保你的本地环境已安装 Node.js (推荐 v18+)。

1. 克隆项目

git clone https://github.com/your-username/word-moment.git
cd word-moment

2. 安装依赖

npm install
# 或者使用 yarn / pnpm
yarn install
pnpm install

3. 启动开发服务器

npm run dev

启动后，访问 http://localhost:5173 即可看到应用。

4. 构建生产版本

npm run build

构建产物将输出到 dist 目录，可直接部署到任何静态网站托管服务（如 Vercel, Netlify, GitHub Pages）。

📖 使用指南

  1. 选择单元: 在首页选择你要学习的词汇单元（如 CET4 Unit 1）。
  2. 开始输入: 屏幕上会显示当前单词的英文，请在键盘上敲击对应字母。
  3. 触发强化: 单词拼写正确后，按下空格键 (Space)。
  4. 记忆反馈: 单词会产生“粉碎”或“收缩”动画，并显示中文释义。
  5. 循环复习: 系统会自动安排单词的重复出现，直到你牢固掌握。

🤝 贡献 (Contributing)

欢迎提交 Issue 或 Pull Request 来改进这个项目！

  1. Fork 本仓库
  2. 创建你的特性分支 (git checkout -b feature/AmazingFeature)
  3. 提交你的修改 (git commit -m 'Add some AmazingFeature')
  4. 推送到分支 (git push origin feature/AmazingFeature)
  5. 开启一个 Pull Request

📄 许可证 (License)

本项目采用 MIT License 开源。

Enjoy coding & learning! 🚀