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
89

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

Other Decks in Programming

See All in Programming
C++20 射影変換
Avatar for Akira Takahashi faithandbrave
0
560
20250628_非エンジニアがバイブコーディングしてみた
Avatar for ponponmikan ponponmikankan
0
640
Cursor AI Agentと伴走する アプリケーションの高速リプレイス
Avatar for どすこい daisuketakeda
1
130
AWS CDKの推しポイント 〜CloudFormationと比較してみた〜
Avatar for アキキー akihisaikeda
3
320
地方に住むエンジニアの残酷な現実とキャリア論
Avatar for nakamichi ichimichi
5
1.5k
AIエージェントはこう育てる - GitHub Copilot Agentとチームの共進化サイクル
Avatar for Akira Kobori koboriakira
0
490
なぜ適用するか、移行して理解するClean Architecture 〜構造を超えて設計を継承する〜 / Why Apply, Migrate and Understand Clean Architecture - Inherit Design Beyond Structure
Avatar for shiro seike seike460
PRO
3
730
ISUCON研修おかわり会 講義スライド
Avatar for Yuki Yata arfes0e2b3c
0
300
ニーリーにおけるプロダクトエンジニア
Avatar for Nealle nealle
0
730
Discover Metal 4
Avatar for rei rei315
2
110
RailsGirls IZUMO スポンサーLT
Avatar for 16bit_idol 16bitidol
0
140
Google Agent Development Kit でLINE Botを作ってみた
Avatar for Kento.Yamada ymd65536
2
220

Featured

See All Featured
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
411
22k
Gamification - CAS2011
Avatar for David Bonilla davidbonilla
81
5.3k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.5k
10 Git Anti Patterns You Should be Aware of
Avatar for Lemi Orhan Ergin lemiorhan
PRO
657
60k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
34
5.9k
No one is an island. Learnings from fostering a developers community.
Avatar for Antonio thoeni
21
3.3k
Practical Orchestrator
Avatar for Shlomi Noach shlominoach
188
11k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
7
730
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
71
11k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
10
940
BBQ
Avatar for Matthew Crist matthewcrist
89
9.7k
StorybookのUI Testing Handbookを読んだ
Avatar for Shingo Yamazaki zakiyama
30
5.9k

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