Published on

Cat Whisperer

Last Modified on
Last modified on
Cat Whisperer
Photo by Maria D. Campbell on Interglobalmedia


This is a project in which I merge together my (original) Cat Whisperer project, Speech Synthesis, audio, and a cool image fader animation effect I apply to my images of my (late cat) Percy.

This is a little speech to text app I created so that cat lovers could be inspired to write about their cats using the Speech Synthesis API while being inspired by the app’s cat image slideshow. There is also music if one wants to listen while writing. The user’s text is saved to session storage. If the user reaches the 5mb limit, he/she can save it to a .txt file and download it.

Project Includes

cat whisperer, es6 javascript, eslint, es6 modules, file downloads, htm5 audio, session storage, speech synthesis api, text to speech, web audio api, webpack

Refactoring The App

January 8, 2019: A lot has happened in terms of JS workflows since I created this app. Since I want to potentially develop this app further, as well as (continue to) display it in my portfolio, I knew I had to update the code here. That especially means updating the workflow!

So I have applied an adaptation of my latest React workflow using Webpack 4 and Babel 7 to this application. A whole new set of tools for automation!

I also replaced local storage with session storage.

I also wrote a quick piece on my experience refactoring this app (yesterday) that is available for your reading pleasure on my Developer Blog. To read the post, please visit Refactoring your JS workflow when your images are in your CSS only on my Developer Blog.