Skip to content

feat: 中国語の音声判定機能を追加 - #55

Open
KoshiroIto wants to merge 7 commits into
mainfrom
Chinese-pronunciation
Open

KoshiroIto wants to merge 7 commits into
mainfrom
Chinese-pronunciation

Conversation

@KoshiroIto

Copy link
Copy Markdown
Collaborator

中国語の音声判定機能を追加しました。
入力した中国語をピンインに変換してユーザーが発音して録音したものと比較しています。
デザイン等はほかの教材を参考にしました。
必要あれば変更したいです。
急ぎで作ったのでAI比率が高く意味不明な場所があるかもしれないのでreviewよろしくお願いします。

@tknkaa tknkaa changed the title Chinese pronunciation feat: 中国語の音声判定機能を追加 Sep 20, 2026
@tknkaa
tknkaa self-requested a review September 20, 2026 08:34

@tknkaa tknkaa left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

React について基本的なところは理解できてるけど、まだアンチパターンを踏んでるので少しずつ勉強していこう!

new (): SpeechRecognitionInstance;
}

interface IWindow {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

既存の慣習に合わせると I prefix はない方がいいと思う

<div className="mt-1 flex flex-wrap gap-1">
{alternatives.map((alt, i) => (
<span
key={i}

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

React はリストを再レンダリングするときに key を見て、要素を使い回すか決めているから、key にはユニークな値を使うのがよくて、今回は alt をそのまま使うのがよさそう

? selectedProblem.pinyin
: pinyin(currentTargetText, { style: pinyin.STYLE_TONE }).flat().join(" ");

useEffect(() => {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

基本的には useEffect を使ったらクリーンアップ関数を定義する必要があるって覚えよう!
今回で言うと、クリーンアップ関数がないと、録音中に別ページに移動したときマイクが起動したままになるので、以下のような感じで追加したい

return () => {
  recognition.stop();
  recognition.onresult = null;
  recognition.onerror = null;
  recognition.onend = null;
};

@tknkaa tknkaa left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

とりあえず approve したので、修正したら squash and merge してもらう感じで!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants