DEV Community

Cover image for The Timeline Method for Determined Construction of Web Applications
Yoram Kornatzky
Yoram Kornatzky

Posted on • Edited on • Originally published at yoramkornatzky.com

The Timeline Method for Determined Construction of Web Applications

How do you approach the development of a new web application? If you are a solopreneur or SMB, you are not aiming for a big scale. You cannot afford well-known but costly development environments.

It is a challenge that I encountered repeatedly as a freelance consultant. Build it and ship it without overbuilding.

Here is the method that I usually use.

The Matrix

Think of the complete development process as a two-dimensional plane.

On the horizontal axis, we have the different phases of the evolution of the web application. This is a timeline of phases that it goes through.

The vertical time axis is the computing environment you will use.

The Time Axis - Phases

  1. Collection of emails
  2. Forthcoming - add information pages
  3. Production - add sign up/sign in and rea; functionality
  4. Add testimonials and other forms of social proof
  5. Scale up - multiple servers, load balancing

Of course, the production phase of development will be broken into multiple sub-phases.

In the action events platform I am building, we start with notifications via email. Later we will add notifications through SMS.

The Environments

Each phase has to go through these environments,

  1. Local development
  2. Staging - cloud environment
  3. Production - production environment

The reason for going through this sequence is that we need to test things before we release them.

We start with local development but must move to the cloud to demo anything.

Design Backward from Production

We design the production web application in a most general form. Then we define a subset within the general framework for the collection and the forthcoming phase.

The Structure

As we would like the collection and forthcoming phases to have the production look and feel, we work by working backward by focusing on the navigation bar and the home page.

Navigation Bar

A navigation bar with all pages that will be in production. We expose more and more pages as we proceed through the phases.

Home Page

The collection and forthcoming pages have the general look and feel but with an email collection form only. To build a mailing list.

In the production phase, we move to a real home page.

Other Pages

If any other page appears in the collection or forthcoming phase, structure it to represent the corresponding content for that phase if different from the production phase.

Conclusion

With this approach, you construct one web application for all the phases you encounter.

Thereby you get a uniform look and feel, with a single simple timeline for development, for all phases.

Top comments (0)