There are tools that can help you accomplish things by increasing your agency and some of the tools you already use have a lot of potential that you might not know.

In this post I’m going to talk about some tools that can help you get things done faster and some tricks and creative ways to accomplish things.

Shortcuts & Tricks

Go to File

You can jump to a file really quickly with:

  • Windows: Ctrl + P
  • MAC: ⌘ + P
Image for post

Rename references (F2)

Image for post

References

  • Alt+F12 Peek Definition
  • F12 Go to Definition
  • Shift+F12 Show References
Image for post

Quick Fix

  • Ctrl+. Quick Fix
Image for post

Sort Lines Ascending

Sort Lines Ascending: allows you to sort lines

— You can use this to sort a list of names

Image for post

— You can also use it to sort CSS styles

Image for post

Multi-cursor

Allows you to selected multiple lines at the same time.

Shortcut:

  • Windows: Ctrl + Alt +…

Image for post

Here are things that you should not do, things that you should do and things that you should realize about yourself.

Fixing Bugs

When fixing bugs, fix the disease not the symptoms.

Symptomatic treatment, supportive care, or supportive therapy is any medical therapy of a disease that only affects its symptoms, not the underlying cause.
Symptomatic_treatment (wiki)

When trying to fix something, don’t just try to make it work. Putting band-aids on an infected wound isn’t going to fix it. There are specific things you have to do to treat that wound. …


Image for post

All JavaScript is TypeScript. If you have been coding in JavaScript you already know how to code in TypeScript.

Any new features coming to JavaScript will be supported by TypeScript as long as the features make into Stage 3, which is like the “Release Candidate”, so you’re going to get access to features before they’re released.

Image for post

For example, the proposal for optional chaining is now in Stage 4 and I tested using TypeScript version 3.9.5. I can now use something that’s not yet in JavaScript Today.

Image for post

Also, you can combine TypeScript types with Babel transpiler, which means you can use anything that Babel supports (which I think is virtually anything).


Image for post

Code should be as easy to read as a book. If you spend more than 5 seconds trying to understand a function it might be already doing more than it should.

In the book Clean Code: A Handbook of Agile Software Craftsmanship by Robert C. Martin the author talks about principles and techniques that works in practice, as opposed to what might work in theory.

It was written a long time ago, but a lot of it is still very relevant. …


github.com/brunolm/react-how-to is a repository that shows how to do things by example.

Each Pull Request on this repository is a complete guide on how to do something, for example if you want to add redux to your project you can just check this Pull Request and see some instructions and all changes required.

If you want to setup tests check this Pull Request.

Better than just reading some instructions you get a full example and a working project as a guide.

guide

Enjoy!


I checked a diff between a project created with Angular 4 and 5 CLI. There were no changes on the generated project structure.

So to upgrade you just need to install new versions of packages.

You can see which packages to update in this pull request.


I found a challenge called “The Bomberman Game” on HackerRank and I found it pretty interesting.

It boils down to something like this:

The Bomberman Game

Rules

  • Bombs will explode in 3 seconds
  • When a bomb explodes it clears its tile and 1 tile up, down, left, right
  • Bombs that are about to go off explode at the same time
  • There are no chain reactions
  • If a bomb explodes next to another that is not about to go off then the nearby bomb is just cleared

Iteration

  1. Bomberman plants some bombs (you’re given an input with the map)
  2. A second passes
  3. A second passes. Bomberman plants bombs on all empty…


TL;DR; Workflowy is a (free) website where you can take notes and doesn’t matter how big it gets it is still easy to manage. Check it out https://workflowy.com/invite/35df8d82.lnx

Workflowy is a (free) website where you can take notes on lists. It is being really useful for me (and every co-worker) because we can take notes of steps we take to do something then when we need to use it again we can just look at my notes instead of having to figure it all out again.

We can also take notes of commands we run so if we need something crazy again we don’t have to figure it out, it’s already there. …


Dependency Properties allows you to extend a functionality, from MSDN:

A dependency property provides functionality that extends the functionality of a property as opposed to a property that is backed by a field.

It is used to create bindable properties on objects deriving from DependencyObject, for example in controls. It is used all across WPF.

You can use it as well to create your own bindable properties.

For example:

2015-31-13 05-31-24-043
<local:ExtendedButton DisplayInRed="True"
Content="I'm red" />
<local:ExtendedButton DisplayInRed="False"
Content="I'm NOT red" />

<local:ExtendedButton DisplayInRed="{Binding TrueValue}"
Content="I'm red" />

<Separator />

<local:ExtendedButton2 DisplayInRed="True"
Content="I'm red" />
<local:ExtendedButton2 DisplayInRed="False"
Content="I'm NOT red" />

<!--Error, cannot bind-->
<!--<local:ExtendedButton2 …


TreeView control allows you to create an hierarchical structure. You can tell it to bind elements and also how it should bind the children, grandchildren and so on.

One simple example is as follows:

<TreeView>
<TreeViewItem Header="Character 1">
<TreeViewItem Header="Character 1's child">
<TreeViewItem Header="Character 1's child's child"/>
</TreeViewItem>
<TreeViewItem Header="12345"/>
</TreeViewItem>
<TreeViewItem Header="Another char">
<TreeViewItem Header="Char Bla"/>
<TreeViewItem Header="Char Foo"/>
<TreeViewItem Header="98765"/>
</TreeViewItem>
</TreeView>

To bind in a TreeView you can have a ObservableCollection with your items and in the object you are binding you can have another ObservableCollection which will be a collection with all the child nodes. …

Bruno Leonardo Michels

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store