The structure of an application

Page Contents >

An app or online product can be built in a huge variety of ways, using different languages, methodologies and technologies.

However there are three features which you’ll need to incorporate into almost any digital product – a database, some software and a front end. The different parts of an application are often referred to as the 'development stack' or just 'stack'.

We’ve outlined these below to give you some areas to research if you’re starting out learning to build apps yourself or some topics and questions to discuss with any technical staff you work with.

Database

If your app needs to store information then you’ll need some kind of database. Database design is very important as it can have a large impact on how scalable your product is (which roughly means how many users can use your app at the same time).

You’ll need to decide on the type of database, what database management system (DBMS) you use and where and how it is hosted.

Typically databases fall into two categories: relational and non-relational.

Relational databases resemble tables with rows and columns and are the most commonly used type. They are usually accessed with a SQL-based DBMS like MySQL or SQL-server.

Non-relational, usually called ‘NoSQL’, databases store data in a variety of different ways. Often data is stored on documents with their own internal structure, allowing them to be more flexible regarding the needs of your app. Popular examples of NoSQL DBMSs include MongoDB and CouchDB but it is a growing area and there are many options to look into.

In terms of hosting, the main decision is whether to store all your data on one server or to have a distributed (‘cloud’) database which allows data to be broken up and stored wherever is most convenient. Issues like security and reliability are things to consider when choosing a host.

There are pros and cons to any database setup so spend some time researching or discussing what might be the best option for you.

Software

This comprises the core logic of your product. The software of your application (which along with the database is sometimes referred to as the ‘back end’) is the bridge between your users and the database, responding to their queries by selecting, manipulating or storing data.

In a web-based application software runs on a server rather than on a user’s (‘client’s’) computer. This means that, like a database, your software code will also need to be hosted if you are creating an application that uses the web.

Software can be written in any of a number of programming languages. Common choices include Ruby, PHP, Python, Java and C#.

Each language will usually have its own choice of application frameworks. A framework generates the basic structure of an application and provides you with a series of readymade commands to do common functions like accessing data and generating web pages. The Rails framework for Ruby and .NET for C# are good examples of this. There’s no obligation to use a framework but they can make it a lot easier to get an application up and running quickly whilst also reducing the amount of repetitive (‘boilerplate’) code that you need to write.

For most languages, there is a choice of Integrated Developer Environments (IDEs) to download. An IDE is essentially a very advanced text editor which is designed specifically to make it easy to write and manage software in a specific language or group of languages. Some of them, like Eclipse for Java-based languages, can build your software and can be integrated with a server and testing packages so you can do all your development, testing and previewing in one place.

However like with your choice of database, there is absolutely no right or wrong option; it’s important to choose something that works for both the developer and the product.

Front end

The front end (sometimes called the ‘view’ or ‘user interface’) is the part of your product that your users interact with. For a web based application the front end is a web site accessed via a browser.

Typically a web page is made up of:

  • an HTML (Hypertext Markup Language) document which gives it content and underlying structure
  • one or more CSS (Cascading Style Sheet) files which provide the style features like colours, fonts, sizes and layout
  • one or more Javascript files which controls the page’s ‘behaviour’. This can include things like conditionally showing/hiding areas of the page, validating data the user has entered and communicating with your application software to send and receive data

The HTML file is usually at least partially generated by your software, whereas the CSS and Javascript tend to be created by a designer and/or developer independently of the application.

These three types of file are combined and then displayed as a web page by a browser. Most browsers also allow you to view the raw files which can be a good way of learning how the page was put together.

Javascript has become such a popular programming language that some people have developed ways of running it as application software on a server. This has allowed people who were traditionally front end developers to be able to build entire applications. NodeJS and Go are two programmes that allow Javascript to run on a server. Javascript also has a choice of application frameworks. AngularJS and EmberJS are popular examples.

For other types of application (phone apps and desktop software) the front end is often written in the same language as the software itself.

It is this part of an application where you need to consider exactly how your users will be accessing your product. If it is available on the internet and they might be using a number of different screen sizes then you might want to think about the front end concepts of progressive enhancement and responsive design. If it is an app exclusively for touch screen devices (an iOS app for example) then it would be worth putting more effort into designing for touch and thinking about different gestures and phone and tablet only features like tilting.

It is typical to create prototypes of your user interface in order to test how well they function before or alongside creating the application itself.

It is worth putting a lot of effort into the front end. Both the visual design and the usability as a whole are important to focus on. When making the front end, keep in mind the concepts of user experience (UX), user interface design and accessibility.

Share:Facebook|Twitter|LinkedIn|