Looking for top React Native talents? They are just a few clicks away.

Boost your git and code writing skills with these simple tricks! [React Native developer’s perspective]

Aug 10, 20202 min read

Vitalii Danylov

Senior Frontend Developer at Ideamotive.

Boost your git and code writing skills with these simple tricks! [React Native developer’s perspective]

Today I’m going to share with you my tool stack and its setup that I’m using on a daily basis which can be used to increase your code writing and git skills. 

 

I’ll put this topic in the context of React Native development, but all of the things I will mention are more or less universal and you can implement them in your other projects, not only React Native-based.Vita

 

I hope you will find something useful here!

Oh-My-Zsh

 

I've been using Oh-My-Zsh for a quite long time and it saves me A TON of time. 

 

This is a plugin framework for zsh that has a huge community and plugin base. If you are a customization nerd like me you will find an amazing library of themes and if you are pretty fluent in the terminal and want to speed up a bit it will help you for sure :)

 

Let’s consider the most used commands and how it looks. After the installation (which is described here) you’ll be able to do some serious magic:

 

Navigation

 

Zsh by default has cd (change directory command), so you don't have to type it each time, just type folders name:

 

boost your code

 

 

It will be pretty easy to navigate to the previous location comparing to cd syntax:

 

boost your code 

I think you get the point :)

 

I hope I don’t need to remind you about the `Tab` key which can autocomplete your typing in the terminal. 

 

To check the whole list of aliases just type:

 

boost your code

 

Just compare how easily you can navigate through nested directories:

 

boost your code

Git

 

Another thing to mention is how convenient is git and git flow with Oh-My-Zsh. You can get access to git commands just typing `g` letter and combining it by `&&` sign. Just take a look at this example:

 

boost your code

 

Here are a few commands that will come in handy: 

  • gaa equal to git add --all will add all changes in the working directory to the staging area.
  • gcmsg equal to git commit -m will commit all staging changes to with provided message 
  • gp equal to git push will push all committed changes to remote.

 

Remember the annoying message when you were trying to push your newly created branch?

boost your code

 

Just type: 

 

gpsup - it’s equivalent to the above hint (it will set upstream to your current branch and push it to remote).

 

But my all-time-favorite command is: gco (which stands for git checkout)

 

You can do so much with it! For example:

 

`gcb branch_name` - create branch and checkout to it

`gco -` - switch to previous branch (this one I like the most)

 

Of course, these commands will only be useful if you have a solid understanding of git basics. If not, take a look at a great book with all explanations.

VScode

 

If you are a VScode user you probably know about the vast diversity of extensions that are available. But which ones are actually worth going with?

 

On a daily basis, I use the most popular snippet pack for ReactJs/React Native and Redux, where you can find almost all aliases needed for code in React.

 

But in today’s article, I would like to mention another tool. And a super handy one!

 

For the navigation through the code, I use jumpy++. Shortly speaking, it gives you the flexibility to easily change the cursor position without much keyboard interaction.

 

ezgif.com-optimize

 

I used its ascendant before and the main reason why I’ve switched is customization. In jumpy++, you can change the font, size, color, etc. of displayed hints (For example, for me they were a bit too small, so I made them bigger :)).

 

I hope you’ve learned something new and my small tips will boost up your navigation and code writing game. Of course, all these plugins won't make you a brilliant programmer, but in the longer perspective will save you tons of time.  The most difficult part is to integrate all these shortcuts into your development flow. A good piece of advice here is to use a printed version of cheat sheets in front of you and this process will be less painful. 

 

Thank you and happy coding!

Vitalii Danylov

Vitalii is a veteran frontend developer and mobile developer (with the special <3 for React Native) who likes to explore new technologies, test new tools and discover new approaches.

View all author posts

Looking for a specific type of software development service?

Take your business to the hypergrowth phase.

Work with React Native experts from Ideamotive's talent network.