Knowledgebase

9 Developer Productivity Tools Print

  • internetivo, developer, dev, devs, devops, productive, productivity, tools, fingerprint, bundlephobia, web, code, requestbin, replit, cloudcraft, compressor, unminify, caniuse, APIs, local, localhost, javascript, css, html, php, unpack, deobfuscate, design, infrastructure, cloud, architecture, framework
  • 1

BG Image by Markus Spiske on Unsplash
 

The internet is not just here to help you learn how to code, there are a lot of useful online tools that can help you during various stages of development and save you precious time spent on each task.

Here’s a list of online tools that can come in handy for any developer out there (sorted in no particular order).


1. Can I Use

If you’ve ever wondered about browser compatibility for any web APIs (e.g.: local storage), Can I use is the place to go. It offers updated support tables to determine the support of APIs for desktop and mobile browsers.

 
Testing compatibility of local storage on browsers

2. Unminify

Unminify.com is a free online tool to unminify (unpack, deobfuscate) JavaScript, CSS, and HTML code, making it readable and pretty. It’s one of the most-used websites for code beautification.

Finding it hard to read someone’s code with no indentation or a file that contains only one line of unreadable code? Just copy-paste your code to Unminify and make it readable in less than a second.

 
unminfiy.com

3. Compressor

Image sizes can be a major factor that determines the load time of your website.

Compressor.io is an online tool for reducing the size of your images without losing image quality. The tool is so good that there is almost no difference before and after compression of the image.

 
compressor.io

4. Cloudcraft

Cloudcraft helps you design and budget your cloud. It has a very cool drag and drop interface to create 3D diagrams, by connecting different cloud infrastructure services (currently only for AWS).

It has a budget tab, which will give you a breakdown of your costs for the current architecture.

 
Planning cloud architecture using AWS services.

5. Repl.it

Repl.it is the perfect online IDE that you have been looking for, all those years. You can boot any programming environment for your favorite language or tech stack in less than two seconds.

It supports all modern languages such as Python, KotlinRuby, and JS. You can install libraries or packages and use them directly, without having to download or manage them.

You can share your code directly by sharing the repl.it link and also embed a repl.it for your users to interact with the code.

 
Using Express JS on a node server environment.

6. RequestBin

RequestBin gives you an instant HTTP endpoint that will collect all the requests sent so that you can interpret them easily to check and validate data.

It can be really useful when you have to debug webhook requests from various websites and you don’t know the exact structure or type of data that you might receive.

 
Data received through post request to the endpoint.

7. Web Code

Web Code is one of the best code generators out there. You can generate code for various basic and advanced needs by just entering your requirements.

This is very useful for web developers who are not familiar with playing around with HTML and CSS.

 
Generate CSS code for different borders on 4 sides

8. BundlePhobia

Ever since modern front-end frameworks have come into the picture, people have wanted to keep their bundle size as low as possible to reduce page load time for users.

BundlePhobia helps you analyze how much size an npm package can add to your project.

You can upload your package.json file directly to the website to get an analysis of all the packages in the project or search for individual package details.

 
Calculating the size of pdfmake library

9. Fingerprint.js

Been there, done that. Getting a list of unique identifiers from browsers through a website is no easy task.

Fortunately, this awesome library produces a distinctive browser identifier without the use of cookies or any data that a malicious user can reset readily. It quickly extracts numerous properties from a web browser, which can be used separately, or to create a hash which can be used to identify a unique user.

It’s the closest replacement to device UUID on a mobile devic, that you can get for your web project. You can use it over CDN or install it using the npm package.

 
Extracting user information from the browser.

 

 

@Credits: Medium - BetterProgramming


Was this answer helpful?
Back