loading...
Cover image for Top 10 Chrome Extensions Every Developer Likes

Top 10 Chrome Extensions Every Developer Likes

shijiezhou profile image Jay Chow Updated on ใƒป3 min read

1.Octotree

Octotree Pro is loaded with features that bring your productivity on GitHub to the next level! Thousands of developers are using Octotree Pro daily to boost their productivity.

Cancel online anytime with a click of a button. But you will probably never do that as our cancellation rate is less than 1%.

We recommend the Team plan which only costs ~$2 per employee per month. Your company can invite anyone into their subscription.

https://www.octotree.io/

Alt Text

2. Dark Reader

Dark mode for every website. Take care of your eyes, use dark theme for night and daily browsing.
This eye-care extension enables night mode creating dark themes for websites on the fly. Dark Reader inverts bright colors making them high contrast and easy to read at night.

You can adjust brightness, contrast, sepia filter, dark mode, font settings and ignore-list.

https://darkreader.org/

Alt Text

3. SourceGraph

Sourcegraph provides this standard developer platform to every company, helping startups and large enterprises ship better software faster.

https://sourcegraph.com

Alt Text

4. Web Developer

The web developer extension for Chrome adds a little toolbar with different tools available. The original concept of this Chrome extension for developers came from the PNH Developer Toolbar.
The chrome extension web developers has a lot of handy tools a developer can use in their day-to-day work โ€“ for designers as well as programmers. It allows you to do a lot of more then the standard Chrome Inspector, like being able to easily add outlines to elements just by clicking, displaying rulers, finding all broken images on a page, and lots more.

https://chrispederick.com/

Alt Text

5. ColorPick Eyedropper

An eye-dropper & color-picker tool that allows you to select color values from webpages.
If you feel the need to alert the developer about a bug use the feedback forum instead of writing a review.

If you are having problems with accuracy use the arrow keys, and enter to pick colors once you get the mouse in the approximate location.

Please note that colors are picked from a snapshot of the page that is updated only when you scroll. To take a new snapshot press r or use the re-snap button. Sometimes if you just changed tabs, you may see a snapshot error - this is an intentional security feature. Press R or scroll to correct this, or exit color pick and try again.

http://vidsbee.com/

Alt Text

6. Ghostery

Ghostery is a great Chrome extension which detects trackers, pixels, and any other embedded snippet on a website. You immediately see which plugins and trackers are installed on the web page youโ€™ve visited. Further on, Ghostery lets you protect your privacy. Thereโ€™s no registration or sign up required to use this Chrome extension.

https://www.ghostery.com/

Alt Text

7. Session Manager

Simple yet powerful tab set management. Quickly and easily save, update, remove, and restore sets of tabs!
Session Manager is a simple yet powerful extension that makes it quick and easy to save, update, remove, and restore sets of tabs.

https://chrome.google.com/webstore/detail/session-manager/mghenlmbmjcpehccoangkdpagbcbkdpc?hl=en

Alt Text

8. JSONView

You can configure JSON parsing method in options page:

  • the default method (JSON content is extracted from displayed page) is faster but can (in some rare cases) alter or fail to parse the JSON content.
  • the safe method costs an extra XMLHttpRequest request (JSON content is extracted from the HTTP response) but is 100% safe.

https://chrome.google.com/webstore/detail/jsonview/chklaanhfefbnpoihckbnefhakgolnmc?hl=en

Alt Text

9. Page Ruler

Draw a ruler to get pixel dimensions and positioning, and measure elements on any web page.
Page Ruler lets your draw out a ruler to any page and displays the width, height and position of it.

https://chrome.google.com/webstore/detail/page-ruler/emliamioobfffbgcfdchabfibonehkme?hl=en

Alt Text

10. Wappalyzer

Wappalyzer is a cross-platform utility that uncovers the technologies used on websites. It detects content management systems, ecommerce platforms, web frameworks, server software, analytics tools and many more.

https://www.wappalyzer.com/

Alt Text

Posted on by:

shijiezhou profile

Jay Chow

@shijiezhou

Living life openly. This year I set the following goals. Below you can find the progress on each.

Discussion

markdown guide
 

Refined GitHub is also a really awesome one.

GitHub logo sindresorhus / refined-github

Browser extension that simplifies the GitHub interface and adds useful features

Refined GitHub

Browser extension that simplifies the GitHub interface and adds useful features

We use GitHub a lot and notice many annoyances we'd like to fix. So here be dragons.

Our hope is that GitHub will notice and implement some of these much needed improvements. So if you like any of these improvements, please email GitHub support about doing it.

GitHub Enterprise is also supported. More info in the options.


Install

Highlights ๐Ÿ”ฅ

Adds button to mark issues and PRs as unread
(They will reappear in Notifications)
Adds one-click merge conflict fixers
Adds reaction avatars showing who reacted to a comment Adds the option to wait for checks when merging a PR
Linkifies issue/PR references and URLs in code
โ€ฆ

It's available for Chrome and Firefox.

 
 

Cool, this is awesome. we will add this on collection if my team approve it

 

I am a developer and in addition to some of the above, I use the following

  • AdBlockerPlus & uBlock Origin
  • Google Calendar because I time-block myself and want to be notified on computer and phone
  • LastPass, I assume every dev should be using some sort of password manager
  • Web Server for Chrome for quick testing
  • ColorZilla
  • JsonFormatter
  • Postman & Interceptor
  • Google Docs
 

AdBlockerPlus & uBlock Origin

why don't you just pick the latter?

 

WHOA! I hadn't heard of any of these... It amazes me what's out there that "every developer" knows about, but clearly there's a ton of room for sharing knowledge still. ๐Ÿ˜‰ Thanks for the list!

So everyone can take that as a lesson: it doesn't matter how obvious you think something is - you can still share it! Someone out there hasn't heard it before :)

 
 

It is a helpful plugin for the github,
It is good for your keyword searching and indexing details

 

Ghostery is a great tool. But once you install it, you'll start getting pissed off, seeing what every website tracks.

 

uMatrix gives a nice breakdown of how nice a website is
thepracticaldev.s3.amazonaws.com/i...

It becomes really hard not to ask myself 'wtf is all this crap'

 

Here's a couple extensions for devs that I have developed, and open sourced at github too:

Quick source viewer, to quickly see the HTML, CSS, JS of a page: chrome.google.com/webstore/detail/...

Page size inspector, to quickly report the total page size, number of requests, cache use:
chrome.google.com/webstore/detail/...

 

I'll throw mine into the mix.

It's a super simple "Cookie Crusher" that clears all the cookies on the current site and reloads the page in one click:
chrome.google.com/webstore/detail/...

 

I would replace the following:

Also, there is an extension slightly similar to Wappalyzer, but for a WordPress site analysis: WordPress Theme Detector and Plugin Detector.

 

Awesome list Jay!

I use the Dark Mode, JSON View, ColorPick Eyedropper, and Page Ruler. Apart from these, I use:

  • Adblock Plus
  • Dashlane
  • Daily (New Tab Extension)

I wonder what do you use as your new tab extension, and why not an adblocker?

 
 

Usually, I tend to not promote OctoLinker myself in comments, but it's essential for every GitHub user octolinker.now.sh ๐Ÿ˜‰

 
 

I'd recommend GhostText - a great extension that allows you to sync a textarea on a webpage with your IDE.

 
 

You should really check out dailynow.co
It will replace your new tab with the latest development blog posts.

Disclosure: I'm the maker

 

I don't really see the benefit of a colour picker. For development its more effective to use the debugger to alter the page and pick a colour.

 

Thanks for share, great tools, I think I will improve my work session with the tools you shared :)

 
 

Recommend the extension I developed: chrome.google.com/webstore/detail/...
search multiple programming documents in the address bar.