/extensions-4-every-developer

A list of extensions that every web developer must have

extensions-4-every-developer

A list of extensions that every web developer must have

Please leave a star.

Here is a list of extensions that every web developer should use

To contribute, follow the contributing guidelines

  1. OctoTree : This extension puts github on steriods. Gone are the days of ugly looking github repositories.

Features

  • IDE-like code tree
  • Customize how Github looks to you. Opt for the dark theme and customize the font of your text and much more...
  • Folder and file search
  • Support private repositories
  • Repo/file/issue/pull request bookmarking
  • High performance, working with repositories of any size
  • Dark themes
  • Multiple tabs
  • File icon themes
  • Code font settings
  • Pull request code review
  • Change sidebar docking position

Availiabilty

Octotree is available for download on chrome and mozilla

Here is how the extension looks

  1. Check My Links Extension : This extension is a link checker that crawls through your webpage and looks for all things, links. Broken links, valid links, redirecting links, we got you covered.

Features

  • Tab showing number of links present on a webpage or website
  • Queue with number of links left to account for as the crawler works
  • Syntax highlighting for valid, redirect, warnings and invalid links

Availability

Octotree is available for download on chrome

Here is how the extension looks

  1. Windows Resizer : This extension re-sizes the browser's window in order to emulate various resolutions.

Features

  • Major device resolution on which to test your website
  • Customizable list. Add/remove/reorder available resolution list
  • Allow you set the window's width/height, window's position.
  • Customizable global key shortcuts
  • Export desired settings and import them into another computer

Availability

Windows resizer is available for download on chrome

Here is how the extension looks

4.Color By Fardos: This extension allows you pick colors from websites, save colors & gradients, get matching shades and tints and create beautiful gradients.

Features

  • Color pick and save multiple colors from any site (using zoom technology) Cmd/Ctrl + Shift + e
  • Save your favorite colors and gradients, click any color and it's HEX is saved to your clipboard
  • Find shades, tints, complementary and other color combinations for any color
  • Sync your colors between multiple Chrome Browsers
  • Create linear or radial gradients with unlimited stops
  • Browse hundreds of beautiful gradients, edit, save and copy it's CSS whenever you need it

Availability

Color By Fardos is available for download on chrome

Here is how the extension looks

5.Css Viewer : This extension is a simple Css property viewer. Hover over any element and get all the css properties attached to it

Features

  • Hover over any html element and get all the css properties attached to it.

Availability

Css viewer is an available for download on chrome

Here is how the extension looks

6.Pesticide : This extension outlines every element on a page thereby allowing the user see a better placement on the page.

Features

  • Every element is outlined, like a box
  • It is an absolute easy way to visualize box-sizing in CSS
  • Hover over any box and immediately see the paddings, margins and border widths attached to that element via the box-sizing pane in the elements tab

Availability

Pesticide is available for download on chrome and firefox

Here is how the extension looks

  1. Wappalyzer : This extension is a technology profiler that shows you what websites and web applications ae built with.

Features

  • Allows you find what content management system a website uses
  • Uncovers website tech nology into a range of categories like programming languages, analytics, marketing tools and many more...
  • Tells the javascript frameworks, e-commerce platform that the given website or web application uses.

Availability

Wappalyzer is available for download on chrome and firefox

Here is how the extension looks

8.Screencastify : This extension helps to capture, edit and share videos in seconds.

Features

  1. 🎥 Record
  • Desktop, browser tab or webcam capture
  • Narrate with your microphone’s audio
  • Embed your webcam into the recording
  • Full HD resolution
  1. ✂️ Edit
  • Trim the start and end of your videos
  • Draw on your tab with the pen tool
  • Merge, crop, and add text to videos (upgrade required)
  1. 🚀 Share
  • Videos autosave to Google Drive
  • Copy shareable Drive link with one click
  • Publish directly to your YouTube channel
  • Share to Google Classroom
  • Save and manage videos locally
  • Export as MP4, animated GIF, or MP3

Availability

Screencastify is available for download on chrome

Here is how the extension looks

9.Web Developer Checklist : This extension helps developers by providing a yardstick to test if they have followed best practices

Features

  • Analyses any web page for violations of best practices
  • Easily discover problem areas in websites.
  • Get grading on different areas where best practices should be observed like SEO, Mobile responsiveness, Usability, Accessibility
  • Get the number of successful checks that passed the best practices test

Availability

Web Developer checklist is available for download on chrome and firefox

Here is how the extension looks

10.What font : This extension makes it ridiculously easy to identify fonts used in a website.

Features

  • Hover over any text in a website and automatically get the fonts used
  • Get access to the font family, font style, font-weight
  • Get some more properties of the text like the size, line height, color along with a small square showing a preview of the color used for the text
  • Allows you exit what font as the font checker keeps appearing as you move over the webpage

Availability

Here is how the extension looks

11.Web Developer : What a weird name for an extension. What it does is far from weird, though. This extension adds a toolbar button to the browser with various web developer tools.

Features

  • Tons of web developer tools that can be toggled to add or remove from the current page
  • When a given tool has been toggled on, an X icon is attached to the tool showing that it can be toggled off when clicked
  • Web developer tools effectively categorized into forms, css, images, resizer and much more.

Availability

Web developer is available for download on chrome and firefox

Here is how the extension looks

12.Microsoft Teams Bot : It's a bot which can attend your online classes/meetings on Microsoft Teams.

Features

  • Attends your online classes/meetings
  • User customisable timetable.
  • User just needs to input the Team name, meeting start time and the duration of the meeting
  • Joins the meeting provided that there is more than 1 attendee in the meeting
  • Fully autonomous. Can add any number of meetings.
  • Totally free to use
  • 100% attendance for all your classes/meetings

Advanced Features

Availability

Microsoft Teams Bot is available for download on chrome

Here is how the extension looks