Frontend vs Backend

Puzzled between the difference between Frontend and Backend?

When starting to learn about Web Development, I remember struggling to understand the difference between Frontend and Backend, in order to try and understand this lets first define what is a website?

What is a website?

A simple website is typically a collection of HTML documents with CSS styling applied, linked using Hyperlinks (JavaScript may also be present for user interactions and animations). Both HTML and CSS are natively understood and interpreted by the browsers and so is JavaScript. Meaning that the 3 technologies together are the building blocks of any website. These 3 technologies are the typical makeup of the websites front-end. A front end is what the user sees when visiting a website. It is the visual part you can interact with.

Backend vs Frontend

Any website can also have a backend - aka some service that lives on a server capable of communicating with the front end of the website to send it data. For example the front end may be requesting user data from a database to populate a user profile page. Front end only websites do not have a backend and do not usually have a database so are considered static. A static website means that the pages are always the same and the pages do not display differently depending on who you are, for example different users see different data in their profile page that is relevant to them. Backends are usually created for larger websites that need to handle user signups, user profiles, user messaging, payments and other useful actions. Static websites are more of a business card and simply provide information Every website has a front-end and some also have a backend.

Some reading materials to learn more about websites and the basics of the web technologies like HTTP:

  1. How the Web works
  2. HTTP Basic Introduction
  3. Frontend vs Backend
  4. Whats the difference between frontend and backend?
🔥 If you enjoyed this post then you can keep up to date with my latests blogs posts & courses by following me on Twitter and checking out my code school for some hands on guided coding practice.