Development

Web IDEs: the future of coding

By Matt Pass

January 30, 2013

Still using desktop code editors? Web integrated development environments (IDEs) are a new way to build your web projects directly in the browser, often saving development time and making collaboration easier.

The humble browser used to just serve up simple HTML documents, but it’s often now your first stop for just about any task. Think about it — document editing, file sharing, image manipulation, server backups, 3D rendering, music production and just about any other work traditionally done in desktop software can now be handled by a web service.

I’ve actually become reluctant to install anything anymore, as there’s usually a great web alternative that just requires a simple account signup to use it. But even with all the great services on the web, web development itself has been one of the last frontiers for this trend, perhaps because of developers’ reluctance to work online. But that's beginning to change, and for good reason: web integrated development environments now rival desktop solutions in terms of quality and usefulness.

Coding offline is crazy

Most developers build websites on their desktop before putting them online. This was a sensible way to work in the past when we had slower net speeds, most solutions were desktop-based, and we were afraid of putting anything online unless it was finished. However, even average web speeds are fast now, and there are plenty of great online coding solutions.

Building websites and apps can be much like building a house. I could make a lot of analogies to how foundations, pipework and interior design match up with website components. But unlike finishing a house, when you finish building a website, you move it to a different location. Like trying to move a finished house to a new lot, that’s when the problems can begin. You likely haven’t built the site in exactly the same environment you’ll deploy into, which may cause issues. You wouldn't build a house in a field when you know that it will have to be moved to a street when you’re done. In moving a house, parts are likely to get broken, none of the pipework will match up, and so on. So why would you do it with a website? It's crazy to work that way.

The most common argument against coding online is that it’s not professional to work on live websites. But coding online doesn’t mean you’re turning client sites into works in progress — build in a development area only you have access to. When you’re ready, move it to live area — simple! It’s time to embrace coding online.

Having switched to web IDEs for the last year, I spend half my time exclusively online now and save about 10 to 15 percent in dev time from to my previous desktop coding practices. That's time I can use to make a website better, or maybe even occasionally finish my workday on time. (Yes, it can happen!) Why are IDEs so awesome? Here are four big reasons:

• You can code anywhere with anyone: Using an online solution lets you code from anywhere — home, office, train, web cafe or from any location where you have a device with a browser and internet connection. You can also code in teams, in the same room or remotely, and at the same time too, something that’s not always easy to achieve with desktop code editors.
• You can use any OS you want: Without having to install anything, it doesn’t matter whether you use Mac, Windows, Linux or another operating system as long as you have a modern web browser.
• You don’t need to have a zillion programs open: Another big plus with IDEs is not needing to have so many programs open and constantly toggle between windows. You just use the web browser for the IDE— the web effectively becomes your toolbox.
• You can test faster: IDEs also save on testing and even deployment time, as coding online allows you to discover issues as you build, especially if you're using the same server environment the live site will have.

Online coding solutions

So what web IDEs can you use right now? Popular solutions include Cloud9, ShiftEdit and CodeAnywhere among many others. Each offers its own take on how an online coding solution should work. Some require payment, and others don’t; some allow you to work via FTP on your own domains, and others require you to clone into their system first. Much like desktop code tools, each has its own scope and style, so it’s important to check out all the features to find the one that’s best for you.

You might think (as I did a couple of years back) that IDEs are light on features and abilities, but that’s far from the truth. The leading web IDEs easily rival the popular desktop code editors, if not exceed them in terms of quality and ability. They often have huge user bases; the well-established ones have 100,000+ users. So they’re updated as often as every week with new features, while desktop solutions might only update their features in new versions every couple of years.

Online coding solutions offer all the standard features such as code highlighting, folding, code completion and more, plus terminal windows, collaborative coding, dynamic interfaces, and direct connections to other services such as Github, Bitbucket and Dropbox.

Open-source options

Over the years I’ve heard so many web devs complain about their editors not working well for them. But they feel they can’t do anything about it except inform the provider and wait for a fix or alteration. With more and more open-source web IDEs now available, you can recode the tool to match your needs. There’s no need to fight your editor anymore — make it work for you.

On the experimental end of the web IDE spectrum are open-source varieties such as Aptana and ICEcoder, which freely offer their source code for you to take, use and modify. Because they’re written in languages you’re likely already familiar with — JavaScript, PHP, Ruby — you can quickly get to grips with them and tweak things to your preference. Don't like how you open files? Change it. Want to build on an extra something? Great, do it.

While they’re not typically as robust as full-service web IDEs, open-source IDEs are adding new features regularly to give users the best online code editors possible.

So, what are the drawbacks?

The issues that would stop you from using web IDEs are becoming fewer all the time, but there are a few legit reasons why you might still code offline. If your project requires huge amounts of data transfers or data crunching, using your browser would be impractical. Or maybe your site is heavy on graphics and uploading your images over and over again would be slower than working offline.

Some might argue the biggest issue is security. If your code is available from anywhere, it could potentially be accessed by anyone. A security breach of your web IDE provider or account could put your code at risk — if the data is sensitive, this could be a major problem. Web IDEs for this reason undoubtedly take security very seriously, but a security breach is not beyond the realms of possibility and should be a consideration before coding your next project online.

Toss your desktop solutions

Desktop code editors have made the web what is today, and we should be thankful to the software authors who helped us make great things. But the desktop's coding days are numbered. Online code editors let us work from anywhere, connect multiple services together, deploy with the click of a button, pull and push source code around to our liking, and let us build brilliant solutions with greater efficiency and openness.

We need to embrace a future where everything can be integrated, mixed and reworked on our own or in teams, with the safety of knowing code can be rolled back, bugs tracked and solved from anywhere if there’s a problem. With everything ultimately moving to the cloud, web IDEs will undoubtedly become the de-facto way of coding, and I welcome this bright new dawn. If you’re still coding offline, I challenge you to let go of your fears and give the future a try.

Have you used a Web IDE to code a site? Do you prefer a local solution? Let us know in the comments.

Featured image/thumbnail, code image via Shutterstock.