Awesome Chrome Extensions for Every Developer
Tags: tooling, crome, webdev, chrome
Published: 2022-07-07 21:36:58

## Introduction
Chrome is considered one of the most web browsers that have many features for normal users and developers.
So in this article, we gonna recognize to an awesome chrome extension that will ease your life as a developer.
So let's get started....👉

---

## Extensions
#### 1. [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en)
I think there is no react developer that didn't use this extension in his work at least once.
It is an awesome tool that helps you to analyze and debug react applications, like showing status, props, and all component details.

![React Dev Tools Chrome EXtension](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t3efqjgm900josj0rxnl.jpg)


#### 2. [JSON Formatter](https://chrome.google.com/webstore/detail/json-formatter/bcjindcccaagfpapjjmafapmmgkkhgoa/related?hl=en)
![Egypt Info as JSON Data](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x5ge58osr4i183i9giim.png)
Look at the above image, It is an API endpoint for the Egypt Country Information from the rest countries website, If I told you to tell me what is the Capital of Egypt, it a little difficult right?

![Egypt Info as JSON Data](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xmajc4rgcafhis0bei4o.png)
Now look at the above Image, If I tolled you too repeat the previous demand, Mission is easy now right?
That is precisely what JSON Formatter Extension gives us, It Reformate JSON string into a nice and interactive shape, Which ease dealing with data.


#### 3. [Fonts Ninja](https://chrome.google.com/webstore/detail/fonts-ninja/eljapbgkmlngdpckoiiibecpemleclhh)
In your work as a Frontend developer, You may find a nice font that makes you impressed and you need to use it in your application but the problem is that you need to know its name And that is exactly what fonts ninja came to solve, it tells you all fonts name in any website.

![Fonts Ninja Chrome EXtension](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2tgye0r653tdnmw2wfl8.jpg)


#### 4. [Grepper](https://chrome.google.com/webstore/detail/grepper/amaaokahonnfjjemodnpmeenfpnnbkco)
Nice and very good chrome extension that help you in the development process by shoeing your problem solution in google search result, So You should try it.

![Grepper Chrome EXtension](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fmn3336xuzsm0kddop7e.jpg)


#### 5. [Redux devtools](https://chrome.google.com/webstore/detail/redux-devtools/lmhkpmbekcpmknklioeibfkpmmfibljd?hl=en)
Great Extension if you use Redux, It give You all tools to debug analyze store and all reducers in your application.

![Redux devtools](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pvqntdtmp3ju3j8bhjof.jpg)


#### 6. [Wappalyzer](https://chrome.google.com/webstore/detail/wappalyzer-technology-pro/gppongmhjkpfnbhagpmjfkannfbllamg)
As a developer sumtimes you want to know the technologies that used in a specific website, This extension solve this problem, It tell you every technologies that is used in any website.

![Wappalyzer Chrome EXtension](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9sn9zjlzwb2hmz27lg2f.jpg)


#### 7. [Web Developer](https://chrome.google.com/webstore/detail/web-developer/bfbameneiokkgbdmiekhjnmfkcnldhhm)
Another Great Chrome Extension that Contains Nice tools for You as a Web developer.
It let you disable javascript or CSS from your website and more tools that absolutely will help you in your development process

![Web Developer Chrome Extension](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k8gp73ex29z01hd8qmqo.jpg)


#### 8. [Responsive Viewer](https://chrome.google.com/webstore/detail/responsive-viewer/inmopeiepgfljkpkidclfgbgbmfcennb?hl=en)
As a frontend web developer you should test your application if it is responsive or not in chrome or firefox dev tools, these tools are limited in size but with Responsive Viewer, you can test your website on every screen that you like and you can show more one view to compare your website on different screens.    

![Responsive Viewer Chrome Extension](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tksgz36og9a62psgk2hn.jpg)


#### 9. [Lorem Generator](https://chrome.google.com/webstore/detail/lorem-ipsum-generator-def/mcdcbjjoakogbcopinefncmkcamnfkdb?hl=en)
We may need random text to test a frontend website and know how it will be.
Lorem Generator Extension will solve this problem, It makes you random text with any length that you want.    

![Lorem Generator Chrome Extension](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/swzpdflmgtccuun48me2.jpg)


#### 10. [Web developer Checklist](https://chrome.google.com/webstore/detail/web-developer-checklist/iahamcpedabephpcgkeikbclmaljebjp?hl=en)
Great extension that helps you to make your application 100% true and ideal.
It test your website and gives you what your website needs to be Ideal  

![Web developer Checklist](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uinasglvqn0vawutdp5u.jpg)