Web Apps 101
So you want to write a web app? Vesess welcomes you and a million others to this primer on developing your first web based application. By the end of this post you should have a better idea of how to approach web development in the post-basecamp era. Let’s start with the basics.
Good web apps are a combination of intuitive interfaces + solid code
The quality of web application’s code lies within the simplicity, flexibility and understandability of it. Thus, agile development has quickly become the way of the web dev. At Vesess, our web team is no different. We do web apps with 1 designer + 1 developer. So, having said that, it’s time for us to share a little of how we approach this task. We’ll begin by dwelling on some fairly abstract concepts.
Use a Framework
It’s always better to use an existing web application framework rather than starting everything from the scratch. Frameworks provide you with a solid base to focus on the problem you want to solve. In the long run, that’s a lot better than having to worry about infrastructural issues. These frameworks are written in different languages and follows several conventions. Our recommendation is to work with a framework that is written following the MVC (Model, View, Controller) architecture, as this is the most productive kind to work with.
When choosing a framework it’s good to consider these factors:
- Your developer’s proficiency with the language involved.
- The suitability of the framework to the problem domain (for example, frameworks such as MODx or Silverstripe best used in the development of content rich sites).
- Your deployment environment and budget.
Use a Source Code Management System (SCM)
We recommend that you use a SCM such as Subversion to manage your application code from the beginning. Got only one developer on the project? We still think it’s worthwhile. SCM systems are a great insurance for developers since they have the comfort of a code rollback at all times, and can even sync their projects easily between multiple PCs.
Further having a code repository makes your life easy when it comes to application deployment. You could simply use a tool such as Capistrano with your repository to deploy your application on a remote server.
Choose a Good Editor
A web application project may contain code written in different languages, with snippets stored in different file formats and in different directory structures. Thus, it is essential that you use a editor or IDE which supports all of these conventions. Of course, syntax highlighting and smart indention will help you write clear, precise code, and in the long run will make hunting bugs that much easier. Many modern IDEs also have smart pop-up menus that can complete code for you. Although veteran coders often shun such features, they can save you a lot of time and keystrokes when typing in repetitive strings.
If you are on mac you could get your hands on TextMate or Coda. Linux users on the other hand might like to try this lightweight editor called Scribes, especially if you feel Vim and Emacs are too much for you. If you are willing to use a web based IDE, Aptana is a great one.
Use AJAX and JavaScript wisely
Lot of web applications get bloated with unnecessary AJAX and JavaScript effects. Don’t let the application’s usability drop because of the overuse of these. Always make your JavaScript unobtrusive and have fall through methods for your AJAX calls. Make the habit of using the Firebug plugin for testing and tweaking your JavaScript.
Test your Code
Most of the major web application frameworks come with an integrated testing environment, and we recommended that you use them to do unit and functional tests on your application. Best practice would be to create the test cases alongside the development classes and test as you go along. Time spent on this will prevent you from falling into blind errors mid way in to development. Another good approach would be to use a test tool such as Selenium to troubleshoot browser compatibility and perform system functional testing.
Use a Bug Tracker
Although you will not need a fully fledged tracking system such as Bugzilla or Trac, maintaining a task list for bugs in your Project Management portal would be a wise thing to do. Keep all the bugs recorded there, as this might save you the trouble of fixing the same bug twice, and so on. Lighthouse seems to be a nice hosted bug tracker for web application projects.
Abstract and extend your Code
In the long run you may want to release an API for your application or you might want it to be compatible with mobile devices. Making your code abstract will give you the option of reusing and porting it. Always have a meaningful naming convention (usually, frameworks such as Rails force you to do this) for classes and models, as this will save you (and perhaps others) a lot of confusions later on. Also try to incorporate things like Microformats in to your application, since this will enable you to structure the output in a logical manner and make it easy to consume.
