Chromebook Linux Apps for Web Developers!

There’s actually Linux apps for everybody now, not just Devs! Well, everybody whose Chromebook happens to be compatible, anyway. But here’s my experience of setting of my Chromebook for some Web Development with Linux apps, namely Node/NPM, SublimeText 3 and the GIMP.

History: Dual Boot and Crouton

Actually, I was already using my Chromebook for Web Development via a crouton. This is a way of running a full Linux desktop alongside the Chrome Desktop, as opposed to a dual booting between the two. By using the Crouton Integration extension, I was even able to run a full Linux desktop inside a Chrome tab!

The downside of such a setup is that is thirsty on resources. This is especially true of disk space, which is usually at a premium on a Chromebook. My current Lenovo N22 only comes with 16 Gig of flash storage to start with. Setup with a Linux crouton, I regularly was dropping below 1 Gig free for my own projects.

With native Linux apps, I was able to dump the crouton entirely and reclaim over 4Gig of that precious storage back for my own use!!!

Cutting to the chase, here’s how it looks:

Linux Apps on the ChromeOS Toolbar

Note the right hand four icons on the toolbar. They are, from left to right:

  • Terminal
  • SublimeText 3
  • Thunar File Manager
  • The GIMP

All of them native Linux apps. SublimeText is the app that’s currently open.

How To Install

First off, you have to be on the aforementioned list of supported Chromebooks. I never thought my Lenovo N22 would make it, but it did.

Powerwash (optional)

For crouton to work, your Chromebook need to be in Developer Mode. This is not true of native Linux apps. So unless you have some other need to stay in Developer Mode, you may as well get rid of it. This will free you of having to hit Ctrl->D whenever you boot up, and avoid the annoying beep you get when you didn’t do it quick enough. 😉

To get out of Developer Mode, you’ll need to Powerwash your Chromebook. Be aware that this step will wipe all data on your Chromebook, so backup anything you need to first.

The Terminal App

After I Powerwashed, I had a new Terminal icon on my toolbar at the bottom:

New Terminal app on ChromeOS Toolbar

Clicking on this new toolbar icon brought up the Settings dialog, with the Linux App settings in focus:

If you don’t see the new Terminal icon on your toolbar, then simply call up your Chromebook Settings dialog in the normal way, then scroll down until you see them. If you don’t see them, then double-check that your Chromebook is actually on the supported list for Linux apps.

Click on the Turn on button, which should bring up the Set up Linux dialog below:

Click on the Install button and the dialog should change like so:

On my Chromebook it took about 15–20 minutes to install the Linux VM. This will vary according to your Internet connection, of course.

All being well, you should now have Linux installed! Time to take a look at what we’ve actually got.

The Terminal (again!)

You should now have the Terminal icon on your toolbar (see above) if you didn’t have it before. This time, clicking on it will actually launch the Terminal app. Here’s what it looks like when running:

Linux Terminal app on ChromeOS

It’s pretty basic as these things go. There’s no tabs that I could find. But you can create new Terminal windows by right clicking on the Terminal Toolbar icon and picking New Window from the pop-up menu.


Debian 9

Typing the command lsb release -a in the Terminal app reveals that installed version of Linux is Debian 9.6

brownieboy@penguin:~$ lsb_release -a
No LSB modules are available.
Distributor ID: Debian
Description: Debian GNU/Linux 9.6 (stretch)
Release: 9.6
Codename: stretch

If you’re used to Ubuntu or Mint, then you should be okay with Debian, since the former two are actually based on Debian. There are some differences though, as you’ll see as we go through and install apps.

Get Up To Date

First , let’s get the latest versions of the packages that Debian had already installed:

sudo apt-get update && sudo apt-get upgrade;

This fetched another 17 Meg of updates for me.

NodeJS & NPM

For historical reasons, the package is called “nodejs” rather than “node” on Linux. And it’s not installed in Debian 9 by default. You can check this by issuing the command apt-cache policy nodejs in the terminal. This will show what version of the package you have installed, and also what’s the latest version of that package available in your repository. Here’s what it showed for me:

brownieboy@penguin:~$ apt-cache policy nodejs
nodejs:
Installed: (none)
Candidate: 4.8.2~dfsg-1

So nothing installed by default, and the latest version available from the Debian repos is 4.8.2, which is hopelessly out of date now. I tried installing it anyway, and found that this version didn’t even come NPM! I soon removed it.

I followed these instructions to install NodeJS from a PPA:

Their installation process uses Curl, which was already installed on Debian, but when I ran it, I got errors about some “gnupg” packages being missing. So here’s all the steps that I followed, including fixing that gnupg issue with my first line:

sudo apt-get install gnupg2
curl -sL https://deb.nodesource.com/setup_10.x -o nodesource_setup.sh
sudo bash nodesource_setup.sh
sudo apt install nodejs

These commands verified that Node and NPM were installed:

brownieboy@penguin:~$ node -v
v10.13.0
brownieboy@penguin:~$ npm -v
6.4.1

Node Permissions Errors

If you’re lucky, you’ll avoid this issue. But it always seems to get me on Linux and Mac! 😦

When I later tried to install some NPM packages globally, I ran into a number of “eaccess” permissions errors. This means that your standard login doesn’t have access the system folders to where NPM is trying to install its global packages. This is a good thing: i.e., to stop you from stuffing those folders up!!!

There’s generally two approaches to this issue: you can loosen up the permissions on those system folders, or you can configure NPM to install its global packages somewhere else. The second option is by far the safer, and I followed the instructions here to do that:

https://docs.npmjs.com/resolving-eacces-permissions-errors-when-installing-packages-globally

Here’s everything that I did to tell NPM to use a new, hidden folder, called .npm-global, inside my Home folder. Note that I used a command line text editor called Nano for part of this. It’s also not installed by default in Debian 9, so the first line here is to install it:

sudo apt-get install nano
cd ~
mkdir ~/.npm-global
npm config set prefix '~/.npm-global'
nano ~/.profile

With Nano open, I pasted in

export PATH=~/.npm-global/bin:$PATH

at the bottom the file, then hit ctrl-x to quit, and then “Y” to save when prompted.

Finally:

source ~/.profile

ensured that my terminal picked up the new path.

By listing NPM’s global files, I confirmed that it had worked:

brownieboy@penguin:~$ npm list -g --depth=0
/home/brownieboy/.npm-global/lib
└── (empty)

Yay!

Installing Yarn

Yarn is also not installed by default in Debian. I followed the instructions at this site:

https://yarnpkg.com/lang/en/docs/install/#debian-stable

Condensing those instructions gave me:

curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
sudo apt-get update && sudo apt-get install yarn

To verify that worked:

brownieboy@penguin:~$ yarn -v
1.12.3

Git and SSH (Version Control)

These were already installed for me in Debian 9. Yay!

You will, of course, need to set up SSH keys for whichever Git repositories you use: Github, Bitbucket, Gitlab etc, assuming that you wish use SSH over HTTPS for accessing these. Each repository has its own instructions for how to do this, so I won’t repeat them here.

Showing the Git Branch In Your Terminal

Having learnt to read and write at quite an early age (thanks, Mum & Dad!), I’ve always preferred the command line for Git operations over a GUI. Although Atlassian’s SourceTree is pretty good if you need a graphical client, and is cross-platform.

One essential tweak is to get the terminal to show your current Git branch. Here’s instructions for how to do that, taken from my very own blog:

For Linux, this needs to go into the ~/.profile file:

parse_git_branch() { 
git branch 2> /dev/null | sed -e '/^[^*]/d' -e 's/* \(.*\)/ (\1)/'
}
export PS1="\u@\h \W\[\033[32m\]\$(parse_git_branch)\[\033[00m\] $ "

Again, I used Nano for this (installed in a previous step, above), but any text editor will do.

That’s all the command line packages and tweaking that I needed. Now for some Linux GUI apps!

SublimeText (Code Editor)

Yes, I know VSCode is all the rage with the script kiddies these days, but I found it infuriatingly slow in operation when I last tried it on my Core i5 work PC; a problem that is likely to exacerbated on a low spec Chromebook. So, I’m sticking with Sublime for now.

To install SublimeText, I followed the guide here

http://tipsonubuntu.com/2017/05/30/install-sublime-text-3-ubuntu-16-04-official-way/

This guide relies on the wget package, which wasn’t installed for me. So In install that on my first line below:

sudo apt-get install wget
wget -qO - https://download.sublimetext.com/sublimehq-pub.gpg | sudo apt-key add -
echo "deb https://download.sublimetext.com/ apt/stable/" | sudo tee /etc/apt/sources.list.d/sublime-text.list
sudo apt-get update
sudo apt-get install sublime-text

The GIMP (Image Editor)

That apt-cache policy command showed that the version of Gimp in the repositories is also quite an old one:

brownieboy@penguin ~ $ apt-cache policy gimp
gimp:
Installed: (none)
Candidate: 2.8.18-1+deb9u1

However, when I followed instructions below to try and install a later version, I ran into problems:

These instructions involved using the add-app-repository command, which is one of the places where you’ll discover that Ubuntu and Debian are not the same thing! Thankfully, we can add this Ubuntu command to Debian by installing the software-properties-common package. The full commands to install Gimp are:

sudo apt-get install software-properties-common
sudo add-apt-repository ppa:otto-kesselgulasch/gimp
sudo apt-get-update && sudo apt-get-install gimp

Unfortunately, installing GIMP itself (the last line above) gave me a boat load of errors about missing packages. I’m not sure why this was, but to be fair to the author, these instructions are for Ubuntu, not Debian.

In the end, I reverted these command and went with the stock, older version of GIMP that’s in the standard Debian repository.

A Tale of Two File Systems

For file management, the slightly schizophrenic nature of the whole ChromeOS vs Linux arrangement becomes rather evident. Google doesn’t seem quite to know how to resolve it at the moment, but then this all a work in progress.

The stock ChromeOS File Manager now sports a Linux Files folder, which actually maps to the /home/loginname folder on the Linux side. But that folder (and any of its sub-folders) is the only folder on the Linux side to which the ChromeOS File Manager does have access.

Chrome File Manager

Similarly, your Linux apps have no access to the “normal” ChromeOS folders, such as your My files/Downloads folder. For example, the Downloads folder is where the screenshots that I took for this article were saved. Although I was able to right-click on a screen shot and then pick “Open with GNU Image Manipulation Program” (i.e. the GIMP) from the pop-up menu, when I tried it I was told that I first to copy the file to the Linux Files folder and then open it in GIMP from there!! (That does work, by the way.)

To get further access to folders on the Linux side, I installed the Thunar File Manager from the stock Debian repository:

sudo apt-get install thunar

This gave me visibility on the root file system, although you get the same from the Terminal app too. Careful what you do with this access!

Thunar File Manager

Just look at that lovely 4.9 Gig of available space! Honestly, that’s a big deal on a standard Chromebook.

Performance

Generally, snappy, but there’s a catch.

The Linux apps rely on a VM/compatibility layer called Crostini. If Crostini isn’t running at any given time, then the next time you start off a Linux App then you’re going to have to wait 30–60 seconds for Crostini to start up first. After that, any subsequent Linux apps that you may launch will start up straight away.

Note: this Crostini delay even applies to accessing the new Linux Files folder in the stock ChromeOS File Manager.