Get a Fully Functioning Terminal in Google Chrome Developer Tools

Nov 11, 2013 - 1 Comment

Just about every web developer or designer is familiar with Google Chrome’s Developer Tools, which allows for easy browser based debugging, tweaking, and adjusting of web pages and web applications. Those who live in web browsers and text editors know just how useful DevTools is, and with the help of a third party Chrome extension you can make Chrome an even better development tool by adding a Terminal to the existing array of developer tools. Yes, a terminal like Terminal.app, for super quick command line tweaks and adjustments, without ever leaving the Chrome browser.

Terminal in Google Chrome Dev Tools

Installing Terminal in Chrome Developer Tools is extremely easy for Mac users, it’s just a matter of downloading a free Chrome extension:

Users who are not running OS X on their development machines but still want to install the Terminal in their Chrome browser can do so manually following the instructions using node.js on the developers page here. It’s still pretty easy, just not the one-click install that comes with adding a Chrome extension.

Once installed, accessing the Terminal from Developer Tools is not much different than adjusting page elements, watching the error console, or viewing page source, it’s just a matter of selecting the newly accessible Terminal tab.

  • Right-click anywhere on a web page and choose “Inspect Element”, then choose the “Terminal” tab
  • Or use a keyboard shortcut: Control+Shift+i to summon Dev Tools, then select the Terminal tab

The animated GIF from the plugins developer below demonstrates simple usage:

Terminal in Google Chrome Developer Tools

Yes, this is a fully functioning Terminal, and you can tail logs, curl headers, use nano or vi to edit code, update a package, recompile something, watch Star Wars and play Tetris, whatever particular command line magic that is required for your development work.

Important security note: All data used and accessed from DevTools Terminal is transmitted in plain text. Thus, if you plan on using this in a production environment, for ssh, sftp, mysql, or to transmit passwords or any sensitive data in any way, always use https. According to the developer, passwords are not stored in the client, but you will still want to take appropriate security precautions to avoid sending out anything important.

Enjoy this tip? Subscribe to the OSXDaily newsletter to get more of our great Apple tips, tricks, and important news delivered to your inbox! Enter your email address below:

Related articles:

Posted by: Paul Horowitz in Command Line, Mac OS X, Tips & Tricks

One Comment

» Comments RSS Feed

  1. HC says:

    A nice complement for this terminal extension is Tincr.

    You can download it from http://tin.cr

    It reloads automatically the file you’ve modified.

Leave a Reply

 

Shop for Apple & Mac Deals on Amazon.com

Subscribe to OSXDaily

Subscribe to RSS Subscribe to Twitter Feed Follow on Facebook Subscribe to eMail Updates