Many web developers like to dive head-first into code. Others prefer careful planning first, creating a road map, and then coding it piece-by-piece. No matter what your methodology is, there are several best-practices you can adopt to build a successful web application. Here are some general tips to keep in mind:

1. Select the right language/environment

There are hundreds (if not thousands) of different technology platform combinations you can use to build your web application. Choosing the right one is vital to the success and direction of your project. While they share similar attributes, focus on which combinations best meets your needs. For example, developers on a limitted budget may consider using open-source solutions like Linux and PHP. Developers wanting to start with a pre-built framework highly interoperable with SQL Server may choose ASP.NET MVC instead. Identify which one meets your needs and go with that. It will become the foundation of your web app, so choose carefully!

2. Build your database first

You should always create your database first. Designing a good schema will help you clarify how your data will be represented and how it relates with other components. It will guide many of your code design decisions, especially if you use an MVC framework. Feel free to add sample data to help test your project as you work on it.

3. Utilize open-source projects

Don't reinvent the wheel. There's a plethora of great open-source solutions available for almost everything. Dedicated volunteers have poured thousands of hours into their projects, refining and perfecting it. There's simply no way you can create something equally awesome in less time. Take advantage of this! And if you find yourself making improvements to the codebase, consider giving back to the community.

4. Don't worry about Justin Case

Sometimes when starting a project, developers find themselves making things extra-complex "Justin Case" the app needs to do X Y and Z. Justin Case causes the codebase to quickly double to account for possible future upgrades and enhancements. Justin Case will cause you to spend more hours in development without having a single piece of working code.

Don't listen to Justin Case! Consider him to be your worst enemy. Your goal should be getting the app to work, even if the code is somewhat messy and disorganized. Once you have something that works, you can...

  • go back and refactor your code, making it neat and organized
  • identify functionality that needs to be tweaked
  • show your working prototype to others
  • extend it further with extra features

Your time is limitted. Spend it on bringing your idea to life instead of worrying about Justin Case.

5. Focus on the important features first

Just because you have 100 ideas for app features doesn't mean you should implement them all. To quote 37Signal's latest book, Rework: "You're better off with a kick-ass half than a half-assed whole." Focus on the really important things first and give the other ideas time to incubate. Don't start working on the extra feautres until the initial functionality has been perfected. You may find that some ideas really weren't that great. So take the awesome ones and add them one-at-a-time to your perfected web app.

6. Never trust user input

This is the golden rule of web app development. Some general tips for better security:

  • Make sure that you validate ALL user input.
  • If the input doesn't make sense, abort the operation and notify the user.
  • Use whitelisting as much as possible.
  • Sanitize anything that gets stored in the databased or output to the page.

User input is an unavoidable evil that threatens the security of your web app. Blindly trusting it can lead to SQL injection, XSS attacks, and many other disastrous things. Take every precaution you can!

7. Ensure the user interface is intuitive

People should be able to use your application without watching instructional videos or going through training seminars. Utilize design patterns that keep the interface simple:

  • Organize the navigation into distinct areas of functionality
  • Provide helpful cues to direct the user on what to do. This could be things like...
    • Example input hints in fields
    • Different styles for hover states on clickable items
    • Tooltips explaining what something does
    • Detailed "help" or "how-to" documentation linked directly from the page
  • Use action words for clickable links and buttons. Make these prominent.
  • Ensure that a user can reach any piece of functionality with a minimal number of clicks (3-4 is a good target)

Also, consider the "blank slate". When a user starts using your webapp, chances are they won't have any data. Instead of showing empty tables or blank pages, provide either sample data or instructions on how to get started.

8. Don't waste time on optimization

Most webapps aren't overnight successes, so don't worry about supporting 100,000 users until you near that mark. Don't focus on optimizing every 'for' loop to shave off fractions of a second at the expense of readability and maintainability. If your app needs more resources, its probably quicker (and cheaper) to purchase more hardware. Optimization shouldn't be done unless there's a serious issue. This can be mitigated by implementing effective design patterns in your code from the start.

9. Don't be afraid to ask

If you get stuck on something or need some fresh ideas, don't be afraid to ask! One awesome aspect of webapp development is the enormous community of programmers who enjoy helping each other. Chances are somebody else has had your problem before. Some good resources could be...

  • Asking a colleague
  • Searching on Google
  • Posting in a forum or help site (StackOverflow comes to mind)
  • IRC or other chat service

Many programmers would be happy to help you out! If you post in a forum or a site like StackOverflow, you'll also be helping others with similar problems find answers. And if you get the chance, take time to help others out with their questions. There's a huge community of developers out there sharing ideas and building their knowledge, so get involved!