I'm happy to report, however, that things have changed dramatically just in the last several months, and it's now easier than ever to do real development on your Chromebook. In this post, I'm going to give an overview of some of the tools that I use when developing on my ChromeOS devices (In addition to my Pixel, I also have an HP 14, a Samsung 550 in developer mode, a Samsung Series 3, and an Acer C720).
Keep in mind that some of these tools are fairly new and still developing, so keep an eye on them as they get better over time. Also note that all the tools I talk about in this post are available for all the supported Chrome Apps platforms (Mac, Windows, Linux, and ChromeOS), but I'm focusing just on ChromeOS here.
The Basics - Offline Editing
Text AppUntil recently, my go-to text editor was - not surprisingly - Text. It's pretty straightforward, works offline, has support for syntax highlighting, syncs with Google Drive, and can easily handle multiple open files.
|The Text app from the Chrome Web Store|
CaretI'm a pretty big fan of Sublime Text, and it's one of the things I missed most when working on my Chromebook. I recently came across a new Chrome App called Caret that does a great job of code editing and gives me a user experience that's much more like Sublime:
|The very Sublime-like "Caret" editor|
Some of the things I really like about Caret are:
- It remembers the files I had open between run sessions
- It remembers the size and position of the window
- Support for multiple carets and other Sublime-like features
- Lots of color schemes, support for font sizes, etc.
- Code completion
- Very customizable - lots of user-editable settings
- It's open source and has a Github project
Several of these IDE providers have existing apps in the Chrome Web Store, such as (but certainly not limited to): Koding, Cloud9, Nitrous.IO, ShiftEdit, and Codenvy. There are also collaborative cloud-based editors like Neutron Drive.
Each of these tools could take up an entire post on their own, and I'm planning to do a deeper dive into them at some point, but for the moment I'm going to focus on Nitrous.
<webview>control, which displays the remote environment that you're connected to.
Setting up a remote Nitrous box is pretty easy, and you have your choice of Node, Ruby, Python, and Go environments. The Web IDE is straightforward, includes collaboration options, and lets you upload source files to the remote box. There's also a command shell for executing commands and such. The docs are pretty extensive, too.
I recently tried out Nitrous on a small NodeJS/MongoDB project, and the experience was about as easy as it could be. I just provisioned the box, uploaded some source files, and was working away within minutes. The Web IDE even provides a "Preview" function that launches the app within the local browser with the URL already set up.
Between working on source files locally and having a cloud IDE to test and deploy in, I can easily see how a setup like this could become the future of development.
Testing and Debugging
- You can profile the performance of your app with the Timeline pane
- The Workspaces feature lets you use the DevTools as a source editor. Yes, you read that right.
- You can see how much memory your application is using
- Building an app that uses Canvas? You can profile that now, too. Yes, really.
Postman comes in two flavors - the original V1 Packaged App, and the newer Chrome App. I prefer the latter, since it works offline and in its own window. It also comes with a great set of online docs.
|Postman makes working with REST APIs easy|
Postman has some features that make working with REST services a breeze:
- You can define collections of requests, and group them together to reflect your API
- Adding headers and query parameters is quick and easy
- You can set up different environments (such as "Production" vs. "Development") and then customize the way that requests are sent using variables
- There are helpers for setting up various authentication schemes, such as OAuth2
- The app adds each request to its History, which makes it easy to experiment
- It is easy to customize the app's settings, and there are a lot of ways to tailor Postman to your particular needs
|Using Dimensions to view various layout sizes|
Essentially, you start up the app, point it at a URL, and then slide the grab-handle left and right to simulate different screen widths. Assuming you've written your HTML to use responsive layout techniques, the page will change at various widths so you can gauge what it will look like on various devices.
Dimensions include pre-defined layout sizes for iPhone, Android, and Tablet sizes, and you can rotate each device to display different widths.
By default, the app will load in a browser tab, even if you're offline (that's what v1 Packaged Apps do). I usually set Dimensions to open as a regular window (just right-click on the app icon and choose the appropriate setting), which gives it a more app-like feel.
You can edit your Gists directly in the app, create new ones, apply labels, search Gists, and even share them via email or Twitter.
|Organizing Gists with GistBox|
Unfortunately, since it relies on Github access, it doesn't currently work offline, but given its purpose and usage scenario, I haven't found a situation where that has mattered for me yet.
|HexReader in action|
It supports large files, you can copy data as text or hex, and it has bookmarks too.
Yes, it's a bit of niche app, and not exactly for everyone, but for those people who need it, HexReader is one of those developer utilities that you're glad is there.
Summing It All UpChromeOS has a come a very long way in a short period of time, and the developer story has improved right along with it. I find that I can do pretty much all of my every-day development tasks right from my Pixel (or, thanks to Chrome Sync, any one of my Chromebooks) while getting all the usual benefits of ChromeOS: speed, simplicity, and security.
And this is just the beginning - more developer tools are on their way, and the built-in Chrome DevTools continue to improve at a rapid rate.
App LinksI've included all the links to the apps I mentioned in this post here in one handy list for those of you looking to try some of these out:
- Cloud IDEs
- Testing and Debugging