Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Voice Recognition in JavaScript

Avatar for SAW SAW
March 13, 2024
Programming
0
90

Voice Recognition in JavaScript

A presentation slide of Kyoto.js 21.

Avatar for SAW

SAW

March 13, 2024
Tweet

More Decks by SAW

See All by SAW
PHP で学ぶ OAuth 入門
Avatar for SAW azuki
2
560
EditorConfig を使ってみよう
Avatar for SAW azuki
1
80
Symfony でサクッと作る REST API サーバー
Avatar for SAW azuki
1
160
Vite の Library Mode を使って Vue のコンポーネントをライブラリ化する
Avatar for SAW azuki
1
200
Laravel や Symfony で手っ取り早く
OpenAPI のドキュメントを作成する
Avatar for SAW azuki
2
300
Provide/Inject で TypeScript の恩恵を受ける方法
Avatar for SAW azuki
3
150
GraphQL はいいぞ! ~Laravel で学ぶ GraphQL 入門~
Avatar for SAW azuki
1
370
OSS contributor への第一歩を踏み出すまでの物語
Avatar for SAW azuki
2
320
Eloquent で relation を扱う基礎
Avatar for SAW azuki
0
170

Other Decks in Programming

See All in Programming
GitHubとGitLabと AWS CodePipelineで CI/CDを組み比べてみた
Avatar for Satoshi Kaneyasu satoshi256kbyte
4
240
Android 16 × Jetpack Composeで縦書きテキストエディタを作ろう / Vertical Text Editor with Compose on Android 16
Avatar for cc4966 cc4966
2
250
HTMLの品質ってなんだっけ？ “HTMLクライテリア”の設計と実践
Avatar for una unachang113
4
2.9k
🔨 小さなビルドシステムを作る
Avatar for Mutsuha Asada momeemt
4
690
Deep Dive into Kotlin Flow
Avatar for Matsuda Jumpei jmatsu
1
360
The Past, Present, and Future of Enterprise Java with ASF in the Middle
Avatar for ivargrimstad ivargrimstad
0
150
チームのテスト力を鍛える
Avatar for Hiroki Iseri goyoki
3
610
複雑なドメインに挑む.pdf
Avatar for Yuki Sakai yukisakai1225
5
1.2k
私の後悔をAWS DMSで解決した話
Avatar for 平目 hiramax
4
210
AIコーディングAgentとの向き合い方
Avatar for kmuto eycjur
0
270
Ruby Parser progress report 2025
Avatar for yui-knk yui_knk
1
450
ファインディ株式会社におけるMCP活用とサービス開発
Avatar for starfish719 starfish719
0
1.9k

Featured

See All Featured
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
35
3.1k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
8
530
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
696
190k
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
28
4k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
160
23k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
Avatar for Eileen M. Uchitelle eileencodes
139
34k
Fashionably flexible responsive web design (full day workshop)
Avatar for Andy Clarke malarkey
407
66k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
55
6.5k
Large-scale JavaScript Application Architecture
Avatar for Addy Osmani addyosmani
513
110k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
525
40k
Practical Orchestrator
Avatar for Shlomi Noach shlominoach
190
11k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
Avatar for panda_program panda_program
113
20k

Transcript

  1. 7PJDF3FDPHOJUJPOJO+BWB4DSJQU ,ZPUPKT  4"8

  2. $(whoami) /BNF4PJDIJSP,BUP "HF  /JDLOBNF4"8 NBLFT*5FOHJOFFSDPNNVOJUZIFBUJO,BOTBJBSFB -JWFJO0TBLB(SFXVQJO"JDIJ 9 BLB5XJUUFS !B[VLJ@FBUFS

    .ZTUSPOHBSFB8FCBQQMJDBUJPOEFWFMPQNFOU 7VF -BSBWFM 2

  3. 7PJDF3FDPHOJUJPOJO+BWB4DSJQU 6TF4QFFDI3FDPHOJUJPO"1* CSPXTFSTBTLVTUPBMMPXUPVTFNJDSPQIPOFBU fi STUVTF 0OMZBWBJMBCMFPO)5514 FYDFQUJPOUIF"1*JTBWBJMBCMFPO)551POlocalhost 3

  4. 5IF#BTJD'MPXPG7PJDF3FDPHOJUJPO6TBHF  (FOFSBUFBOJOTUBODFPGSpeechRecognition  4UBSUWPJDFSFDPHOJUJPOCZstart()NFUIPE  (FUWPJDFJOQVUSFTVMUCZonresult()NFUIPE 4

  5. (FOFSBUJOHBSpeechRecognitionJOTUBODF (FUSpeechRecognitionQSPQFSUZGSPNwindowPCKFDU (FUUIFQSPQFSUZwebkitSpeechRecognitionPO4BGBSJBOE(PPHMF $ISPNF 5 // Get SpeechRecognition property. const

    speechRecognition = // Get SpeechRecognition or webkitSpeechRecogntion window.SpeechRecognition || window.webkitSpeechRecognition; const recognition = new speechRecognition();

  6. 4UBSU7PJDF3FDPHOJUJPO"OE(FUUIF3FTVMU 4UBSUWPJDFSFDPHOJUJPOCZstart()JOSpeechRecognition 5IFQFSNJTTJPOSFRVJSFEUPVTFNJDSPQIPOFBU fi STUFYFDVUJPO (FUSFTVMUCZonresult()JOSpeechRecognition 4FUBIBOEMFSUPonresult()BSHVNFOU (FUSFTVMUGSPNUIFTUBSHVNFOUJOUIFIBOEMFS 5IFSFTVMUJODMVEFEJOresults[0][0].transcriptJO SpeechRecognitionEvent

    6

  7. &YBNQMFPGstart()onresult()*NQMFNFOUBUJPO 7 // begin voice recognition recognition.start(); // get voice

    recognition result recognition.onresult((event) => { const { transcript } = event.results[0][0]; console.log(transcript); });

  8. 4QFDJGZUIF-BOHVBHFUP3FDPHOJ[F 4QFDJ fi FEUIFMBOHVBHFPOlangQSPQFSUZJOSpeechRecognition 5IFWBMVFPGlangQSPQFSUZJO)5.-PSCSPXTFSMBOHVBHFGPSEFGBVMU 8 recognition.lang = 'ja-JP';

  9. "DUVBM&YBNQMF 8FC"QQUPMFBSO&OHMJTIXPSET XPSLJOQSPHSFTT  -PPLBUJNBHFBOETBZUIFXPSEPGUIFJNBHF -FBSOWPDBCVMBSZXJUIJNBHF 6TF4QFFDI3FDPHOJUJPO"1*JOBQQMJDBUJPO BWBJMBCMFUPFYUFOEGPSPUIFSMBOHVBHFT 9

  10. -JNJUBUJPOPG4QFFDI3FDPHOJUJPO"1* 4PNFCSPXTFSTOPUTVQQPSU4QFFDI3FDPHOJUJPO"1* 'JSFGPY &EHF FUD 5ZQFEF fi OJUJPOOPUTVQQPSUFEJO5ZQF4DSJQU /FFEUPEF fi

    OFCZPVSTFMWFT PSDBTUwindow as any 1 0

  11. $PODMVTJPO *OUSPEVDFEWPJDFSFDPHOJUJPOJO+BWB4DSJQU 6TF4QFFDI3FDPHOJUJPO"1* 5IFCBTJD fl PXPG4QFFDI3FDPHOJUJPO"1*VTBHF 4UBSUSFDPHOJUJPOCZstart()NFUIPE (FUSFTVMUCZonresult() -JNJUBUJPOPG4QFFDI3FDPHOJUJPO"1* 4PNFCSPXTFSTOPUTVQQPSUFE

    5ZQFEF fi OJUJPOOPUTVQQPSUFEJO5ZQF4DSJQU 1 1

  12. 5IBOLZPVGPSMJTUFOJOH