The Ultimate Dev Tool List for Web Developers
Published on February 9, 2023 in Lisbon, Portugal
This list is growing over time...
In the following I'll compile all the dev tools that I stumble over and that I think every web developer should have in their quiver to make most of their dev time and work with the code instead of against it.
There are no fixed criteria and the list is based on personal taste. But the tools listed are all either free or really worth the money.
Here we go (in random order):
- RepoTracker – free
Obviously. I mean, I'm building this app because I absolutely need it to stay up-to-date with the development updates in the open-source repos I use for my other apps.
- Image Optimizer – free
Amazing little app by Anton Reshetov to optimize images (reduce size) via drag and drop. It's free and super simple, love it!
- Gifski - free
Turns your videos into gifs. The perfect companion if you want to have moving pictures on websites and -services that don't support video.
- VS Code – free
The best code editor out there. Period. I've tried many others, but none of them comes close to VS Code. It's fast, it's extensible, it's cross-platform, it's free and it's open-source. What more could you ask for?
- Copilot – $10/month
It's creepy how good this AI hacker already is and it keeps getting better every day if you have the Nightly version installed. I'd estimate it saves me approximately 30-50% of my time when coding, especially if I work with new libraries or APIs. In fact, since this blog is written in markdown inside of VS Code, parts of this post have been written by Copilot.
- Bundlephobia – free
A nice little tool to quickly check the bundle size of an npm package. I'm already working on integrating it directly into RepoTracker.
- Fig – free (personal use)
Fig is a terminal add-on that adds all the things you ever wanted to your command line: autocomplete, plugins, etc. The cool thing is it also works in the VS Code terminal.
- grep.app – free
This app let's you search code in half a million open-source repos on GitHub. And it is blazing fast! Quite nice to find examples for code you're struggling with for example.
- Boxy SVG – free (basic use)
Boxy allows you to edit SVGs in a web app, almost like Photoshop. I made the logo for RepoTracker with it for example. All the editing features are free, only cloud saving and settings sync are paid.
- Linear – free (personal use)
Linear is a Jira replacement w/o all the BS – super simple, fast, and beautiful. And the best is it is completely free if you use it only by yourself. I manage all my private projects with it and I haven't hit any paywall yet.
- WebAPI check - free (open-source)
WebAPI check is a web app to help you develop modern web apps. It allows you to easily test and share the WebAPI capabilities of any device with a web browser. Just open the app and voilà. The sharing capability is especially useful to debug issues related to WebAPIs on a user's device that cannot be reproduced in your dev environement.
- HTTPie - free
HTTPie is an API development- and testing tool similar to Postman, but without all the clutter. They have a clean and beautiful web app as well as a terminal client with which you can run requests directly from the command line.
- metatags.io - free
This little web app previews the Google search result and social media previews for your website's Open Graph tags. You can also adjust them and play around with different versions to see how they look like.
- PROMPTMETHEUS - free
The age of AI has dawned upon us and all developers will pretty soon have to interact with machine learning models in one way or another to stay competitive. PROMPTMETHEUS is a prompt engineering toolkit that helps you compose, test, and evaluate one-shot prompts and seamlessly integrate different AI platforms into your apps and services.
- MX Toolbox - free (basic use)
MX Toolbox is a web app that helps you troubleshoot and diagnose issues with your email setup and pipeline. The free version gives you powerful tools to detect blacklisting and check for best practices.
- Squoosh - free
Amazing little open-source project by Google Labs to compress and optimize images for the web. The tool is a PWA and features many different options and compression algorithms. Many images on this website are optimized with Squoosh.
That's it for now, more to come...
Btw, should I add screenshots to the tools? Please let me know ✌🏽