Advanced Web Development and Deployment Workflow

Improve your web development and deployment workflow with a Web IDE, Version Control and Automated Deployment Systems.

Code → Sync → Deploy

In modern day development, maintaining a time-efficient workflow when coding, designing and managing web applications is very important. Time is a key factor in productivity, and there are a lot of actions, clicks and operations that we can either automate or even avoid to save ourselves time and keep staying focused and engaged with our workspace.

Editing and syncing your code repository between your local machine and host server can be very stressful and messy, that’s why one must consider using a version control system like Git and a hosted Git repository like GitHub, to have both local and hosted versions of the code organized and synced. On the local environment you are probably using a simple text editor for editing your code, XAMMP or WAMMP for launching the web server, using your operation system’s terminal for initiating a Git repository and perhaps other separated tools for automation and debugging. In a perfect world it’s very helpful to use an (IDE) and in this case mainly a (Web IDE), that consists of all the tools we need and have them all in one place, just a few clicks away.

Integrated Development Environment (IDE):

Today, I'd like to mention Cloud9. A browser based IDE. It's a new product from Ajax.org that aspires to be the premium online development environment for web developers. It ships with a code editor, Git integration (version control) and with Node.js and Ruby on Rails support for server-side development, and of course standard PHP/HTML support with an Apache HTTP server.

Having access to your perfect work environment regardless of where you are is very helpful for modern developers and is pretty much on everyone's wishlist. Imagine being able to fix a simple, yet show stopping bug right from your holiday netbook just as you're about to board a flight. Flawed, for the obvious reasons, but also perfect. And let's face it, minimal code editors have been online in one form or the other for quite some time now. But they've been just code editors, not IDEs. If you're pondering on the difference here, I typically consider an IDE to be a code editor with at least debugging support thrown in.

Deployment:

We talked about the development environment, what about production and deployment? It's important to be able to make changes and features quickly, this has led to a practice of continuous deployment which will work with your code repository to deploy your code as you commit your changes. This differs to the older practice of making changes to your code and using FTP to deploy these to the host server.

Beanstalk has recently released their new service called DeployBot, which allows you to use your existing repositories on things like GitHub, BitBucket, self-hosted repositories and deploy to a number of locations like FTP, SFTP, Amazon etc. Beanstalk as a service will handle both the code repository and the deployment and this new service will allow you to use another repository service to deploy your code.

Using DeployBot you can setup multiple deployment environments and can setup these deployments to take place with either automatic or manual deployments. Automatic deployments are triggered whenever you push changes up to the repository. Another good feature of using DeployBot is that it will keep track of deployments you make, this means when something goes wrong you can see exactly what commit broke the site. As you keep track of each deployment it means if something does break you can quickly rollback to the previous commit and deploy this code back up to the server.

Conclusion:

The following illustration demonstrates the workflow of development and deploying to production on a local and a web based development environment. Notice how difficult and time consuming would be to develop a web application on a local environment. It requires software installs and additional SDKs and packages. On the other hand, a Web IDE provides an all-inclusive platform that is well put together and easy to maintain. And finally, with the use of DeployBot to automate and speed up the deployment to the host server.

I hope that you've found this guide interesting. I'm sure there are lots of perspectives I've missed in it, so remember to join in with your comments. Thank you so much for reading!

Originally published on Medium