:thinking: :bulb: :exclamation:

This was my first Chrome extension that I have ever implemented and released. It was such an awesome process, and I learned an insane amount! For instance, I learned how to work with and incorporate Chrome’s runtime API, and create the final bundle to upload to the Chrome webstore.

For a while now, it has been a goal of mine to create an extension for the browser ( whether that be Chrome, FireFox, MS Edge, etc… ) and I finally did it! Feels great – and I’m excited to share what I learned, and some aspects of the process with you.

But why Ti…why?

Because why not??

haha kidding :sweat_smile:

As stated earlier, it was always a goal of mine to create and implement an extension for the browser. I also wanted to challenge myself and work with something I haven’t worked with before. I also love learning, and I learned a lot from this project.

Lastly – If I am able to affect a single individual with this plugin, then that’s a win in my book.

What I wanted to accomplish with this project

I had two goals in mind when I initially started this project.

  • First and foremost – learn something new and challenge myself! :rocket:
  • Create a Chrome extension that would benefit the user who is using it. Create a solution to an observation.

This project’s future, what do I want to add to it?

Great question – and a question that I have thought about quite a bit! I would love to further expand on the extensions’ functionality and also improve some of it’s UI/UX.

Some :bulb:’s I have so far

  • Create a new UI/view that would house the amazon product image(s) that the user saved. So essentially a collection view. This could serve as a quick reference to a product that a user found interesting on amazon rather than looking through their bookmarks or searching for the product again on amazon.
  • Add a review / rating feature for the extension for the user to provide feeback and constructive criticism!
  • Redesign the main popup view UI to be more intuitive and easier to manage, especially if I am going to be creating a new collection view for the images.

About The Project

Have you ever wanted to navigate Amazon’s customer review images by using the keyboard? Well look no further, now you can! (end cheesy infomercial here :sweat_smile:)

This was an annoyance of mine, and thus my full motivation for implementing this chrome extension. Okay, I wouldn’t say full motivation haha however it was a huge contributing factor, for sure!

At the end of the day I wanted to implement a simple solution, to a daily occurrence / observation of mine.

This Chrome extention, allows you to navigate Amazon’s customer review images in a more intuitive, seamless manner. It allows you to use the left and right arrows on your keyboard as well as allowing you to close the image pop-up modal by hitting the Escape key.

Below, are a few images showcasing how the extension looks once you have installed it!

Main extension menu Showcasing disabling the extension Showcasing enabling the extension
Images showcasing how the Chrome extension looks once installed!

Tools and Libraries I useed to build this project

This Chrome extension was built with the following libraries and tools :

  • Font Awesome – font and icon toolkit based on CSS and Less.
  • iziToast – Elegant, responsive, flexible and lightweight notification plugin with no dependencies.
  • JQuery – Come on, it’s JQuery! Needs no introduction :grin:
  • Parcel – Blazing fast, zero configuration web application bundler
  • Tippy.js – the complete tooltip, popover, dropdown, and menu solution for the web

Installation

  1. Navigate to the Chrome Webstore and download extension!

Also, if you found this extension useful in anyway – bad or good, please leave a review! It would really help me out and I would greatly appreciate it!

License

Distributed under the MIT License. See LICENSE for more information.

Contact

Updates

  • Somebody forked my project on github! I think that is pretty cool :heart_eyes_cat: