Chrome Killed the Terminal Star

chrome_killed_cli_header

By Krasimir Tsonev

I’m not using the terminal anymore. It used to be open all the time, especially when working with Node.js. Nowadays, instead I’m just using Chrome. Yes, Google’s browser. How? There is an extension called Yez! that connects to a Node.js module via web socket. It executes shell commands and returns the result. It even works under Windows. In thi article, I’ll explain why I built the project, how it works and how to get started using it.

The Motivation

There were several reasons behind the development of the extension:

  • If you develop Node.js applications, you’ll frequently switch between the terminal and the browser. It can get really annoying. You have to do it all the time, for every little change. So, moving the shell into the browser seemed like a logical step.
  • If you don’t like to write shell scripts, this extension is perfect for you. Developing a terminal in JavaScript allows you to produce better automation.
  • Chrome extensions are constructed with the usual web technologies – JavaScript, HTML and CSS. This means that the power to build the tool fits perfectly in our workflow.

Is it really a terminal?

Yes, it is. What it does is proxy shell commands. They are still executed in the same place, with the difference being that it is not the terminal that runs them but a Node.js process. The Yez! module uses spawn to send the command’s output directly to the browser once it appears. It doesn’t wait for the operation to end before showing something, as happens with exec. (more details about managing child processes in Node.js can be found here). Check out the following image which illustrates how everything works:

yez_01

As you can see, it allows you to navigate through the directories and execute commands. The extension checks if the current directory is a valid Git repository and, if it is, it shows the current branch and if there are any changed files.

It’s Also a Task Runner

When we have an instrument that runs shell commands, it also makes sense to provide the ability to execute tasks that run several commands at once. This isn’t groundbreaking, but the really valuable difference here is that we are doing this from a browser. Also, thanks to Google, we have access to APIs for programmatically controlling the browser.

The following animated gif shows how we create a task that runs Jasmine tests on a project and performs a search in GitHub.

yez_02

How to Get Started

There are two main pieces to get this working, a Node.js module and a Chrome extension. Here’s the necessary steps:

  • Install the Yez! module by running npm install -g yez or npm install -g https://registry.npmjs.org/yez/-/yez-1.0.5.tgz, if the first command doesn’t work. If you still have problems installing the module check out this thread.
  • Run yez via your console
  • Open Chrome and install the extension from here
  • Open Chrome’s DevTools and find the “Yez!” tab

Contributing

This project is open source, so you can feel free to report issues or make pull requests at https://github.com/krasimir/yez.

The Truth

Of course, I’m still using the good old terminal too. There are some things that simply could not be achieved with Node.js, like, for example, establishing an SSH connection to a server or complex piping of commands. However, for most regular tasks I prefer to stick with the extension. It has helpful featureslike name autocompletion for directories and a handful of keyboard shortcuts. I’m also planning on providing the ability to register aliases. In other words, all sorts of small goodies that will boost productivity.

This articl was originally published at http://krasimirtsonev.com/blog/article/Sorry-Chrome-killed-the-terminal

Modern Web Newsletter

Subscribe to receive the Modern Web tutorials, sent out every second Wednesday.

  • http://n/a mscdex

    “There are some things that simply could not be achieved with Node.js, like, for example, establishing an SSH connection to a server…”

    Huh? https://github.com/mscdex/ssh2

  • daz

    So how do you install the Yez module in windows?

Top