Mediaboss Marketing

As developers, we use our browsers every day for all sorts of things, from googling, finding solutions to our problems on stack overflow, to wasting time on Reddit.But we also browsers to test and run the applications were developing. This is whyits crucial to have the right tools for the right job.

In this post, well be looking at some of my favorite browser extensions toboostproductivity as a web developer.

This simple yet effectiveextension does exactly what the name suggests. It allows you to change the size of your screen. Its simple but extremely useful if you need to validate your website among different resolutions and viewports. The extension comes with a predefined set of options, but you can modify them to fit your needs, this last option makes it better than simply using the Chrome Developer Tools.

Did you ever wonder which technologies are being used by a particular site? Wonder no more with Wappalyzer. This extension is more than a CMS detector or framework detector: it uncovers more than a thousand technologies in dozens of categories such as programming languages, analytics, marketing tools, payment processors, CRM, CDN, and others.

Dont let appearances fool you, this may not be the most beautiful toolbar ever but its certainly powerful. This extension adds a toolbar to your browser with options for many useful web development functions such us activating/de-activating scripts, popups, functions to control cookies or to look up for methods to build forms, images, styles, etc.

I personally dont use the extension anymore but it has been very useful in the past when I was still very unfamiliar with many of the HTML & CSS ways.

This extension allows you to easily inspect which fonts and font properties that are being applied to any text on a website. Fonts can make a huge difference when it comes to the design of your site, and you can use this tool to make sure theyre all as they should be, or perhaps to even get information about a font a particular website is using so you can also use it on yours.

Similarly to What Font, the ColorZilla extension allows you to get the color of any pixel on the website. But additionally comes with handy toolssuch as a palette browser and gradient generator.

Its a super interesting tool to have handy.

Disclaimer: This is a toolI dont regularly use. While its not widely used, and has a relatively low rating, it has been greatly recommended on twitter in the past.

This extension changes the CSS of all your elements so you can very visually see where are each element boundaries. This can be crucial when debugging CSS layout issues.

You dont need an extension for this, it can easily be achieved with some CSS, so if you dont want to use this extension (as myself), check out my articleCSS Tricks for Validating Layouts.

Extensions can make our lives easier, as is the case with the ones I listed today. Why not rely on a little extra help when developing?

This article was originally published on Live Code Stream by Juan Cruz Martinez (twitter: @bajcmartinez), founder and publisher of Live Code Stream, entrepreneur, developer, author, speaker, and doer of things.

Live Code Stream is also available as a free weekly newsletter. Sign up for updates on everything related to programming, AI, and computer science in general.

Read next: Google Photos' new AI-powered editor will retouch your images for you

See the original post here:
Here are the best Chrome extensions for web developers in 2020 - The Next Web