↑ BACK TO TOP
open sidebar menu
  • Building Software Products/Frontends vs backends
    Knowledge Bases
    Analyzing Software CompaniesBuilding Software ProductsAI, it's not that complicatedWorking With Data Teams
    Sections
    1: Foundations
    2: Frontends vs backends
    The Details: Frontends and BackendsHow does a feature get made?
    3: Frontend
    4: Backend
    5: Deployment
    6: Building for Enterprise
    7: Analytics
Sign In

The Details: Frontends and Backends

The basics of how apps are built by their component parts.

bedrock

Last updated: July 4, 2025

It seems like I’m referencing the difference between a frontend and a backend in almost every single Technically post, so I figured it made sense to spend some time diving into what those really are, and most importantly, give you a real example of what goes into a frontend vs. what goes into a backend in a real life application.

This distinction – so important! If I’ve done my job correctly, you’ll begin to see all software you use as frontends and backends of varying shapes and sizes. So without further ado…

Frontends and backends: the restaurants of code

If you’ve been reading Technically for a while, you know that an application – like the one you’re reading this post on – is made up of just two parts: a frontend and a backend.

The best analogy I’ve thought of for frontends and backends is a restaurant. Say you’re having a lovely evening with the homies (after you’ve hugged and kissed them of course) and you stroll into your favorite upscale Brooklyn eatery. Your experience is interfacing with a few things:

  • A nice table with comfortable chairs
  • High quality food and drink brought to your table
  • Servers catering to your every whim

Fantastic. Behind the scenes though, there’s tons of logistical work that goes into being able to provide you with said experience. In particular, there’s an entire kitchen staff that worries about:

  • What should be on the menu
  • How to cook everything consistently and perfectly
  • Where to source quality ingredients from
  • How to prepare and store those ingredients
  • What to do in situations where ingredients are missing or go bad

As a patron, you don’t need to think or deal with any of this – you interface with the “frontend” of the restaurant, and the “backend” takes care of making sure the food that arrives on your table makes you want to leave a 5 star review.

It’s not a perfect comparison, but this is pretty much how I think of application frontends and backends.

Terms Mentioned

Frontend

Client

Serverless

Server

Framework

Backend

API

Deploy

Database

Operating System

The frontend’s job is to interface with the user and call upon the backend when it needs any sort of data to provide to the user. There’s a menu of things that the backend can do for the frontend – these are API endpoints – like sending a user’s profile information, creating a new user account, or accepting credit card information. As long as you’re accessing the frontend through your web browser, it can only be written in HTML, CSS, and JavaScript (the browser doesn’t support other languages).

The backend’s job is to take care of all of the data and logistics behind the scenes. It’s consists of the database, API endpoints for interacting with that database, and any other workflow related things like scripts for billing users, data scrubbing for compliance, and other such highly interesting and obscure tasks. 

🚨 Confusion Alert

The frontend and the backend of an app are not necessarily separated physically: they’ll often be deployed on the same single server, and even sit in the same master folder (or repository) of code. Literally, I’ve seen codebases with a /frontend folder and a /backend folder.

Real world example: Spotify

If you love music as much as me you’re probably using Spotify every hour, and are pretty familiar with the app. Let’s break down which parts of the Spotify app on your laptop / phone / browser are frontend, and which parts are backend. Hopefully you’ll be able to apply this same framework to other apps in your life (maybe even the app you work on). 

We’ll start with the artist screen.

Loading image...

I’ve picked a niche artist that most of you probably haven’t heard of, but that same logic applies to what the kids are listening to these days, like Kenneth Lamar or whatever.

What’s coming from the database

The first place I like to start is figuring out what “information” that I’m seeing on the page is data – meaning it’s stored in a database somewhere – and what is just formatting and visual elements. Here’s all of the stuff on this page that’s (probably) data:

  • The artist name

When does the data get loaded (pages and screens)

Access the full post in a knowledge base

Knowledge bases give you everything you need – access to the right posts and a learning plan – to get up to speed on whatever your goal is.

Knowledge Base

Building Software Products

How to make positive contributions to your product roadmap.

$199.00/one-time

What's a knowledge base? ↗

Where to next?

Keep learning how to make positive contributions to your product roadmap.

How does a feature get made?

Walking practically through how an engineer builds something.

Frontends vs backends
What's HTML?

A great way to prank your friends (and build websites)

Frontend
Whats CSS?

Making the internet look pretty since 1996.

Frontend
Support
Sponsorships
Twitter
Linkedin
Privacy + ToS