Last week I participated in a hackathon at Hack Reactor, where we were given 2 days to make any web app we could come up with using Javascript. I decided to take the opportunity to experiment a little bit with Chrome extensions since I had never made one before. What I drummed up by the end was what I call the Millenial Interpreter button.

It's a chrome app that, when clicked, makes every word on the webpage you're viewing become a link to its definition on The core functionality works, but there are some bugs to fix for sure. I was pretty happy with the way it turned out - given the fact that I only had 2 days to make it.

Here are the main issues I ran across:

1) Urbandictionary doesn't have an api, so the only database available is a fan sponsored api that I found on (Still, it got the job done)

2) The api only accepts requests for one word at a time. This meant I would have to send a request for every word on a page, one at a time. (For this reason, it takes a few seconds after clicking the button before you can see the links begin to populate. I only query for words of length greater than 3 to mitigate the lag. Nobody wants the definitions of 3 letter words anyway.)

3) Making API calls for every word on the page and then changing their values to become links asynchronously is sort of complicated. I struggled for a while to figure out how to get it so that the program fires get requests rapidly and then changes each word asynchronously as the responses come back. If I had kept this as a synchronous process it would take forever to change all the words on a page.

4) Recursing over the DOM to access the text within every DOM element is trickier than just finding end-child nodes. The problem with just recursing until you find nodes with no children, is that some elements that contain text also have tags inside them. In these instances, only the inner-most node would get read, and that's not what you want.

Maybe I'll iron out the kinks one day and publish the app so people can use it, but for now, unfortunately, you'll just have to imagine it in your head.

comments powered by Disqus