← Back to posts

Tools I use for work

·Read in Portuguese

As a developer, you probably use a set of tools in your day-to-day work. In this post, I want to share a summary of the tools I use the most and that help me a lot.

Visual Studio Code

https://code.visualstudio.com/

A while back, I wasn't much of a fan of using Microsoft tooling (I had a silly bias about it — to me only the Office suite was any good, how embarrassing, right!). But after I started using VS Code, everything changed. These days I can't picture myself coding in any other editor, even knowing there are plenty of others out there. (For me, it's great.)

VS Code has a lot of cool features (that would be a whole other post), but for now I'll just focus on showing the setup I use.

Theme

I use the Nord theme, which is based on this palette. Since I spend a lot of time staring at the screen, this theme's color combination doesn't strain my eyes.

Extensions

Auto Rename Tag

This extension helps a lot when writing code in markup languages (HTML/XML) and you need to rename a tag.

Bracket Pair Colorizer

This extension shows matching pairs of brackets in different colors, making it much easier to identify a section of code that's inside a pair of brackets, especially as the code gets longer.

ESLint

I believe code standardization is quite important in projects, so this extension helps keep my code consistent, following the rules configured for JavaScript code. For more info on this, check out the official documentation.

vscode-icons

I'm also a pretty visual person, so I like the little extras. With this extension, the editor shows an icon related to each file type in the project. It doesn't change anything functionally, but it looks nice.

Reactjs code snippets

To boost productivity when writing applications with React JS, this extension is a huge help. VS Code has several extensions with ready-made snippets for other languages too.

GitLens

It's good to know the main Git commands, but for some of them it's much more productive (in my opinion) to use a visual tool. Since productivity matters to me too, I use this extension that lets you do a lot with Git visually.

Settings

I'll put here the settings I use in my VS Code — feel free to copy all of it or just the parts that make sense to you.

Google Chrome extensions

React Developer Tools

Applications built with React render components as HTML elements, so when developing a React app you sometimes need to inspect the components used on a given page. The React Developer Tools extension helps a lot with that.

JSON Viewer

API responses are usually in JSON format. When testing an API directly in the browser, this extension helps with viewing the response.

Octotree

This extension is amazing — I discovered it recently thanks to the GoStack course by Rocketseat. You know when you're browsing a repository on GitHub, navigating through folders or files, and it takes so long that it'd be better to just clone the repo locally? With this extension, that's no longer necessary.

Apps / Tools

Notion

I used to use Evernote, but these days I use Notion to organize my work and ideas. But Notion isn't just a "notes" tool — it's quite powerful and functional, letting you do almost everything you need in one place, and it encourages teamwork since you can share it with other people.

I personally use it for (To-Dos, Notes, Roadmap, Kanban)

Devdocs.io

As a developer, I read a lot of documentation to solve day-to-day problems. Devdocs is a "repository" that gathers documentation for practically every language or technology used out there. And for documentation not available on the platform, there's a link that takes you to the official docs.

Well, those are basically the main tools I use. If you have a suggestion or know some other cool tool, mention it in the comments too.

If you have questions, compliments, or suggestions, leave a comment. If you enjoyed the content, share it with your friends.

See you next time!

Tools I use for work · Programming and Design | Gabriel Asakawa