What's the Stack?

I think it's human nature to invent terms and acronyms as part of a shared culture. Whether to bond a community together by demonstrating that you're in the know or making it quicker to communicate amongst a group of peers sharing a particular specialism.

Inevitably there's a bit of cross over and any professional community tends to have a bit of both. The downside of all this is that it is necessarily exclusive, difficult for outsiders to understand.

I once had a colleague who insisted on saying 'UA' rather than 'web browser'. While the the term 'User Agent' is understood by web developers in dry technical scenarios (it actually might not be a browser), awkwardly crowbarring its acronym into informal discussion is needlessly obscure. Even I had to ask what they were on about the first time around.

I once had a colleague who insisted on using the acronym UA in place of 'web browser'

You may feel this way about the term 'stack', often bandied about in the world of web applications or tech profiles on LinkedIn as if everyone knows what it is. First we'll get to know what it means, then we'll consider different types of web app stack you may encounter. In future articles we'll dive into technologies discussed here in more detail, but first up it's important to give you a bird's eye view.

Stacks of Stacks

The term "stack" in the software industry is highly contextual and regularly used for slightly different things. This means that if you heard a software developer use it in a particular meeting or discussion and were getting your head around what was being referred to, the next time it may refer to something slightly different leaving you feeling a bit baffled.

Broadly speaking, as it relates to our subject of web apps, and as you may have previously inferred, 'stack' means technology stack.

The relevance of it being a 'stack' is the idea that one technology builds upon others that sit under it; that there is some kind of top to bottom hierarchy. A good example of this is the web / internet. Believe it or not the internet (inter-network) was invented in 1969 to mitigate the impact of a nuclear attack on US computer networks. Those interested can read about ARPANET on Wikipedia. Cat pics, memes, online video and ill-advised late night purchasing are all facilitated by the World Wide Web, invented in 1989 by Tim Berners-Lee at CERN 'on top' of the internet. The internet is like the supply network for the web, roads, postal addresses, haulage and secure couriers to deliver web content to your browser. The whole kit and caboodle conceptualised as a stack of different technologies with bits of data over physical wires at the very bottom, through various networking protocols in the middle and the web at the top relying on all of it.

Cat pics, memes, online video and ill-advised late night purchasing are all facilitated by the World Wide Web

While the mental image of a stack is useful conceptually in the above instance, much of the time it is used in the same spirit but to refer to a group of related technologies which may or may not be hierarchical, in the delivery of a certain kind of service or software (e.g. a web application).

Generally Speaking

In the broad context of web apps there are two ways you'll hear 'stack' used to refer to things. The first is more generalised and used when talking about online infrastructure or a developer's skill set without getting into the specifics of the actual technologies being used. Let's refer to it here as the generic web stack.

The generic web stack is described to as running from front to back rather than top to bottom. Front and back here can be thought of a bit like front of house and backstage at the theatre.

The front-end (also called client-side) is where your customers interact with the app, communicating your brand, rendering content and providing forms to log in, make purchases, communicate with other users, schedule meetings etc. Front end technologies run inside your computer or mobile device's browser and include Hypertext Markup Language (HTML) which defines page content, Cascading Style Sheets (CSS) used to apply layout, design and animation as well as JavaScript to add interactivity like updating your shopping cart or displaying irritating cookie notices.

The back-end (also called server-side) is pretty much everything else, anything you can't see directly in the browser. In our theatre analogy this would be the sound desk, lighting, fly floor, scaffolding and wardrobe department. All just as fundamental in delivering the experience but hidden out of view.

Rather than running in a visitor's browser on their computer or device, back-end technologies run on a computer (or virtual computer) somewhere out in the world, accessed via the internet. These computers are usually referred to as a 'server' given they run a piece of software called an HTTP server which waits for, and responds to requests for web pages or other resources like image and document downloads. HTTP stands for HyperText Transfer Protocol if you were wondering.

Where a website is highly interactive, such as a web app, servers may also run other programs involved in the delivery of the app and carry out automated tasks to keep things running smoothly. Most commonly this includes executing code written by a web developer and running a database. The application code is written in a language referred to as a back-end or server-side language; common languages suited to web apps are PHP, Node (JavaScript), Python, Ruby, Java and C#. The database is used to store editable content like blog posts or persist application state; whether a user is logged in or not, whether they prefer the light or dark theme or perhaps whether they are an administrator. There are different types of database and each can be interacted with by a developer to retrieve and update data using what's called a query language. If you've every heard someone talking about SQL as in the popular MySQL database (often pronounced 'sequel') it stands for Structured Query Language.

You'll often see developers describe themselves as front-end, back-end or full stack based on their areas of expertise

Now you know what is meant by front-end and back-end. When referring to the whole lot, the term full stack is used. You'll often see developers describe themselves as front-end, back-end or full stack based on their areas of expertise.

Give Me the Specifics

The second way you'll hear 'stack' used in the context of web applications is to refer to a particular subset of web app technologies. The actual types of front-end libraries or back-end languages or databases which are used. In truth there aren't any hard and fast rules here.

Acronyms may be used as a shorthand and in a moment we'll look at some of the most common ones to give you a flavour. It's important to note that the acronym isn't exhaustive but enough to give the listener the gist of the app setup.

Referring to the generic and specific stack may confusingly be combined in the same sentence. For example it's perfectly valid to say:

I'm a full-stack developer working with the LEMP stack

Which means that:

1. I'm a developer who works with front-end and back-end technologies
2. That I primarily work with web apps which run on Linux and use the Nginx HTTP server, MySQL database and PHP server-side language (specific stack)

So without further ado let's decipher some common stack-ronyms 😅.

LAMP / LEMP

• Linux, Apache, MySQL, PHP
• Linux, [E]Nginx, MySQL, PHP

Linux refers to the operating system running on the server, Apache or Nginx HTTP server (pronounced 'engine x' hence LEMP not the unpronounceable LNMP), MySQL is the database and PHP the back-end language. You'll notice here that front end technologies are not explicitly mentioned. At the time this flavour of stack rose to popularity, modern front-end frameworks and libraries like React didn't exist. These days LAMP or LEMP apps often use them (I often work with a LEMP stack plus React for rich user interfaces).

MEAN / MERN

• MongoDB, Express, Angular and Node
• MongoDB, Express, React and Node

MongoDB is the database here, Express a minimal back-end web application framework and HTTP server, Angular or React front-end JavaScript frameworks for interfaces and Node (JavaScript) the back-end language. These stacks are considered full stack JavaScript, as it is the primary language on both ends. No explicit mention of the server operating system, but you could put money on the fact it's going to be some flavour of Linux.

TALL

• Tailwind, Alpine.js, Livewire and Laravel

This one is a bit different. In this instance we don't even talk about databases. Tailwind is a CSS utility library, Alpine.js a front-end JavaScript utility library, Livewire a framework for Laravel - mentioned at the end and itself a framework 😖. Both written in the PHP back-end language. In reality a TALL stack is a subset of LAMP / LEMP. Just to confuse the uninitiated.

JAM

• JavaScript APIs and Markup

The highly ambiguous JAM stack started gathering some traction some five or so years ago. JAM sites are based on the idea that the front end of the app, the JavaScript and Markup, does all the hard work so there isn't a back-end in the sense we've been discussing. Instead they load in any dynamic data from one or more services elsewhere via Application Programming Interfaces (APIs). Think of APIs as web addresses which send back data instead of web pages. Coined by companies providing Software as a Service platforms to host this type of site, like Netlify. A couple of years ago they decided it should be rebranded Jamstack.

WISA

• Windows, IIS, SQL, ASP.Net

The stack from everyone's favourite Redmond based powerhouse, Microsoft. Windows here is the operating system of the server, IIS (Internet Information Services) the HTTP server, the aforementioned SQL referring in this instance to Microsoft SQL server (the database) and ASP.Net (pronounced ASP Dot Net) a server-side web application framework written in Microsoft's C# language.

My Stack's Not Here!?

Many, many, more stacks exist which don't have catchy acronyms so are not mentioned above but this article is to give a flavour of what it's all about, rather than provide an exhaustive list. My apologies to any Python, Ruby or Java colleagues out there working with Django, Rails or Spring Boot!

Wrapping Up

So hopefully now you get a bit more of an idea what this web app stack stuff is all about. In the coming weeks we'll start diving in to some of the different concepts and technologies we've talked about so if you're trying to get your head around what a database actually is, or what React does, don't worry we'll get to those.

Look forward to seeing you next time!

Joby Harding is a web app engineer and consultant with 15 years industry experience. As a youth he played with photocopiers.