2011-08-29

Coding in the Cloud: Diving In with Online IDEs

It seems like everything today is moving to "the cloud," which is that nebulous term for software applications and data storage hosted remotely on some server far across the internet. So if all of our software is moving to the cloud, why not the tools used to create that software? Well, in some cases, those tools are rolling out right now. Heck, even GitHub recently added basic editing capability. This article will look at some of the up-and-coming online IDEs.

Pastebins: The Little Brothers of Online IDEs

The first category of online IDEs that we will explore can't really be called IDEs. These IDE-lite web tools are more like pastebins on steroids. Pastebins provide basic text editing capabilities and features such as syntax highlighting, but not support for version control or deployment. Instead, pastebins allow snippets of code to be saved and shared with other users. The following web tools extend beyond the basic premise of typical pastebins in that they also allow your code to be executed, something vital for testing. This category of IDE-lite is excellent for simple proof of concept work, but not for developing full applications. The main feature that these web tools support is quick and easy tinkering and the ability to share small snippets of code.  The three IDEs is in this space that we will be covering are JS Fiddle, Python Fiddle, and ideone.

JS Fiddle

JS Fiddle


JS Fiddle may not be a fully featured IDE, but for trying out quick ideas with HTML, JavaScript, and CSS it is a great place to start. The web site provides separate windows for HTML, JavaScript, and CSS, and another window that will display the final output. The editors support syntax highlighting. JS Fiddle allows you to choose from multiple versions of each of the major JavaScript libraries like jQuery, Mootools, Prototype, YUI, and Dojo when testing your JavaScript snippets. It even allows you to link in the URL to your own JavaScript and CSS files hosted remotely. Your "fiddles" can also be saved and shared with other users. JSLint is also integrated to ensure your JavaScript code is tip-top.

Python Fiddle

Python Fiddle


Python Fiddle is similar to JS Fiddle except it is focused on Python instead of the HTML/CSS/JavaScript combination. Python Fiddle provides a sandbox to test snippets of Python code, and provides support for many of the popular Python libraries. Like JS Fiddle, Python Fiddle supports syntax highlighting, and your snippets can be saved and shared with other users.

ideone

ideone


ideone is by far the most ambitious of the glorified pastebins. Much like JS Fiddle and Python Fiddle, ideone provides syntax highlighting and the ability to save and share snippets of code. Unlike the other two, however, ideone aims at supporting well over 20 different languages, including C, C++, C#, Java, JavaScript, Go, Groovy, Objective-C, Perl, Python, and Ruby. ideone aims to be a one-stop shop for all of your snippet testing needs.

Will the Real Cloud Based IDEs Please Stand Up

What separates the real cloud based IDE's from their little brothers is that they include support for importing projects, working with version controls systems (primarily Git), and in some cases support deployment. Of the fully-featured online IDEs we will be examining Eclipse Orion, Cloud 9 IDE, and eXo Cloud IDE.

Eclipse Orion

Eclipse Orion


Eclipse Orion is an online IDE effort being led by part of the Eclipse foundation. The IDE is primarily focusing on web development languages such as HTML, JavaScript, and CSS, but includes initial support for Java. Orion differs from the other online IDEs in that it is not necessarily meant as a hosted solution, but actually intended to be deployed into private environments. You can download Orion and host your own instance. For instance, you company might host an Orion instance for all of its developers, or even for specific projects.

Right from the start Orion lets you initialize new projects by cloning from Git (the only supported version control system), uploading a zip file of your project, or by creating a new HTML5 site using initializr.

For my testing I cloned a repository in Git. For some strange reason I had to use HTTP for Git instead of SSH, since I cannot find the SSH key listed anywhere in the IDE. Orion provides a GUI for interacting with Git, but it can be a bit confusing. While I understand it is a good practice to use Git's "status" command before performing a commit, Orion hides the commit interface under the Respository window's "Show Status" option, which is very confusing.

The editor is fairly nice. It supports line numbers and syntax highlighting. Support for outlining and content assistance is very spotty. Currently outlining is only supported for JavaScript and HTML, and content assist is only available for CSS. Basic editing commands such as Alt+Up/Down to move lines, Ctrl+D to delete a line, and Ctrl+L to go to a line number are supported.

For more information you should check out Eclipse's "Getting Started Guide" for Orion.

Cloud9 IDE

Cloud9 IDE


Cloud9 IDE is another web-based IDE specialized towards web development, and is the only one on the list with a paid solution. Cloud9 IDE is free for projects that will be publicly visible, but for private projects the cost is $15 a month. The IDE supports HTML, JavaScript, and CSS, but also includes support for Ruby and PHP. Of the online IDEs, Cloud9 is the only one on this list that supports Mercurial as well as Git. In fact, GitHub and BitBucket support is baked in from the start and you can actually create your Cloud9 IDE account by logging in through one of those services. In fact, when I created my account that was the only way (hopefully something that has been fixed, but I don't want to create another account to test the idea).

Provided you log in through GitHub or BitBucket, importing projects is a breeze. You will need to be familiar with the command line versions of Git and Mercurial though, as all version control support is implemented through a console at the bottom of the screen. The tool does provide an SSH key that you can register with GitHub so you won't be prompted every time you try to push code.

The editor is very responsive and supports some of the niceties I've come to expect from Eclipse (Alt+Up/Down to move lines of code, Ctrl+D to delete a line, Ctrl+L to go to a line). The syntax highlighter is nice, and there is support for code "beautification." The editor will also notify you of code errors as you type.

Your HTML pages can be tested right inside the interface. If you are looking to deploy to an outside host, Cloud9 IDE supports deployment to Joyent and Heroku.

eXo Cloud IDE

eXo Cloud IDE


eXo Cloud IDE is the last online IDE we will be looking at, and probably the most ambitious. eXo Cloud IDE aims to support the three web languages as well as Ruby, Java and JSP, and PHP. It also provides the most deployment options: CloudBees, CloudFoundry, Heroku, and Red Hat OpenShift.

eXo Cloud IDE supports Git for version control, and provides a nice menu at the top of the screen for all of the Git operations. A bit tucked away under the "Window" menu there is an "Ssh Key Manager" utility so you can set up an SSH key to use with your remote Git host (such as Github). Importing a project from Git was a bit more difficult with eXo Cloud IDE in that first you had to create a folder, initialize a repository in the folder, and then perform the clone. Most of the other services let you start with "clone" and took care of the rest for you.

The editor is nice enough. It supports syntax highlighting and line numbers. It doesn't have some of the text editing niceties I mentioned for the others (Alt+Up/Down is absent, but Ctrl+D for delete line and Ctrl+L for navigating to a line do exist). It does support a nice outline view though for navigating your code, which is very helpful. One extremely nice feature that eXo Cloud IDE supports is a minimal form of code completion (with the standard Ctrl+Space command). eXo Cloud IDE provides basic auto-completion for HTML, JavaScript, CSS, and Java, Ruby, and PHP code.

Comparison

The following table provides a comparison of the different features of the online IDE's mentioned:
IDE Cost Languages Version Control Deployment
JS Fiddle Free HTML, JavaScript, CSS None None
Python Fiddle Free Python None None
ideone Free 20+ Languages None None
Eclipse Orion Free HTML, JavaScript, CSS, Java Git None
Cloud9 IDE Free (Public), $15/mo (Private) HTML, JavaScript, CSS, Ruby, PHP Git, Mercurial Joyent, Heroku
eXo Cloud IDE Free HTML, JavaScript, CSS, Ruby, Java, PHP Git CloudBees, CloudFoundry, Heroku, OpenShift

Conclusion

While I don't see the online IDEs taking over for most developer's day-to-day tasks, I think that they are a welcome addition to any developer's toolset. Web developers will benefit the most at the moment, as most of the tools are geared towards HTML, JavaScript, and CSS development. Seeing as how most software is moving into "the cloud" and those are the technologies that are driving new web-based applications, that's not a bad thing. The pastebin style tools are useful for quickly testing new concepts and don't require a lot of the overhead of a full-blown IDE.

Git seems to be the clear winner when it comes to version control support in the online IDEs. GitHub in particular is favored (it is a great service so I can see why). Only one IDE offered support for Mercurial, and Subversion lovers are out of luck going forward into the online world.

Personally, robust code completion and refactoring tools are a must in my world, and support for those features is definitely lacking in the current generation of online IDEs.  I think that as the tools mature support for those features will increase. I could see that several years down the line there will be whole software teams that develop and deploy all of their code right from their web browser.

2 comments:

  1. Great article! But you forgot one very important cloud based IDE. Koding http://bit.ly/1bpsH1L! It has a ton of features. Free VM with root access, a Terminal, 1Gb space, 2Gb Ram and a whole lot more.

    ReplyDelete
  2. Really awesome blog. Your blog is really useful for me. Thanks for sharing this informative blog. Keep update your blog. Recently I did Software Testing Training in Chennai at a reputed training institutes. This is really useful for me to make a bright future in IT field.

    ReplyDelete