创建一个发音评估应用程序（第一部分）
内容提要
这篇文章介绍了作者如何创建一个应用程序来控制用户的发音，并使用Quasar框架实现了一个简单的应用程序。应用程序允许用户输入一个单词或句子，并录制自己的声音，然后将音频发送到API并显示得分。文章还提到了一些相关的API，并展示了如何修改应用程序的布局和添加组件。下一部分将介绍如何获取音频。
延伸解读
为什么选择Quasar框架
文章选择Quasar框架，是因为它允许用同一套代码库将应用部署为Web应用（SPA、PWA、SSR）、移动应用（Android、iOS）或桌面应用（MacOS、Windows、Linux）。对于希望覆盖多平台的发音评估应用来说，这能显著减少开发和维护成本。作者也提到，理想情况是同时部署为Web应用和原生Android应用，Quasar正好满足这一需求。
发音评估API的现状与选择
作者调研发现，专门验证发音的应用或API大多需要付费或订阅，但通常提供两周的免费试用期。在对比后，作者选择了SpeechSuper API，因为它支持包括德语在内的多种语言，符合作者练习德语发音的需求。文章还提到后续会尝试Speechace API，以展示根据不同需求切换API的便利性。
应用界面与交互设计
应用的目标是让用户输入单词或句子，录制自己的发音，然后将音频发送到API并显示得分。界面包含一个文本输入框和一个录音按钮，录音时按钮样式会变化，点击停止后发送音频。得分会以卡片形式显示，颜色从红色到绿色渐变，直观反映发音质量。这种设计注重简洁和即时反馈。
技术前提与项目初始化
要跟随本教程，需要具备JavaScript知识，最好熟悉Vue.js 3。作者使用Quasar CLI初始化项目，并建议用Volta管理NodeJS版本。初始化时选择了Quasar v2、JavaScript、Vite、Sass、ESLint和Axios等选项。项目创建后，通过npm run dev在本地启动，默认浏览器会打开localhost:9000。这些步骤为后续开发奠定了基础。
Q&A
如何创建一个发音评估应用程序？
可以使用Quasar框架和JavaScript/Vue.js 3来创建一个应用程序，允许用户输入单词、录制声音并发送到API以获取发音得分。
SpeechSuper API的功能是什么？
SpeechSuper API支持多种语言，包括德语，能够验证用户的发音是否正确。
使用Quasar框架的好处是什么？
Quasar框架允许开发者使用单一代码库创建可部署于网页、移动应用和桌面应用的程序，简化了开发流程。
在创建应用程序之前需要准备哪些环境？
需要安装NodeJS，并使用Quasar CLI初始化项目以开始开发应用程序。
如何修改应用程序的布局以改善用户体验？
可以通过删除不必要的元素和调整组件位置来修改应用程序的布局，以实现更好的用户体验。
应用程序的主要功能是什么？
应用程序的主要功能是允许用户输入单词或句子，录制声音并通过API获取发音得分。
