Voice-driven mobile apps with Ionic and the speech recognition cordova plugin

Image for post
Image for post
I know, that image of a mic is bad, but yeah..

Background

Bootstrapping the Ionic app

ionic start speechy blank
cd speechy
ionic serve
Image for post
Image for post
Ionic Blank Template
Image for post
Image for post
npm install @ionic-native/core --save
ionic cordova plugin add cordova-plugin-speechrecognition

Building and testing the app on your phone

ionic cordova platform add ios
ionic cordova prepare ios
ionic cordova build ios
$PATH_TO_YOUR_APP/platforms/ios
Image for post
Image for post
Image for post
Image for post
2017–06–02 22:27:23.866235+0200 MyApp[2612:759736] Finished load of: file:///var/containers/Bundle/Application/A5F9C028–8737–49CA-A1C5-B8D35ADB35F3/MyApp.app/www/index.html2017–06–02 22:27:24.008490+0200 MyApp[2612:759736] Ionic Native: deviceready event fired after 836 ms
Image for post
Image for post
Image for post
Image for post
Image for post
Image for post
2017–06–02 22:43:09.667891+0200 MyApp[2657:766339] listen action triggered
2017–06–02 22:43:09.667974+0200 MyApp[2657:766339] listening mode is now : false
2017–06–02 22:43:09.667991+0200 MyApp[2657:766377] stopListening()
2017–06–02 22:43:09.888600+0200 MyApp[2657:766339] startListening() recognitionTask result array: (
“Can I have two cappuccino”,“Can I have to cappuccino”,“Going to have to cappuccino”,“Can I half to cappuccino”,“Going to half to cappuccino”)
2017–06–02 22:43:09.888688+0200 MyApp[2657:766339] startListening() recognitionTask isFinal

Conclusion

Written by

CTO @ GraphAware. Mixing Graphs, Search, Natural Language Processing and Machine Learning for bringing you an Intelligent Insight Engine.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store