NelsonLabs

Frontend vs Backend

One of the most important distinctions in web development is frontend vs backend. These are two completely different jobs, requiring different skills, even though they work together to create the same product.

ANALOGY

Real-world analogy: A restaurant. Think of a restaurant. The frontend is everything the customer experiences β€” the dΓ©cor, the menu, the tables, the way the food is presented on the plate. The backend is everything in the kitchen β€” the chef, the ingredients, the recipes, the supply chain. Customers never see the kitchen, but without it, there's no food.

FrontendBackend
What it isWhat users see and interact withThe system running behind the scenes
Runs whereIn the user's browserOn a server (a powerful computer in a data centre)
LanguagesHTML, CSS, JavaScriptJavaScript (Node.js), Python, Java, Go, etc.
FrameworksReact, Vue, Angular, Next.jsExpress, Django, Flask, Spring
Deals withLayout, design, interactions, animationsDatabases, authentication, logic, APIs
Example taskA button that submits a login formChecking if the password is correct and responding

What is an API?

An API (Application Programming Interface) is the communication bridge between frontend and backend. The frontend says 'I need the user's profile data' β€” the API receives that request, fetches it from the database, and sends it back. Think of an API as a waiter β€” you tell the waiter what you want, the waiter tells the kitchen, and the kitchen sends back the food.

What is a database?

A database is an organised system for storing data permanently. When you create an account on Instagram, your username, password, and profile info are stored in a database. Every time you log in, the backend checks that database to verify who you are. Common databases include PostgreSQL, MySQL, MongoDB, and SQLite.

NOTE

Full-Stack Development. A full-stack developer works on both frontend and backend. This doesn't mean they know everything β€” it means they're comfortable working across the full web application stack. Many teams have dedicated frontend and backend specialists, but full-stack developers are highly versatile.