My browser of choice is Chrome. Starting out learning to code, I didn't know anything about extensions. Then, in coding boot camp, the instructors introduced me to my first. It was then that it hit me: I took for granted the importance of good tools. Just as in the kitchen, I would reach for the right knife to do a job. Here I'm sharing with you my five most often used Chrome extensions.

OneTab

I end up opening an absurd amount of tabs. Research, tutorials, videos, sites for inspiration, StackOverflow, and when I was job hunting, that was a browser to itself. I would have something to the tune of twenty to forty tabs across three to five browser windows, each window for a specific topic. Along the way, I'd have multiple projects running too. Working like that ate up my poor computer's memory before kicking its fan into overdrive and slowing to a crawl because of everything I had open. OneTab allows you to bookmark every tab in a browser to open when you're ready to come back to it. At least for the memory usage that Chrome contributed, which turned out to be plenty, this cut that down significantly.

Clutter Free

Along with the memory savings of OneTab, I often would open the same page multiple times. Clutter Free will prevent you from opening a duplicate tab. Pretty handy when you're looking up YouTube tutorials for Redux-Saga and accidentally keep opening the same one. It's also saved me from reopening the same StackOverflow page or GitHub discussion on a problem I've been researching.

React Dev Tools

When I'm building in React, I almost always have ReactDevTools running. If I need to know what's in the state or what props are passed to a component, I reach for React DevTools. I really like that I can use the element inspector to click directly on the element that I want to examine. I'm a very visual and tactile person, so anything that I can interact with makes my mind happy.

Redux DevTools

Redux is, in my opinion, kind of a pain to set up. I despise doing things more than once. Unfortunately, I'm a parent, so I'll end up saying everything multiple times anyway. What gets me about Redux is the need to set up a reducer, an action, and a type for everything you want to do. THREE TIMES! It's a kind of madness to use it. After all that time, I want to see what's in the store. I really mostly only use ReduxDevTools to show me what's in the store (global state for the app). I know there's more it can do, but that alone has been invaluable to me.

ColorZilla

When I've built projects from scratch, I've found color scheme inspiration in well-composed images. It's been so much easier to open a color dropper and target the colors I like, get the hex code for the color and get on with developing. I've used the color meter in my Mac. That color meter required me to get out a pen and paper to write down the values, put them into Google to change into hex. More work than I want to do. ColorZilla will bank each color that you select and give you the choice of hex or RGB values.

BONUS: Page Ruler Redux

It's only recently that I have had to work with a design team. I'll do my best to do the math and ensure the spacing between elements is right. Let's say it now and get it out of the way: CSS and math are difficult. So when in doubt, I measure it. Page Ruler Redux has been my most reliable tape measure to date.

What are your favorite tools? Are there any here that you think you have found a better extension?