DEV Community

Cover image for Tools Every Developer Should Know and Use

Tools Every Developer Should Know and Use

Himanshu Tiwari ๐ŸŒผ on February 05, 2021

SO FAR SO GOOD I hope your Web Dev journey sounds like that. Well if yes, then I have something that can make good to great and, if no, then don't...
Collapse
ย 
andrewbrown profile image
Andrew Brown ๐Ÿ‡จ๐Ÿ‡ฆ โ€ข

You forgot Vimium: (Vim for Chrome) ๐Ÿ™ƒ

chrome.google.com/webstore/detail/...

Collapse
ย 
darkwiiplayer profile image
๐’ŽWii ๐Ÿณ๏ธโ€โšง๏ธ โ€ข

I personally prefer vb4c (a fork of cVim after that was abandoned) :D

Collapse
ย 
aspiiire profile image
Aspiiire โ€ข

Man this is a banger thank you so much i loved it never knew about it thanks again!! ๐Ÿ”ฅ

Collapse
ย 
himanshutiwari15 profile image
Himanshu Tiwari ๐ŸŒผ โ€ข

Ahaan, that's because I knew you will do comment that, lol
Thank you so much for
Telling me about this one dude

Collapse
ย 
brandonwallace profile image
brandon_wallace โ€ข โ€ข Edited

Add the VisBug Chrome extension to the list.
Visbug is an open source browser design tool built with JavaScript.

It's features are:

  • Point, click & tinker
  • Edit or style any page, in any state, like it's an artboard
  • Inspect styles, spacing, distance, accessibility and alignment
  • Nitpick layouts & content, in the real end environment, at any device size
  • Leverage adobe/sketch skills
  • Edit text, replace images
  • Design within the chaos: use production or prototypes and the odd states they produce, as artboards and design opportunities
  • Design while DevTools simulates latency, i18n, media queries, platform constraints, CPUs, screen size, etc
  • Make more decisions on the front end of your site/app (a11y, responsive, edge cases, etc)
  • No waiting for developers, just go direct and edit the end state (regardless of framework) and execute or test an idea

There are other great photo websites.

pixabay.com/
pexels.com

For PNG images with transparency
klipartz.com/en

Collapse
ย 
himanshutiwari15 profile image
Himanshu Tiwari ๐ŸŒผ โ€ข

Great, definitely will try

Collapse
ย 
ama profile image
Adrian Matei โ€ข

Bookmarks.dev to manage your dev bookmarks and code snippets...

Collapse
ย 
vvyas2 profile image
Vinay โ€ข

Great tool, very nifty and useful.

Collapse
ย 
himanshutiwari15 profile image
Himanshu Tiwari ๐ŸŒผ โ€ข

Niceee ๐Ÿ˜ƒ๐Ÿ˜ƒ

Collapse
ย 
stribny profile image
Petr Stล™รญbnรฝ โ€ข

The title of the post absolutely doesn't correspond to the content. Also, writing an article where the title would be apt is almost impossible.

Collapse
ย 
himanshutiwari15 profile image
Himanshu Tiwari ๐ŸŒผ โ€ข

What if you have to choose a title for the post? What will you choose?

Collapse
ย 
stribny profile image
Petr Stล™รญbnรฝ โ€ข

You have made a post about "every developer", but those tools are front-end/web development only. What's more is that I don't consider them anything that everybody "has to know and use".

I suggest naming it according to what it really is, e.g. "Tools I like and use as a web developer".

Thread Thread
ย 
himanshutiwari15 profile image
Himanshu Tiwari ๐ŸŒผ โ€ข

Good, insight
Next time will think of that, dude

Collapse
ย 
ivypuckett profile image
Ivy Puckett โ€ข
Collapse
ย 
himanshutiwari15 profile image
Himanshu Tiwari ๐ŸŒผ โ€ข

What's that for

Collapse
ย 
ivypuckett profile image
Ivy Puckett โ€ข

It generates neumorphic css, so you don't have to mess around with box shadows yourself :)

Thread Thread
ย 
himanshutiwari15 profile image
Himanshu Tiwari ๐ŸŒผ โ€ข

nice will try thanks

Collapse
ย 
barelyhuman profile image
Reaper โ€ข

Fonts Ninja, another alternative to WhatFont, adds up to your browser and you can point on any font on a webpage
fonts.ninja/

Collapse
ย 
himanshutiwari15 profile image
Himanshu Tiwari ๐ŸŒผ โ€ข

Nice, Do you have any new to add on the list

Collapse
ย 
aspiiire profile image
Aspiiire โ€ข

Thanks man really great article, never knew about Uxwing really interesting ๐Ÿ˜

Collapse
ย 
acadoret profile image
Antoine โ€ข

You could maybe add Visbug and Responsive Viewer. They are just awesome for a webdev

Collapse
ย 
himanshutiwari15 profile image
Himanshu Tiwari ๐ŸŒผ โ€ข

Some one already added in discussion, so i think now it's not needed
If you have any other awesome extension to share ?

Collapse
ย 
acadoret profile image
Antoine โ€ข

Yes You re right ^^
Im using extensions like postman for debuging api endpoints. I use darkreader too.. It's Nice for reading documentation at 4 am ๐Ÿ˜…

Thread Thread
ย 
himanshutiwari15 profile image
Himanshu Tiwari ๐ŸŒผ โ€ข

Darkreader that's really nice
Thanks for sharing

Collapse
ย 
andrewbaisden profile image
Andrew Baisden โ€ข

So many great tools what would we do without them.

Collapse
ย 
bogkonstantin profile image
Konstantin Bogomolov โ€ข

Website monitoring: uptime.onl
Bugtracking: bugsnag.com
Expose project from local machine: ngrok.com

Collapse
ย 
himanshutiwari15 profile image
Himanshu Tiwari ๐ŸŒผ โ€ข

Wow, so much of amazing tool you have dude

Collapse
ย 
omchhabra18 profile image
om chhabra โ€ข

I will try all these extensions when I will complete my course...

Collapse
ย 
himanshutiwari15 profile image
Himanshu Tiwari ๐ŸŒผ โ€ข

Definitely, then you will save a lot time

Collapse
ย 
tranquan profile image
Tran Quan โ€ข

Thanks! This is so useful

Collapse
ย 
himanshutiwari15 profile image
Himanshu Tiwari ๐ŸŒผ โ€ข

Glad it was useful

Collapse
ย 
andreidascalu profile image
Andrei Dascalu โ€ข

Sounds more like UI focused tools, rather than generic development or even web development.

Collapse
ย 
himanshutiwari15 profile image
Himanshu Tiwari ๐ŸŒผ โ€ข

Glad you found them useful, BTW do you have some to add in my list? Would love to share some