Forem: Yet Another Developer

Customise Your Terminal Like You Deserve

Yet Another Developer — Thu, 12 May 2022 10:51:12 +0000

If You Use Terminal for any reason then you might find find it boring and awful. In Ubuntu the default shell is bash which is OK to do your every work but you can be much productive with the help of a good customised terminal. Follow along this blog and your terminal will be like This.

If You Look At the Image, this Terminal is like the one you always wanted. This is not just only visually appealing but can boost your productivity much more.

It has many features, some of them are listed here

Colourful Prompt with Icons
Many Themes to choose from
Customiseable shorthand commands
Autosuggestion through your command history
Selectable prompt for everything
And Much More!

With This you will also learn some quick terminal tricks!

So Lets get started.

The Shell

We are going to use the zsh shell with "Oh My ZSH!" Configuration. It is available for WSL (Windows Subsystem for Linux) and Linux. It is the default shell for Mac OS. You Can also install it on default windows but that is little bit tricky so I will not cover it here. (May be I will do in Future)

Installation on Ubuntu

(Same command on any other non-ubuntu distro, except the package manager)

To Install zsh run, Open Up your terminal and type these commands:

# First Install/update some required packages
sudo apt update  # for ubuntu based distos only
sudo apt install curl git # needed for installation
sudo apt install zsh  # install the actual shell

Now you need to run the installation script for "Oh My ZSH!"

# run this in your linux distro/ MacOS
sh -c "$(curl -fsSL https://raw.github.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"

It will setup the shell for you. It will ask if you want to change the default terminal. Just Enter your password and continue.

If you couldn't change shell

If for some reason you can't change your shell, follow these steps:

where zsh

You May Find Multiple paths like /usr/bin/zsh and /bin/zsh, you can use anyone them. Then run

chsh

Enter your password, then enter the path you got previously.

Now once your zsh is setup, Reboot your PC so that the shell can change in next boot up.

Installing A Theme

150 themes come preinstalled with zsh. You can check them here. You May Find Your Theme there but I will show you one of the best theme.

Installing Powerlevel10k theme

Installing Required Font

You Need to install some font to make the icons work. So download and install these

After Download, Open Your Files and Double Click to Install them. Then Change Your Terminal Font. (Instructions)

Change Your Theme

Now You need to copy the Powerlevel10k guthub repo first. Run

git clone --depth=1 https://github.com/romkatv/powerlevel10k.git ${ZSH_CUSTOM:-$HOME/.oh-my-zsh/custom}/themes/powerlevel10k

After that Open your home folder and open .zshrc file in an text editor. In that file you would see and entry called ZSH_THEME, add an # at beginning of that line and paste this line below that.

ZSH_THEME="powerlevel10k/powerlevel10k"

Now Save the file and Run

exec zsh

Now it will open a menu asking some questions.

Customising Your Terminal

You will get the p10k prompt after changing your theme. If you want change your settings later then you would need to run

p10k configure

(If it says p10k not found then change your theme and try again)

You Firstly It will ask you some questions to assure your font is correct.

(If you can't see the correct icons try checking your terminal font settings.)

If you can see the correct icons then press y for 3-4 questions .

Now it will ask about the style choice of your terminal. Choose Whatever you like.

I Like the Classic so i will press 2

Choose Everything According to your need.

Finally It will ask you about Instant Prompt.

Choose versbose by pressing 1. It will write settings automatically.

Also say yes in rewrite prompt if you are re-configuring.

Now You Have a beautiful terminal like mine.

Quick Terminal Shorthand Commands

You May want to have shorthand commands for some really long commands. You can make your custom commands too.

Using Alias Commands

If You Have a command which doesn't require arguments in between then you may use alias.

Open Your .zshrc file in text editor. Then Add This Line at last and save.

alias cls="clear"

I am used to cls command in windows so I use it in linux too.

Now restart your terminal or type exec zsh, then type cls and your terminal will be cleared! You can add as many alias as you want. Like add

alias la="ls -A"

Now using la you can list your hidden files too.

Using Commands with arguments

When I use nodejs, I feel that npm run dev is a very long command. So What I Can do is added this to my .zshrc

nr() {
        npm run $1;
}

Now I Can use nr dev instead. You Can Learn More about these here.

You Can Use these as you want.

ZSH Autosuggestion

You can Install Many Plugins for ZSH. Here is the List of pre-installed plugins.
git plugin is preconfigured as you can see here

But Now I am going to install the autosuggestion plugin. Install it through git by running

git clone https://github.com/zsh-users/zsh-autosuggestions ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-autosuggestions

Then find the line plugins=(git) and change that line like this

plugins=(
         git
         zsh-autosuggestions
)

Now restart (exec zsh) and you will have auto suggestions.

Hope You Liked My Post, If you did then please comment your feedback.

Till then Bye. 👋

Some Unknown Operators in JavaScript

Yet Another Developer — Sun, 08 May 2022 13:23:06 +0000

Introduction to Javascript Operators

Javascript is a Very Popular Language due to its beauty and ease of use. It is easy to get started with javascript. But it is very difficult to master the language. For Example You don't know all of the JS operators. Do you?

Types of Operators

There are many types of operators in Javascript.
According to MDN Web Docs Those are:

Assignment operators
Comparison operators
Arithmetic operators
Bitwise operators
Logical operators
String operators
Conditional/Ternary operator
Comma operator
Unary operators
Relational operators

Now you know Most of them, So I will tell you about the most unknown operators.

1. Binary Shift Operators

If You have ever coded in C/C++ then you are likely you have used or at least heard about binary shift operators.

Binary Shift Operators are used while dealing with Binary Numbering System. May be that is the reason you didn't knew about existence of these operators. All

These Operators also exists in Javascript. These are Left Shift (<<), Sign-propagating Right Shift (>>) and Zero-fill Right Shift (>>>) Operators in JS.

Left Shift (`<<`)

Lets Take A Number Like 212 for Example.

Javascript stores numbers in 64 bits.
Bitwise Operators use 32 bits.
😅 Maybe Taking 32 Bits is Not An Good Idea. So Lets Just Work With 16 Bits

212 = 0000 0000 1101 0100

Now if We Do 212 << 1 Then it will shift the 11010100 towards left by an adding an 0 at last. So It Will be 0000 0001 1010 1000 which is 424.

console.log(212 << 1); //Prints 424
console.log(123 << 2); //It Prints 492
/* You Can Try it Now in Your Browser's Developer Console */

Sign-propagating Right Shift (`>>`)

It works same as the previous one but it shifts the bits towards right.

let a = 212; // 212 = 0000 0000 1101 0100
a = a >> 1; // 0000 0000 0110 1010 [106]
console.log(a); // 106
console.log(343 >> 2); //85 works like this too.
console.log(-132 >> 2); //-33
/*it keeps the sign, for which it is called "sign-propagating"*/

Zero-fill Right Shift (`>>`)

It is same as Sign-propagating Right Shift only difference being that it also shifts the sign bit. For that reason it works same in positive number but gives different result in negative numbers.

console.log(343 >>> 2); //85 works same
console.log(-132 >>> 2); //1073741791 it doesn't work same as >>

You Can Read More About it at MDN Docs.

2. Binary Bitwise Operators

Again These Operator is used in Binary Calculations. We Have Bitwise AND (&), Bitwise OR (|) and Bitwise XOR (^).

These all calculates the bits at each place of the given number.

0000 0001 0011 0100
0000 0100 0010 1001

The Top Digit and The Bottom digit at same place is taken. And Calculated According to the Operator. These follows the boolean algebra rules.

Like For AND (&)

0 & 0 = 0
1 & 0 = 0
0 & 1 = 0
1 & 1 = 1

For OR (|)

0 | 0 = 0
1 | 0 = 1
0 | 1 = 1
1 | 1 = 1

For XOR (^)

0 ^ 0 = 0
1 ^ 0 = 1
0 ^ 1 = 1
1 ^ 1 = 0

After These Calculations we get :

let a = 15; //1111
let b = 9; //1001
console.log(a & b); // 1111 & 1001 = 1001 (9)
console.log(a | b); // 1111 | 1001 = 1111 (15)
console.log(a ^ b); // 1111 ^ 1001 = 0110 (6)

3. Bitwise Not Operator

Bitwise Not Operator (~) Changes the 1 to 0 and vice-versa for any given number. It Changes all 32 bits.

let a = 12; //1100
console.log(~a); //(-13)
/*
You Expected 1100 to be 0011 but after altering all 32 bits we get
1111 1111 ... 1111 0011
which is -13
*/

Conclusion

All Of These Unknown Operators come From Binary System. So It is a good excuse to learn binary at this moment. Because binary is the thing that makes the computers possible.

Hope You Liked My First Blog Post.

Will See You Later.

Bye 👋