Frontend vs backend, explained with examples
"Frontend" and "backend" are the two words you hear most when getting into web development, and understanding the difference helps you choose what to learn. The simplest explanation is the restaurant metaphor.
The restaurant metaphor
- The frontend is the dining room: what the customer sees and interacts with — the tables, the menu, the waiters. On the web it is everything that appears in the browser: text, buttons, colours, animations.
- The backend is the kitchen: the customer never sees it, but it is where the real work happens — dishes are prepared, stock is managed. On the web it is the server: database, logic, security, payments.
When you hit "Log in" on a site, the frontend collects email and password and sends them to the backend; the backend checks they are correct and responds. The two talk constantly.
What the frontend does
The frontend runs in the browser and handles look and interaction. The languages are HTML (structure), CSS (style) and JavaScript (behaviour). Here is a bit of frontend logic you can run right here:
let name = "Julia";
let hour = 20;
let greeting = hour < 18 ? "Good afternoon" : "Good evening";
console.log(greeting + ", " + name + "!");This is the kind of code that decides what to show the user based on the situation.
What the backend does
The backend runs on the server and handles data and rules: it saves users in a database, verifies passwords, calculates prices, protects information. Typical languages are Java, Python, JavaScript (Node.js), Go, PHP. Databases live here too, queried in SQL.
The backend is invisible to the user but it is where business logic and security sit: the engine under the hood.
And "full-stack"?
A full-stack developer can do both. You don't need to be one right away: almost everyone starts on one side and widens over time. In fact, at the start it is better to specialise on one of the two so you don't spread yourself thin.
Which to learn first?
| If you like... | Go toward | Learn |
|---|---|---|
| Graphics, design, what you can see | Frontend | HTML, CSS, JavaScript |
| Logic, data, "how it works inside" | Backend | Python or Java + SQL |
| Not sure yet | Start with Frontend | you see the on-screen result immediately, more motivating |
Practical advice for beginners: start with the frontend (HTML/CSS/JavaScript), because the immediate visual feedback keeps motivation high, then look into the backend when you want to understand "what's behind it".
Try both sides
LevelUpCode has paths for both worlds: HTML & CSS and JavaScript for the frontend, Python, Java and SQL for the backend. The career paths show how they combine toward a job. The first chapters are free.