Overview

All modern UIs are single page UIs. A single page consists of the following parts:

  • The top part is the header and it consists of a few metatags (title, search words) and links to “css” files.
  • An HTML fragment in the middle is for the main content.
  • The bottom part is a list of “js” files.

Since we want to keep our UI independent of any tooling and DevOp, we take the following approach.

  • We create a JSON file listing all metatags.
  • List all “css” file in a text file. To make it optimal, we have a version of this text file listing all minified files.
  • Create one HTML file for the middle portion.
  • List all “js” files in a text file. Similar to “css”, we have a version of this text file listing all minified files.

Since our focus is what goes inside the middle part, let us briefly discuss the top and bottom portions and get them out of the way.