Voice Recognition

Build a simple voice controlled web app

Quick note... If you fancy working on a ground breaking live music streaming platform, we have a couple of JS engineering jobs going at Mixcloud where I am the frontend development lead. Hit me up at james.robertson@mixcloud.com for more details.

Thanks to every new signup this week. Rephrased is going better than I possibly hoped. Nearly 100 people have attempted the first challenge so far. Keep sending me your finished solutions to jamesrobertson@outlook.com.

If you would like to be first to get the challenge each week, please subscribe below.

This week we are going to learn voice recognition in JavaScript

Jump straight to the challenge by clicking the button below. You will be linked to a Code Sandbox with one failing unit test. Read the README instructions and make the test pass to complete the challenge. Here is a link to some really useful docs.

Solve Challenge

Code Sandbox tips:

  1. Sign in and fork the sandbox to edit the code.

  2. Code Sandbox has Jest test integration so you should immediately see a failing test on the right hand side of the sandbox.

The Challenge

Voice controlled software is massive. In 2020, there will be an estimated 4.2 billion digital voice assistants being used in devices around the world.

Modern browsers now come with a speech recognition API. This weeks challenge is to make a basic web app that responds to the voice command "I solved the challenge".


Using vanilla JS running in the latest Chrome browser, complete the challenge so that the web app responses to your voice commands.

Acceptance Criteria

  1. Clicking on the "enable microphone button" enables the computer microphone.

  2. Once the microphone is enabled, saying the words "I solved the challenge" makes the web app background go green.

There is some basic code to get you started and a single failing unit test. Make the test pass and solve the challenge.

Solve Challenge

Good luck

Working solution