Controlling a Light Bulb via Voice Recognition in Pure Javascript

Mar 6, 2017

Final Product

Amazing production quality, I know. I’m sort of a big deal.


  1. A LIFX bulb.
  2. A lamp to put the bulb into.

lifx unopened


1. Open the box and take out your awesome new light bulb.

lifx opened


2. Take your bulb and screw it into your lamp.

lifx in lamp

3. Open your phone and download the LIFX app. In my case, I am using Android.

4. Register for an account and then sign in.

5. When you sign in, under the “New Lights” section, you will see your bulb. If you don’t see it, make sure you have your light turned on.

new lifx light

6. Click on your new light. From the drop-down list in Wi-Fi network, go ahead and select the network your phone connects to. Enter the password for the Wi-Fi network, and give the light a name. I named it “voice activated light,” (for the purpose of this tutorial, I recommend you name it the same thing), then click “OK.” NOTE: The light will NOT work on the 5GHz band. It is only capable of operating on 2.4GHz.

lifx connect to wifi

7. Once you click “OK,” the light will go through a series of operations to connect to your network. After giving it about 60 seconds, you should see your light bulb under the “Lights” section now. Great! We have now connected our light to the network.

active lights

8. Now we will register our API token. Navigate over to and log in with the same account you used to register inside the app. Once you log in, click on the “Generate New Token” button. Give your token a label then click “Generate.” When the token appears, make sure to save that, as you will need it very soon.

9. To go along with this tutorial, I have made a JS application demoing webkits ability to recognize speech. This application will ONLY work in chrome. Open up a terminal and run:

`git clone`

10. Go ahead and open the application in your favorite text editor now. Inside `src/js` you should see a file called `env.dist.js`. Copy the contents of that file, create a new file in the same directory called `env.js`, and paste the contents inside that file. Replace `label` with what you named your light bulb and replace `accessToken` with the token from the LIFX cloud site.

11. Run:
`npm install`
`npm run build`
`npm run serve`

After running the serve command, your default browser will automatically open a connection to: `http://localhost:8080` Make sure you have it open in Chrome, then try out the commands. You are now able to control your light bulb via voice recognition!


Meet Sourcetoad, a 2023 Best Places to Work honoree

Meet Sourcetoad, a 2023 Best Places to Work honoree

Tampa Bay Business Journal — April 26, 2023 Sourcetoad has been selected as a 2023 Best Places to Work! We are thrilled to be among Tampa's top workplaces for the fourth year in a row, and we are grateful to each of our Toads for making Sourcetoad such a fantastic...

This Year in FinTech: Trends to Watch in 2023

This Year in FinTech: Trends to Watch in 2023

The financial services industry experienced rapid digitization throughout the COVID-19 pandemic, and growth of the financial technology market is expected to continue in 2023. The global fintech market grew to $158.9 billion in 2022, and projections estimate it will...

2023 Top HealthTech Trends

2023 Top HealthTech Trends

Technological innovation has played a vital role in the transformation and growth of the healthcare industry. Not only is the medical space an early adopter of emerging technologies, HealthTech is currently one of the fastest-growing industries worldwide. The global...