(Horrible Howtos)Using a VPS with a Chromebook

Disclaimer: if you don't like VIM, terminal, or Node.js this is probably not your jam

image!

Getting stuff stolen sucks, getting expensive laptops stolen sucks the most......That was the logic in a recent conversation we had at Iced Dev. So, to combat getting your laptop stolen, the resolution was to just carry around a 150-250 dollar Chromebook.

Creating a development machine that is efficient and easy to use is NOT as easy at it sounds. It takes a lot of architecture to make a cost efficient development atmosphere without sacrificing ease of use.

Here is why we decided use a Chromebook:

  • It's built for the internet, and its browser is supreme for development.
  • It has all the necessary tools for development.
  • It encourages and forces and emphasis on cloud computing, where it's a LOT harder to lose your work.
  • Lots of styles
  • It's $150 bucks man!

Here is the workflow:

We utilize the browser of chrome(which is probably 80% of development anyways)

I have been a Chromebook/ChromeOS fan for a long time. When I owned a coffee shop I used a Chromebook to do my accounting/management for five years. In fact I wrote an article about three years ago talking about my preferred software stack. If anyone could figure out how to make the most efficient development VPS, I think I qualify for a voice.

I have been using a MacBook now for about 6 months, and here is what I have found to be its pros:

  • Fast Compiles
  • Easy UI/UX
  • Great Terminal Support
  • Easy to switch between.

From here I will break this up into a tutorial of how to set up your systems to make this work.

Setting Up Your Chromebook

Chromebooks are simple, it's basically Chrome with a bunch of addons. My biggest issue with my previous approaches with Croutons was that you had to switch out of the Aura desktop that makes ChromeOS so awesome....The secondary issue was that if you used a terminal IN a browser tab, your compile times for things such as Webpack shot through the roof(4-6 times slower than MacBooks made after 2012).

Mosh

I wanted to make this easy, and replicable by anyone especially a web design firm starting off. Mosh is a terminal that was created @ MIT. It's great for dealing with laptops, lag, and other boo boos that come with remote terminal. It also has AMAZING shell support for Vanilla Chromebooks. You can pick up up the extension here. Installing Mosh will help us connect to our "real computer"

Digital Ocean

The second half of setting up our VPS is Digital Ocean.....or really any PaaS. It just so happens that Digital Ocean is my preferred service provider. I already use them to host this site.....From here we break into some sub-categories:

Basic Server Setup

My preferred Gnu/Linux combination is Ubuntu or Debian(call me lazy). Picking the right distribution is really at your discretion. Here is the best tutorial on Digital Ocean for a simple Ubuntu Server seWtup. The main thing we want to accomplish here is that we have the following tools:

The next thing we want to do is make sure we choose the right server. Any time you're doing any kind of frequent compiling for web languages(both ruby/node), it's a good idea to go ahead and just pick a server with absolutely no less than 1 gig of ram. Any less, and your compile times will be very slow.

Expand What Swap!

Expanding swap is super important, it allows us to get some more memory and avoid any ENOMEM errors.. I won't replicate documentation, instead I will refer you to this amazing link on Digital Ocean.

Setting Up Node & Other Tools

Pending on what you're going to be using your VPS for your toolset will vary greatly. Here is the easiest and maintainable node installation(we love easy an maintanable).

Setting up letsencrypt(so you an use https features of browser development)

At Iced Dev we do a lot of development with hardware and the browser. As such it's important that we have access to https, so that we can utilize items such as cameras, microphones, and USB ports. I found letsencrypt to be the best free provider for https encryption! Here is another amazing tutorial for setting up letsencrypt.

Fix the Nginx

Want to make sure that your box allows for development with all the features of chrome? Some features will not work such as your camera, or your microphone. To fix this we need to make sure that if we are using ports for node.js servers, we can expose them properly.

Nginx is a great way to manage ports on your computer. It took a little bit of configuring for me to figure out how to set up nginx on my VPS because primarily because i have the other services running on it. If you're using letsencrypt as I mentioned above then simply place this in the /etc/nginx/sites-available/default:

server {  
        listen 3000 ssl;
        server_name sample.com;

        ssl_certificate /etc/letsencrypt/live/sample.com/fullchain.pem;
        ssl_certificate_key /etc/letsencrypt/live/sample.com/privkey.pem;

        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
        ssl_prefer_server_ciphers on;
        ssl_ciphers 'EECDH+AESGCM:EDH+AESGCM:AES256+EECDH:AES256+EDH';

        server_name sample.com; # Replace with your domain
                location / {
                        proxy_pass http://localhost:1337;
                        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                        proxy_set_header Host $http_host;
                        proxy_set_header X-Forwarded-Proto $scheme;
                        proxy_buffering off;
}

Note It may be a good idea to open up 3 or 4 of each style of ports so you can use a wider variety....Also accept the fact this may make your machine's security a little bit weaker

With setup we now use SSL to route through a single port(3000), to 1337 locally. This gives us a solid easy to make development view.

Conclusion...

This is a horrible howto, so reading it could be challenging. My goal with it was not necessarily to give step by step instructions, or to give you one specific way to set up a good VPS development environment, but to give ideas..

Have a cooler setup? Let me know!

Sam.