起因
之前在看一些老电影的时候，看到电报员敲击发报机的场景，突然对摩尔斯电码产生了 兴趣。搜了一圈发现现有的在线工具要么界面老旧，要么功能单一，于是想着自己动手 做一个。
正好 Next.js 15 出了，Turbopack 也逐渐稳定，就当是练手了。
主要功能
- 双向翻译：文本 ↔ 摩尔斯电码实时转换
- 音频播放：标准的滴答声，可以下载 WAV 文件
- 实用工具：二进制转摩尔斯、图片解码、hex 转换等几个小工具
- 参考图表：完整的摩尔斯电码对照表
- 教学内容：写了几篇文章，比如快速学习方法、STEM 课堂项目创意、历史演变等
技术栈
- Next.js 15 (App Router + Turbopack)
- React 19 (Server Components)
- Tailwind CSS 4 (预览版)
- TypeScript 严格模式
- 纯前端实现，所有转换都在浏览器完成，不上传数据
踩过的坑
-
Turbopack 还是有点小问题 开发时热更新偶尔会卡住，需要手动重启。不过编译速度确实快了不少。
-
Tailwind CSS 4 的 API 变化 新版的
@import "tailwindcss"写法还不太习惯，文档也比较少，踩了点坑。 -
音频生成 一开始用 Web Audio API 生成摩尔斯电码音频，在不同浏览器表现不一致，最后调整了参数才统一。
-
图片 OCR 本来想用 Tesseract.js 做图片中的摩尔斯识别，但模型太大影响加载速度，最后改成了简单的模式识别。
为什么要做这个？
- 学习价值：摩尔斯电码其实是很好的编码学习案例，变长编码、信息论的早期实践
- 实用性：业余无线电爱好者、历史爱好者、STEM 教育都能用上
- 技术探索：想试试 Next.js 15 的新特性，顺便练练手
目前的问题
- SEO 刚起步，还没什么流量
- 博客内容还比较少，计划慢慢补充
- 移动端的音频下载体验还不够好
- 没有做离线 PWA （懒）
欢迎反馈
如果你对摩尔斯电码或者通信历史感兴趣，可以试试看。
真心想听听大家的建议：
- 功能上还缺什么？
- 有没有觉得多余的部分？
- 界面设计有没有反人类的地方？
- 技术实现上有没有更好的方案？
Select Language