Chrome Extension to Document Typos

The 'Why'

I see typos everywhere I go. So, I decided to start a proofreading business, but with no prior clients I wanted a "portfolio" of typos that I had seen, including screenshots. I wanted a quick, easy, and low-friction way to add new material to this portfolio.

The 'How'

A Chrome browser extension that works via the context menu, for highlighted typo text. This was built with Javascript and HTML. A publicly viewable backend to display the typos, their corrections, and the screenshots. This was built using PHP and MySQL.

The Demo Video

The Code

Click here to download a zip file containing both the Chrome extension code and the backend code.

Assumptions and Known Shortcomings

The backend code has absolutely no protection/data sanitization. If I were deploying this on a public facing server I would implement several input data checks, as well as an IP-based whitelist. The screenshot taken is the entire contents of the browser window, it would be better if it was just a couple hundred pixels in both directions from the highlighted text. The screenshot data is stored in the database as the contents of the image file, it would be better if the screenshot file was stored on the server and the database simply contained the filepath for it.

Possible Expansion

One idea I had to build this out, was to allow anyone to submit typos. This would be a sort of crowdsourcing service, where end users could submit errors from any website on the internet. Customers could pay to receive notifications of new typos found on their sites, perhaps even auto-correction if they so chose. This of course would require some sort of vetting process for submitters, perhaps a reputation system. Not only would this system need to be redundant against vandalism, it's quite possible that users with poor grammar think they encounter an error when there is none.