Google Chrome is currently one of the most popular and widely used web browsers in existence with about 2.65 billion users according to backlinko.
It is an even more popular choice for web developers and web development. One good reason for that is it's rich collection of very handy browser extensions geared to make developers more productive.
Below are 25 handy chrome extensions every web developer should consider installing in his or her browser:
Validity
Validations are a core part of web development. With this chrome extension, you can validate your HTML document and carry out test for common errors like wrong attributes and syntax errors.
View Validity Chrome Extension
Web Developer Checklist
There are practices a web developer must consider while building websites but sometimes the web developer forgets one of this rule.
Web developer checklist helps you adhere to common best practices by analyzing your page for any pitfalls.
View Web Developer Checklist Chrome Extension
Check My Links
Keeping track of links is one of the most tedious tasks for web developers.
Thankfully, there is a tool to do this. Check My Links crawls your web page as it scans and checks for broken links.
View Check My Links Chrome Extension
Dimensions
Being a great developer entails creating inch-perfect elements and images.
Dimensions can be used to measure the dimension between elements on your page.
View Dimensions Chrome Extension
SVG Grabber
This extension helps you preview, download and copy the code of all SVG icons and illustrations on your page.
View SVG Grabber Chrome Extension
What Runs
A typical web page constitutes many technologies.
What Runs is a Chrome extension used to detects and identify what programming languages, JavaScript frameworks, plugins, Web server software, cms, CDN, fonts etc that a web page is using.
View What Runs Chrome Extension
Meta SEO Inspector
SEO is very important principle for ranking websites. This extension inspects a pages meta properties such as HTML meta tags, canonical attributes, no-follow links etc while browsing through it.
View Validity Chrome Extension
45to75
Maintaining an appropriate font size for your app is a crucial task for Front-end developers.
With this extension, we can always ensure that the text remains readable across different devices. It gives you so much control of your site’s texts.
Fontface Ninja
There are possibly thousands of fonts available today. Fontface Ninja helps you identify any kind of font on a website. You can also download it.
View Fontface Ninja Chrome Extension
ZenHub
This is a project management extension for gitHub. It helps in managing all gitHub activities right from the browser environment. Your team can also see every changes made to the project all from the same interface.
Lorem Ipsum Generator
There are times during web development that we want to test an input yet don't have the time to type a legit text.
This very handy extension quickly generates default text as a placeholder for a real text.
View Lorem Ipsum Generator Chrome Extension
Minimalist Markdown Editor
Markdown is one of the most popular text format. Most content-based platforms enable the use of Markdown to format texts.
With this extension, you can write markdown and see a live preview of what it looks like.
View Minimalist Markdown Editor Chrome Extension
User Agent Switcher
When you request for a page on your browser, the request header sent contains the user Agent: information which is typically the browser type.
This extension allows you switch between two or more user agents. This helps you check out how your web page is rendered across different browsers.
View User Agent Switcher Chrome Extension
MySQL Admin
Managing a MySQL database from the command-line is not only a bit difficult but requires knowledge of the command-line.
Thankfully, with MySQL Admin, you can manage MySQL databases in a very easy and Intuitive way with a GUI.
Install MySQL Admin Chrome Extension
Web Developer
This chrome extension adds an array of useful tools that every developer needs to make websites to the web browser.
View Web Developer Chrome Extension
Perfect Pixel
Imagine if you compare every single pixels on imagine with that of another image. Well don't imagine, we have a tool that does just that.
Install Perfect Pixel Chrome Extension
MagiCSS
MagiCSS is a live CSS editor extension, with inbuild editor, css syntax autocomplete, syntax highlighting, autogenerates CSS selectors with point and click and SASS compilation.
View MagiCSS Chrome Extension
Cookie Manager
Cookies is a small storage mechanism on the client browser where we can store information about that user.
Cookie Manager allows you add, delete and search for cookies on a site.
View Cookie Manager Chrome Extension
Color Tab
This chrome extention generates a beautiful color scheme anytime you open a new tab.
View Color Tab Chrome Extension
Colorzilla
This handy extension comes with features like eyedropper, color picker, pallette viewer and gradient generator all to make you web design process very easy and no-cody.
View Colorzilla Chrome Extension
CSS Dig
CSS Dig helps you find, group and analyze CSS style sheets and style blocks on most websites.
View CSS Dig Chrome Extension
WordPress Style Editor
If you are a WordPress theme developer, you should know that manually editing the CSS on your website is quite tedious. Thankfully, this extension makes everything significantly easier.
You can make direct edits to the CSS of your theme in WordPress right from the browser with this extension.
View WordPress Style Editor Chrome Extension
CSS Generator
This extension automatically generates all the code you need for your CSS in an easy and fast way. No need to start writing code.
View CSS Generator Chrome Extension
TunnelBear
TunnelBear provides you a VPN so you can test your across from various virtual servers around the world. You also don't have to worry about blocked websites, online tracking and other privacy issues. All geared towards safe and secure browsing experience.
View TunnelBear Chrome Extension
FINAL NOTE: HTML To React is an ebook guide for beginners to learn web development even if you know nothing but HTML. Check it out here
These 25 are all very useful even though there are a lot other handy extensions out there.
If you found this helpful and would like to support, you can buy me my favourite fruit:
Thank you and see you soon.
Top comments (1)
Good list i use a few of these already.