Tools I wish I knew from the start

dvddpl

Davide de Paolis

Posted on February 4, 2019

Tools I wish I knew from the start

In the career of a software developer it happens many time that you have to start from scratch in a new technology, because the one you are expert in became obsolete, because you joined a new cool project or simply because in your company there is no one left to fix a bug on an old legacy project.
Whatever the reason, what I always found most challenging and time-consuming besides the language specific skills, syntax and stuff, was to get to know the ecosystem of a particular tech stack. Of course one can quickly jot down some lines of code on notepad and be able to compile/bundle and run them without too many troubles. But when it comes to development speed and effective debugging then it is necessary to know and use lots of tools which make us productive and proficient.

I have always been obsessed in finding ways to avoid tedious repetitive tasks and when I ultimately I realize I cannot automate them, I try at least to make my life simpler and become faster at it.
One of the many reasons why I like pair programming or simply passing by to some colleague to discuss some implementation details is that inevitably I notice something and it´s "hey hey hey.. what was that shortcut, what is that tool that you just used?!" and that´s the epiphany of the day.

sudden realization

And this is why i never understood those colleagues that for days/months/years sticked to their known comfortable way of doing things, no matter how slow and tedious it was (like having to click with the mouse 10 times in Tortoise to commit a file, or dropping console.logs everywhere instead of configuring VisualStudio to run a proper debugger); and whenever I suggested a shortcut or a tool the answer was: " oh but that´s too complicated, it takes too long to set up, I don´t have time to do it. I just need to quickly fix this thing." and there they are, over and over again manually doing things that take ages, are boring and seriously error-prone.

Can´t afford to improve, we are too busy

In the beginning, it can be a simple shortcut like 'Ctrl + Shift + ↑/↓' to move
a line of code, then it builds up and you find yourself proxying the traffic of the web application in production and using breakpoints to debug your lambda functions.

As my first post on DEV.TO, I want to share some tools I really hoped were shown to me when I started coding and some library and add-ons I started using almost on a daily basis since I switched to the FullStack Javascript Serverless world around 2 years and a half ago plus some other tools that really make the difference in terms of efficiency.


Node and Javascript

dev-hints and dev-docs
Because of course each Library, Language and Framework has its - good or lacking - documentation page, but having one place where to look is always better and faster.
Husky Git hooks are scripts that run automatically every time a particular event occurs in a Git repository. Main drawback of git hooks is that they cannot be version controlled ( they reside in your local git folder), they are mostly shell or Perl and it´s not so easy to share them with your team or enforce their usage. With Husky, you can write some js that is committed along with your project and will be executed as git hooks. Husky will take care of binding your script to whatever git action you like.
XO One of the many javascript linters. The main reason for choice is that output is beautiful, configuration very easy. (Linters analyzes your code searching for potential programmatic and stylistic errors. Detecting ( and fixing ) issues that range from indentation to semicolon, unused imports or typos it helps prevent compile errors and bugs and enforcing strict and readable code it guarantees a uniform code style.
AVA One of the many testing frameworks, but minimal and fast. The main reason for choice is that it runs each test in a separate Node process, therefore tests can run concurrently and is able to run tests concurrently and with an isolated environment.
AVA test framework
Standard Changelog Prefix all your commits following the specification of Conventional commits and whenever you will publish your NPM package you will get a ChangeLog automatically generated.
env-cmd Handling environment variables and builds for different stages ( dev - QA - production etc) can be hard and gets messy quickly. With this handy module, you can execute scripts in your package.json using an environment from an env file.
React Dev Tools and Redux Dev Tools If you are building React Apps you cannot not use these tools to inspect the components and the state changes.

Backend

Postman Postman IS THE APP if you are developing or testing a RESTful API. Over the years they added more and more features like mock servers and test collection and I probably use 20% of its feature. But it is super easy to configure your GET POST UPDATE requests - with templates for different environments and quickly check the response. Without having to use curl or filling manually the form of your web app.
Postman
Charles Charles is a Web Proxy that will record and display all of the data that is sent and received. You can use it to view XML and JSON requests and responses, to throttle bandwidth and simulate slower Internet connections, to set breakpoints and intercept and edit request and responses. ( this is one of the best features because it´s very handy to test fixes or reproduce bugs in the communication between server and client. just intercept the response that crashes the client, modify it and see your client work like a charm, then you are sure how you want your server to respond and can safely make your changes).
Switcheroo Charles could be overkill for most simple tasks, but it can happen often that you want to redirect an API call from your app in production to the API you are running locally so that you can debug it or you simply want to check a different image or CSS loaded by a web page. In that case, this chrome extension does its job very well and really in a couple of clicks.
Serverless Framework Seriously, if you are starting with serverless architecture don´t even think of building your apps using the UI Console. Dive straight into Infrastructure As Code. Describe all the components of your serverless stack, version control it, and deploy without hassles.
Dbeaver Free and open source universal database tool. I use it to check the schema and content of the tables and to test the SQL queries my Lambdas will execute.
Robo 3T formerly Robomongo Since Dbeaver supports NOSQL only in the Enterprise Edition whenever I have to work with NoSQL and MongoDB I use Robomongo. Nice and intuitive.

Productivity

Trello Stop using post it and to-do lists to organize your tasks. Probably at work you are already using some Ticketing System and Collaboration Tool to deal with your feature and bugs development during the sprint. I personally use Trello at work and at home to remind myself of what I have to do in a Kanban style.
trello board of my last vacation
Pomodoro There are plenty of chrome extensions for the Pomodoro Technique. Pick one, Organize your time, define your tasks, focus for a short period of time and take a break. No email - phone - facebook checking until the timer runs out!
Jumpcut We all copypaste. jumpcut allows you to keep a history of up to 99 clipboards.

Spectacle Whether you have a small screen laptop or a 3 Monitor Workstation, being able to move and resize your windows easily and fast is paramount.
MacPass Having simple passwords is bad. Having the same password for many services and account is very bad. Having complex and different password everywhere is impossible. Use a tool like this to generate and store the password for all your accounts.
mindmaps
MindMup Every time I am brainstorming, or I want to put order in my ideas I draw a mind map diagram. Be it on paper or on screen, it is a great way to follow your train of thought and then reorganize the concepts.
Draw.io Another tool for diagrams, but in this case it´s about UML, Flowcharts, Mockups and AWS architecture.

Miscellaneous

oh my zsh autocompletion of git commands, easy navigation to folder and files, display of all the scripts in your package.json. ohmyz.sh makes the terminal easier and fun.
Source tree If you really can´t help but having a visual representation of your git repo, I find Source Tree very neat ( though I use it only when I wasn´t disciplined and I need to check the diffs among many files and reorganize my changes for atomic commits.
Json Viewer This plugin simply makes the JSON opened in your browser more readable.

jq JQ allows you to pretty print, filter, map your JSON files in a very easy fashion

curl 'https://api.github.com/repos/stedolan/jq/commits?per_page=5' | jq '.[0]'
Enter fullscreen mode Exit fullscreen mode

for examples pipes the JSON returned by the API and returns the first element of the list.


It´s of course not an exhaustive list and it is to some extent opinionated, I have not researched and compared among alternatives and similar tools. (and I am ready - and glad - to switch to whatever I might find out and try out tomorrow)

In the end, it does not really matter. What matters is being flexible and productive and whatever tool we decide to use it must allow us to boost our productivity, speed-up boring processes and let us focus on what we like and do best - solve problems and implement solutions.

💖 💪 🙅 🚩
dvddpl
Davide de Paolis

Posted on February 4, 2019

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

Tools I wish I knew from the start
beginners Tools I wish I knew from the start

February 4, 2019