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
67
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
エンジニア向け採用ピッチ資料
Avatar for 犬飼嵩 inusan
0
180
PipeCDのプラグイン化で目指すところ
Avatar for Warashi warashi
1
240
XP, Testing and ninja testing
Avatar for seki at druby.org m_seki
3
220
既存デザインを変更せずにタップ領域を広げる方法
Avatar for Tiphaine tahia910
1
270
“いい感じ“な定量評価を求めて - Four Keysとアウトカムの間の探求 -
Avatar for Nealle nealle
0
610
PHPで始める振る舞い駆動開発(Behaviour-Driven Development)
Avatar for uutan1108 ohmori_yusuke
2
240
Result型で“失敗”を型にするPHPコードの書き方
Avatar for Takuma Kajikawa kajitack
4
560
来たるべき 8.0 に備えて React 19 新機能と React Router 固有機能の取捨選択とすり合わせを考える
Avatar for Yuka O’oka oukayuka
2
880
システム成長を止めない！本番無停止テーブル移行の全貌
Avatar for さかうぇ sakawe_ee
1
160
ruby.wasmで多人数リアルタイム通信ゲームを作ろう
Avatar for lni_T lnit
2
330
0626 Findy Product Manager LT Night_高田スライド_speaker deck用
Avatar for Mana Takada mana_takada
0
140
生成AIコーディングとの向き合い方、AIと共創するという考え方 / How to deal with generative AI coding and the concept of co-creating with AI
Avatar for shiro seike seike460
PRO
1
350

Featured

See All Featured
Producing Creativity
Avatar for Steve Smith orderedlist
PRO
346
40k
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
PRO
20
1.3k
Gamification - CAS2011
Avatar for David Bonilla davidbonilla
81
5.3k
Bash Introduction
Avatar for André Augusto Costa Santos 62gerente
614
210k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
Avatar for soudai sone soudai
PRO
181
53k
How to train your dragon (web standard)
Avatar for Monica Dinculescu notwaldorf
94
6.1k
Scaling GitHub
Avatar for Zach Holman holman
459
140k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
34
5.9k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
53
7.7k
10 Git Anti Patterns You Should be Aware of
Avatar for Lemi Orhan Ergin lemiorhan
PRO
657
60k
Side Projects
Avatar for Sacha Greif sachag
455
42k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
694
190k

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