When people speak about browser extensions, they usually mean these handy little plugins that make our everyday life in general and surfing, in particular, a bit more pleasant and convenient — like tools that streamline downloads, allow you to arrange your tabs better, bring control to bookmarks, and so on. However, there is a whole range of tools designed specifically for programmers and developers that remain almost completely unknown to nonprofessionals — and today, we are going to talk about them. Here is the list of the best, most useful, and indispensable Google Chrome extensions that can dramatically improve your productivity as a developer.
Developers, especially those dealing with RESTful APIs, have to work with JSON data all the time. However, reading it in its raw form through the browser can be extremely confusing, time-consuming, and unwieldy. JSONView solves this problem, allowing you to read it in an easy-to-understand tree-view rather than decipher it from the chaotic mishmash on your screen.
Web developers are busy people whose work requires complete concentration for prolonged periods. However, they operate in an industry that develops and changes at breakneck speeds — every day new technologies, solutions, and development-related products are released across the web. Keeping track of all this takes time and attention much needed for other tasks. Neglecting them means potentially lagging behind and missing essential developments in tech that may be crucial for your work. Whether you are an independent developer or work for a big company, you cannot afford to make either mistake. Daily effectively offers the third way — it replaces the new tab with hand-picked dev news from across the Internet. You no longer have to keep track of dozens of sources and get all the latest dev info without getting distracted from your code.
3. Eye Dropper
Eye Dropper is one of the most convenient and useful tools for the creation of website color palettes. It allows you to both pick colors from any web page you visit and insert custom colors, save the results in a palette that you can download in a CSV file. For extra convenience, it provides RGB, HSL, and HEX codes for each color, as well as their unique names.
Color-vision deficiencies of different types affect as many as 200 million people worldwide. It may be a drop in an ocean when compared with the entire Internet population but still constitutes a significant share. However, usually catering to their needs is relatively low on web designers’ and developers’ priority lists. Spectrum makes it easy to take care of this problem – with its help, and you can quickly test your website for accessibility for people with different types of color-vision deficiencies.
CSS-Shack is a handy tool that allows you to create website designs and then effortlessly export them into CSS files to be used later. And you do not have to input all the code manually — it supports many functions of a typical photo editor (including layers), which turns the creation of new styles into an easy and quick job.
6. Search Stack Overflow
If you are a web developer, programmer or coder, you must have heard about Stack Overflow — the most significant gathering space for developers of all kinds. If you have a question and it can be answered, you will find this answer on Stack Overflow. This extension has a single simple function – it adds a search box directly to Google Chrome, allowing you to search Stack Overflow’s vast knowledge base immediately at any time.
7. Site Palette
An extremely useful tool for designers and frontend developers as it allows you to grab the palette of any site in a matter of seconds. Simply choose the website whose color scheme you like, and it will generate the palette based on the colors used on its pages. You no longer have to pick colors manually – Site Palette does it for you and provides results more comprehensive than anything you can do on your own.
8. Full Stack Optimization Live Test
Full Stack Optimization Live Test is a Chrome extension that allows you to perform a large set of tests on any page while browsing. Testing procedures include such things as SEO and performance. Besides, you can easily create new tests based on your own prerequisites yourself. You receive direct visual feedback and insights for each test.
9. FontFace Ninja
If you work in web development, you should understand the importance of fonts and the difficulty of working with them. FontFace Ninja removes many of the problems usually associated with this job. Choose any font on any website you are interested in and it will provide full information about it: not just the name, but also a download link (if it is free) or a price (if it is commercial). It can even detect fonts in images (currently in beta).
10. CSS Scan 2.0
Chrome’s Dev Tools already make it relatively easy to take a look at a website’s inner workings, but CSS Scan makes it particularly easy if you are specifically interested in CSS. Simply hover over an element you are interested in, and it will display a pop-up with all CSS rules it uses. It is not just for information — with a single click, you can copy them for later use wherever you like. It is useful for both borrowing parts of themes to use in your work or to debug your own faulty code.
Web developers, naturally, have to test their websites. Some test procedures have to be repeated all the time. If you do it manually, repeating the same actions can become tiresome and lead to distractions and mistakes. iMacros allows you to record what actions you take during a test and later repeat them with a single click. If you have to run many tests of the same kind, it can become a lifesaver.
A developer’s life is difficult and full of stress — you have to use any tool that can ease your burden and improve your efficiency. These 11 chrome extensions will make your job easier.
Featured image: Shutterstock