Top Chrome Extension for a Web Developer

Sharon Jebitok
5 min readOct 2, 2021

As a software developer one frequently uses a browser as part of key tools. It could be Chrome, Firefox, Safari, Brave, or any other browser of choice. There are sites that we frequently look upon the browser and some of these sites or tools have come up with browser extensions to make your work more efficient. The browser extensions might be available across all browsers or limited to one.

Here is a list of top Chrome browser extensions I frequently use as a developer:-

- Grammarly

It eliminates grammar errors, detects plagiarism, and easily improves any text. It also allows you to:-
— communicate with impact by ensuring everything you write comes across the way you intend.
— present your best self every time you type by making your writing clear and engaging.

As a developer more often you’re told not to apologize about your English since it might not be a but spelling error and poorly written sentences are considered careless that’s why it’s important to have Grammarly extensions. Grammarly will check any forms especially input areas with type as text.

- Loom

From onboarding new employees, troubleshooting customer issues, or code reviews, Loom makes it easy to get your message across quickly and clearly using the power of video.

Loom enables the recording of short videos by either sharing screen with the camera or without. It is good for recording an overview of your project for project description on the ReadME file or while submitting for code review. Reviewers can leave comments or also record comments and share links.

In case you’re requested to record a small video of yourself while making an application or to be featured somewhere you can use Loom.

- React Developer Tools

It’s an extension for an open-source React, Javascript library that allows you to inspect React hierarchical components.
You will get two new tabs in your Chrome DevTools:

- ⚛️ Components tab shows you the root React components that were rendered on the page, as well as the subcomponents that they ended up rendering.
- ⚛️ Profiler tab allows you to record performance information.

- Redux Developer Tools

It’s an open-source tool for debugging an application’s state. The extension provides power-ups for your Redux development workflow. Apart from Redux, it can be used with any other architecture which handles the state.

- Breakpoint Tester

Breakpoint Tester is used to quickly and easily test the responsiveness of a website at various breakpoints. It allows you to easily switch between multiple breakpoints to test a site’s responsiveness at various screen sizes.

More often as web developers while building web pages/applications ensuring that it’s responsive in different screen sizes/breakpoints which is CSS property.

- Viewport Resizer

Viewport Resizer is a tool to test any website’s responsiveness. Just install the extension, go to the page you want to test, and check all kinds of screen resolutions of the page.

As a developer, I find this tool most efficient as it displays different screen sizes while checking responsiveness.

- LightShot

Lightshot is the fastest way to take a customizable screenshot. Simple interface, nothing useless and lightweight.

As developers, most often we need screenshots of our projects or images online to attach to our projects, ReadME files, or even attaching to articles. Lightshot allows you to select a specific area of the web page you want to select

- Notion Web Clipper

Allows you to save any page on the web to Notion through one click and helps you to turn them into action and choose destination & stay organized. Once you clip anything and you can view it in Notion, online or off.

Notion is a new tool that blends your everyday work apps into one. It’s the all-in-one workspace for you and your team. Most often job descriptions, project descriptions, and other applications to be made by developers are written on notion files and shared among developers. Notion is a good productivity app, good diary, or can be used to make the first version of the article.

- Keywords Everywhere

Keywords Everywhere browser add-on allows you to save a lot of time, time that would have otherwise been spent on copying data from one website while finding search volume from another. It lets you find long-tail phrases with their accurate search volume, CPC(Cost Per Click), competition, and trending data.

Most often we google for tutorials, documentation, YouTube videos, or articles while learning or debugging our code, Keywords Everywhere will show you more search results related. It’s also good when you’re doing technical writing while determining article titles or video titles for example on Youtube.

- Clockify Time Tracker

Clockify Time Tracker is a free Chrome time tracking extension. Track time on websites and how much time you spend working with one click.

As a developer, time management is a key factor for productivity. Clockify is one of the best time management tools for individuals and teams. With it, you can record time & tasks done within a specific time.

- Marina Pomodoro

It is a Pomodoro time management assistant. Allows you to tailor it to fit your productivity needs. You can set time segments that fit your workflow, reduce distractions and share your productivity timer with teammates to complete tasks more efficiently.

Pomodoro time management technique is one commonly used by creatives, which is based on 25-minute work segments with five or 15-minutes breaks.

- Clearbit Connect

It is a free Gmail extension that allows you to search for contacts based on domain or company name directly from your email.

This is helpful when you got a job offer via LinkedIn in this case you only know the email address of the company or you submitted your application via the company site but want to write a follow-up email to a specific person in the company or a team

- Metamask

MetaMask is an extension for accessing Ethereum enabled distributed applications or “Dapps” in your browser! The extension injects the Ethereum web3 API into every website’s javascript context so that dApps can read from the blockchain.

Recently, most developers have expressed interest in Web3 and Ethereum is one of the top smart contract networks with its solidity language. While building smart contracts one deploys you can deploy on testnet or mainnet. To be able to deploy on either of these networks you’ll need to connect your IDE to Metamask.

- Hiro Wallet

Hiro Wallet is a safe way to manage your STX, sign in to apps, and protect your funds while interacting with Clarity smart contracts.

Hiro wallet is a product of Stacks smart contract network that uses Clarity language for building smart contracts. With Hiro wallet, you can manage your tokens from the stacks network and also deploy smart contracts.

Thank you for reading through my article you can leave a comment or we can connect on Twitter.

--

--

Sharon Jebitok
0 Followers

I’m a Software Developer who is a software development student at Microverse, and writes about software development(JavaScript/Ruby) and blockchain technology.