Chrome has pretty advanced DevTools by itself. However, can we improve our developing experience by adding even more exciting features? Here are 15 of my favorite Chrome extensions.
1. Evernote Clipper
Clip the web pages you want to keep. Save them in Evernote. Easily find them on any device. Use the Evernote extension to save things you see on the web into your Evernote account. Best tool for saving text, code or even images.
2. Wappalyzer
Wappalyzer is a cross-platform utility that uncovers the technologies used on websites. It detects content management systems, e-commerce platforms, web frameworks, server software, analytics tools and many more.
3. Web Developer
The Web Developer extension adds a toolbar button to the browser with various web developer tools. This is the official port of the Web Developer extension for Firefox.
4. Visual Event
With Visual Event you can figure out what event is bound on each DOM element. Very helpful for client-side developers working in large projects/complex views.
5. Web Developer Checklist
Web Developer Checklist analyses any web page for violations of best practices For web developers who wants to make sure they follow best practices. This extension allows you to very easily discover problem areas in your website.
6. CSSViewer
CSSViewer is a simple CSS property viewer for Google chrome originally made by Nicolas Huon as a FireFox addon.
7. ColorZilla
ColorZilla, one of the most popular Firefox developer extensions with over 5 million downloads is finally available for Chrome! With ColorZilla you can get a color reading from any point in your browser, quickly adjust this color and paste it into another program.
8. JSON Formatter
JSON Formatter is an extension for printing JSON and JSONP nicely when you visit it ‘directly’ in a browser tab. Recommended!
9. XV — XML Viewer
XV — XML Viewer is a powerful XML viewer for Google Chrome. Exactly what you need to inspect XML responses from various Web services. Great extension!
UPDATE (25/10/2017): This extension has suddenly started to inject tracking code on every single request. Do not use and uninstall!
10. WAVE Evaluation Tool
WAVE is a web accessibility evaluation tool. It provides visual feedback about the accessibility of your web content by injecting icons and indicators into your page. No automated tool can tell you if your page is accessible, but WAVE facilitates human evaluation and educates about accessibility issues. Must have!
11. Allow-Control-Allow-Origin: *
The extension allows to you request any site with ajax from any source. Adds to response ‘Allow-Control-Allow-Origin: *’ header. Must have if you developing on remote api.
12. Lighthouse
Lighthouse is an open-source, automated tool for improving the performance, quality, and correctness of your web apps.
When auditing a page, Lighthouse runs a barrage of tests against the page, and then generates a report on how well the page did. From here you can use the failing tests as indicators on what you can do to improve your app.
13. Session Manager
With Session Manager you can quickly save your current browser state and reload it whenever necessary. You can manage multiple sessions, rename or remove them from the session library. Each session remembers the state of the browser at its creation time, i.e the opened tabs and windows.
14. Clear Cache
Quickly clear your cache with this extension without any confirmation dialogs, pop-ups or other annoyances.
15. Selenium IDE
Selenium IDE is designed to record your interactions with websites to help you generate and maintain site automation, tests, and remove the need to manually step through repetitive takes. Features include:
- Recording and playing back tests on Firefox and Chrome.
- Organising tests into suites for easy management.
- Saving and loading scripts, for later playback.
- Support for Selenium 3.
That’s my top 15 chrome extensions for developers, share yours in comments!
