Web
Article

Developing in the Cloud: an Introduction

By Aldo Ziflaj

people developing in the cloud

Every web developer needs to set up a development environment—a set of tools to work with, such as

  • a code editor
  • a version control system (such as Git or SVN)
  • build tools and/or package managers
  • DevOps and provision tools (Docker, Puppet, Ansible, Vagrant)

… and so on. Having a good setup is crucial for maximizing productivity.

Development stacks vary from developer to developer, and can depend a lot on a developer's field of work. However, there are some pretty typical setups. SitePoint has recently published examples of local development environments for Linux, Windows and Mac.

In this article, I'll take a look at a fourth kind of development environment—one that's based wholly in the cloud. This will normally happen through a third party service, and there are quite a few to choose from—such as Cloud9, Codenvy and Nitrous.

Advantages of Developing in the Cloud

When using a cloud development environment, you're actually a client of a development platform as a service (dPaaS)—which offers a lot more than just an online code editor.

Faster setup
Firstly, developing in the cloud reduces the setup time. Usually you can use your framework of choice, or use boilerplate code structured as it should be, and all that is done by only clicking some buttons.

Access from Anywhere
You can code from any computer, as long as you have an internet connection—whether you're using the latest iMac, an old Netbook or even a tablet.

Remote Pairing
One of the features I love about these environments is remote pair programming. Cloud IDEs allow more than one developer to access the source code at the same time. You can see each other write code, test and chat in real time.

Multiple Installs
I recently had a problem with a Scala application. The dependencies just wouldn't install. It turned out to be because I had Java 8 installed, while some of the dependencies required Java 7. I did't want to downgrade, since it would probably affect other applications, so I decided to go on with a Vagrant config. Well, if you're in the cloud, you don't have to do that. You can require a container for each application you develop, and the container will be just like you want it to be (Java 7 in this case).

Working with Cloud9

For the rest of this article, I'll walk you through a few examples of what you can do with Cloud9, one of the many dPaaS services available to developers.

Cloud9 offers 5 plans, one of which is free. Each plan uses Docker containers running on Ubuntu Linux, offering full terminal access, multiple collaborator access, and infinite open-source projects.

Collaboration

Collaboration

It's really handy that multiple developers can work on the same source code. Each collaborator has an active cursor, and they can write code at the same time.

In the screenshot above, you can see two users, me and jamesbond006, accessing the same controller code at the same time. Notice the lines marked with different colors in the left side of the line numbers. Each color identifies a user. The @message on line 8 is underlined with the color corresponding to jamesbond006—meaning he's the one who wrote the code. This feature is very helpful and beats TeamViewer anytime! You can use it to help a friend, get help from a friend, and even test or teach some student/job candidate remotely.

Multiple Browsers

Multiple Browsers

If you're a front-end web developer or designer, you'll sometimes have to switch browsers to check if what you wrote is what you expect to see. You'll likely have Chrome, Firefox, Opera, and possibly IE and/or Edge installed.

Cloud9 saves you from installing a whole stack of web browsers. You can remotely test your layout on the major browsers—both desktop and mobile. You can also test your app on iPad, iPhone, Android and Kindle.

Working with Languages

Like other services, Cloud9 supports a wide range of programming languages and frameworks, including Ruby on Rails, various PHP frameworks, Node.js and also databases such as MySQL, PostgreSQL, Cassandra, MongoDB and others.

Cloud9 templates

Even if you want to develop in a language not listed above, such as Scala, you can choose the Custom template and install your chosen language via the terminal.

Rails

You can create a Rails app by choosing the Rails template, or by choosing the Custom template and executing rails new in the terminal.

You can start the application by executing this on the terminal:

rails s -p $PORT -b $IP

You can then access the application you're developing by navigating to <workspace>-<username>.c9.io.

To install gems, just add them inside your Gemfile and run bundle install in the terminal—just like you'd do in a local environment. The rails generate and rake db remain the same, and migrations create tables in the default db/development.sqlite3 file. If you don't want to use SQLite, read the docs on how to set up a database.

Further Examples

For more language setup examples, I've put together some demos on GitHub—including C and C++, PHP and MySQL, Gradle and more.

Other Features

Of course, online code editors like Cloud9's come with a host of nice features that you'd expect in an editor. These include:

  • outline views and code completion (including Emmet integration)
  • debugging tools
  • split view
  • themes
  • key bindings
  • modes of popular editors (VIM, Emacs, Sublime)
  • built-in image editing.

Deploying to a Server

Whether developing locally or in the cloud, you'll eventually want to deploy your code to a server. Some cloud development services include hosting as an option. But you can also deploy your code elsewhere.

FTP

On Cloud9, you can mount an FTP or SFTP (S for SSH/Secure) server by going to File > Mount FTP or SFTP server:

Mounting an FTP server

In the image above, you can see how an FTP server is mounted. I recommend using SFTP, which is more secure and uses an SSH connection with the hosting server. With SFTP, you don't have to specify a password; by default the SSH key in the workspace is used. (I recommend you read about setting up an SSH key if the concept is new to you.)

Push to Deploy

The alternative to FTP is called Push to Deploy. Most cloud services—including Google App Engine, Heroku and Azure—allow you to use Git (or a similar VCS) to push the source code into a cloud VM for deployment. Since Git is already included in every Cloud9 workspace, you can use it to deploy your application by pushing it to the production server.

Working Offline

If you want to continue your work offline, that's no issue. Cloud9 allows you to download the source code as a .zip archive and then you can develop locally in your machine. It also supports FTP. You can push the project directly into the development or the production server.

Wrap-up

Cloud IDEs try to make the developer as mobile as possible. The whole environment is somewhere far removed from your machine, which enables you to use it even if you're using an old computer or sitting at someone else's machine. It comes with Git included, so you can use it to put the project under version control and/or work with a team of developers.

I'd recommend using a Cloud IDE at times such as these:

  • Your computer is not powerful enough and your internet connection is stable (not getting regularly disconnected).
  • You want to practice pair programming with another developer when one of you is working off-campus.
  • You don't mind using a code editor that's less powerful than your local locally installed code editor.
  • You quickly want to spin up an alternate environment without all the hassles of local installation.
  • You want to show someone a demo of the website/web application/Wordpress theme you're developing. (You just have to Run the application and share the URL.)

In this article, I've mainly covered the features of Cloud9's online IDE, but it's not the only one out there. There are lots of alternatives, including Nitrous, Codeanywhere and Codenvy. Which you choose, of course, will depend on your particular needs and preferences.

Have you ever developed in the Cloud? If so, how did you find it? What's your preferred service, and why?

  • http://www.creativeambar.t15.org/ Felipe Alvarado S

    This is the future, I love how our IDEs change along the carrer.
    As a personal note I still see people strugling migrating code from a machine to another (versions, compilers) or dealing with bloated IDEs and when I show them how I work they just get MINDF@#K.
    It is always nice to see exposure of “new technologies” that are not that new.

Recommended

Learn Coding Online
Learn Web Development

Start learning web development and design for free with SitePoint Premium!

Instant Website Review

Use Woorank to analyze and optimize your website to improve your website to improve your ranking!

Run a review to see how your site can improve across 70+ metrics!

Get the latest in Front-end, once a week, for free.