Useful Browser Extensions for Productive Web Development
4 min read
As a software developer, apart from VPN and ad-block 😉, I have some favourite chrome extensions I use regularly. These extensions really make my life easier. In this article, I will share some of those free browser extensions and tools with their alternative. From web development to project management, these are really handy and extremely useful to boost overall productivity.
For this article, I have chosen Chrome browser because it's still used by the majority of the people. You will obviously find compatible versions for other browsers also. Though I am writing this article on a developer perspective, but these extensions are useful to anyone. I have arranged the selected extensions by category with a brief description.
Lightshot: One of my most favourite and used tools. It's a really convenient screenshot tool. You will just have to select an area, edit your screenshot and upload it to the server. The main advantage of this extension, is that you don't have to download/upload the screenshot and share it to the other. This tool automatically uploads the image to the server and provide an instant shareable link, which really efficient and time saving to share or write any document/report.
Full page screen capture: If you need to capture a full scrollable web page. This extension helps to take screenshot of entire page and also you can edit and download as PDF of the snap.
Alternative: FireShot -Take Webpage Screenshots Entirely
- Loom: One of the most used extensions in my workplaces. It's really easy to record your screen and camera and share that content in an instant with a link. You can edit and download the videos. People with access can also comment on the video. Most of the time while, providing any feature or bug demo, it is really life saving. Alternative: Nimbus Screenshot & Screen Video Recorder
- ColorPick Eyedropper: Often we need to pick the color from a web element. This extension help to select colors from pixel level of a webpage with magnifying option. Alternative: ColorZilla
Markup & Formatter Tools
HTML Validator: Sometimes we have a large html file with error and cluttered code format. This extension helps to check the HTML code, syntax and structure.
JSON Formatter: Any large or complex json data become difficult to read. This extension helps to format and beautify json content. Alternative: JSON Viewer
Allow CORS: While developing locally or to communicate with a server API or url we face CORS error. This extension overrides the request header and set Access-Control-Allow-Origin, which lets you easily perform cross-domain Ajax requests in web applications.
Insomnia: REST Client to run, test API requests to any REST server. Really useful to check a REST API on the. This extension comprises many more additional info. Though there are lots of good alternative standalone App like Postman.
The Great Suspender: Most often there are lots of tabs opened in my browser. Some tabs are opened for a long time. We know chrome is a RAM eater, so too much tabs create too much memory consumption. In this scenario, this extension helps to run my machine smoothly by suspending the tabs I am not using. Really useful to save power, memory and bandwidth.
BrowserStack: It gives various mock desktop and mobile browser. You can test and check your webpage on different browsers using it.
Picture-in-Picture: A really cool extension and uncharted extension. It keeps running videos on a floating window and you can interact with other tabs and pages.
Honourable mentions: CSS Peeper, Grammarly, Sticky Notes, Daily.dev
Extensions and tools I just mentioned, are not necessarily the top or most popular one, instead these are one of my favourites and mostly used. Please, let me know if you find any interesting or common tools here, or have something to add.