paint-brush
10 Must Have Chrome Extensions for a Web Developerby@nehabadiani
771 reads
771 reads

10 Must Have Chrome Extensions for a Web Developer

by Neha BadianiAugust 26th, 2022
Read on Terminal Reader
Read this story w/o Javascript
tldt arrow

Too Long; Didn't Read

Requestly is a testing & debugging tool for frontend developers & QAs. Wappalyzer is built to help you find the underlying technologies of web pages. Available for Chrome, Firefox, and Opera, it can be used for research, research, and lead generation, such as CRMs, Safari, Edge, Safari and CRMs. It is equipped to assist you in making your page responsive. It provides you the ability to disable JS, play around with Cookies, highlight various CSS properties on your page, enable auto-completion in forms, emphasize certain parts of the web page to overcome any issue.
featured image - 10 Must Have Chrome Extensions for a Web Developer
Neha Badiani HackerNoon profile picture


When it comes to developing applications from scratch or working on an existing one, the process is not as structured as it may seem in tutorials or how-to guides. One runs into various errors and roadblocks that might take days to overcome. The issues can be anything from picking the right shade for the aesthetic to making sure the correct API calls are made where necessary.


To ensure that this process can be as eased as possible, tools are built keeping in mind these problems and these tools can be easy to use and set up in the form of browser extensions which eradicate the obstacle of installation steps and just let you get your job done. Here are 10 Chrome extensions that a developer must try!


1. Requestly

Requestly is a testing & debugging tool for frontend developers & QAs. Using Requestly, developers can simulate different API responses, debug JS in production, etc. QAs & Customer Support use Requestly to report bugs with video, console logs & network logs to make it efficient for developers to debug issues. Requestly is available across all major browsers and supports debugging on Android & IOS too. One of the top-rated extensions on Chrome Store.



2. Web developer

This extension is a toolbox for developers. It provides you the ability to disable JS, play around with Cookies, highlight various CSS properties on your page, enable auto-completion in forms, emphasize certain parts of the web page to overcome any issue, and more. It is equipped to assist you in making your page responsive.


Available for Chrome, Firefox, and Opera.



3. Wappalyzer

Wappalyzer is built to help you find the underlying technologies of web pages. If there is a landing page you adore, just head to that page and you can check what kind of JS, or CSS framework is used to build it. In addition to it, it also displays the analytics tracker being used, issue trackers, the Platform being used for the page, and more.


It can be used for competitor research, lead generation, and such.


Available for Chrome, Firefox, Edge, Safari, and significant CRMs.



4. BrowserStack

This extension has become the go-to dev tool when it comes to cross-browser testing. It allows you to test your web and mobile apps in various browsers simply from their application.


Moreover, for mobile applications, it employs its data centers to provide a real device for testing rather than an emulator. It also has a separate extension for testing on Internet Explorer.

Available for all browsers.


5. Amino: CSS Editor

Amino lets you edit the CSS of your page just like you would in any editor. It is different from editing in the DevTools tab because they save your stylesheet and is applied every time the page is opened. One can also style pages by their domains or specific URLs.


Available for Chrome.



6. Ghostery

This extension is built to make surfing on the internet as private as possible. It enables you to decide if any site should have access to your personal data, provides anti-tracking and removes your data points, smart browsing to stop trackers from affecting website performance, and more.


Available for Chrome, Firefox, Edge, Safari, and Opera.



7. Check my links

Check my links is a browser extension used to verify if all the links present on your web page work fine. As seen in the image, it classifies links and highlights them according to their category on the page as well to make it easier for the developer to identify the broken ones.


Available for Chrome.


8. React Developer Tools

React Developer tools are built to assist one with debugging a React application. When the extension is installed and a site is using React, the extension is highlighted and you can find the ‘Components’ and ‘Profiler’ tabs in the developer tools. The Components tab shows the tree structure of the application and the Profiler tab lets you record performance.


Available for Chrome, Firefox, and Edge.



9. Checkbot

This extension is made for SEO, Security, and Speed testing of your website. It helps recognize broken links and duplicate content, helps with secure password forms, minifies CSS and JS for better speed, avoids render blocking scripts, and gives the report as shown in the image.


Available for Chrome.



10. Octotree

This extension allows you to have an overview of the file structure of a GitHub repository in a small side panel which saves time and helps in getting the job done more effectively. It also provides the ability to review Pull Requests, search through the repo, bookmark, and more.


Available for Chrome, Firefox, Opera, Edge, and Safari.


These are just 10 among hundreds of other extensions that exist to solve these problems and many more. I hope you’ll try at least one from this list and it makes your work a tiny bit faster and more efficient.