How to explain to my client the difference between Front End and Back End?

Question

I'm currently managing a project to bring a medium-sized shop into the online world for the first time.

The very non-technical shop owner is failing to understand what "front-end" and "back-end" means, and I was wondering if anyone had any good ideas.

He currently understands front-end to mean the part of the website that normal users will see and use, and back-end as being the admin part of the website. But of course, the admin system is still front end — he just doesn't understand this.

He also thinks that the front-end can be created by anyone, in the same way anyone can put together a newsletter using MS publisher.

Answer 1

First off, it's not wrong of the client to refer to the admin side as back-end. It's actually fairly common terminology to call any aspects of a content management system that aren't publicly available the "back end." This confusion between the front and back end of a CMS and the front and back end of code may be a large part of the problem you're encountering.

---

If you need to explain the difference between front-end code and back-end code, try explaining that it's a difference in where the code exists.

To explain where the code exists, you'll need to explain the concept of a server. In explaining these concepts to ten-to-fourteen-year-old children (whom I assume have a technology skill level similar to your client), I've done this by saying something like:

You have a monitor [point to the monitor]. Usually it just displays the information on your computer here [point to the rest of the computer, or base of the laptop] but it can display information from any computer it's connected to [point to an ethernet cable if possible]. That's what the internet is; it's just a bunch of computers wired together where you can get information from any of them.

Some computers aren't used by individual people, and don't have monitors of their own connected. They spend all the time sending out information. We call them servers because they're like a servers in a restaurant. You ask the server for food and he gives you back whatever you ordered.
[I realize this analogy is inaccurate because the computer server is more akin to the restaurant chef, while the restaurant server is like whatever medium is bringing you the information, but I've found it's best not to overcomplicate things.]
Your computer asks the server for information, and it gets the right information from a database and sends it back to you. We call code on the server "back-end" code because it's like the back part of a restaurant. You don't see what's going on in the kitchen, but you know that they're pulling together the right food for you.

(At this point, you may find it helpful to explain the concept of a database. I've found it effective to say that it's basically just a large spreadsheet containing the information you need and to open up an Excel spreadsheet and fill in a couple of columns to demonstrate.)

So if you want to see a website, you type in the address of the website. That sends a request for information from that address out to a server, and it sends back the information you want, just like if you asked a server in a restaurant for a menu.

There's a big difference between a restaurant menu, and a webpage. On a webpage you have to be able to click on things to interact with them. You can do this because the server has sent your computer some code that tells the computer what to do when you click on various things. We call this code the "front-end" code.

On a website, when you want to know more about something, you click on it to request information. That's just like if you select something from a menu in a restaurant and ask the server to get it for you. The front end (menu/webpage) lets you request something (food/information) from the server.

Answer 2

Normally, I prefer to start with a example which may not be the project core but explains the client the philosophy behind. And once the client understand the concept he starts believing in you and then you should bring in the core topic. Let me explain you with an example. First try to explain you Front-end and Back-end idea with reference to something he is using in day to day work like Car. So, you can tell him that car's

• front-end would be the body, dashboard, steering controls, etc.
• back-end would be the engine, transmission line, power system, etc

When he understand this part then you relate each of these mentioned examples with your project like:

• car dashboard -> website admin page
• car body -> project website
• car engine -> html/js or whatever
• car fuel from fuel tank -> data from database

So, I think you got my point. First make them comfortable and then relate your example with the real problem.

Answer 3

reference: http://en.wikipedia.org/wiki/Front_and_back_ends

Front end is what the user sees and interacts with. Back end is what will process the data. The back end may leverage formatting and validation made by the front end or perform these tasks itself; e.g. when front end is limited to user input and validation is done server-side.

Answer 4

One way is to educate your customer. Let him read Wikipedia and ask him if he sees a difference between his current knowledge and the article:

The front end is responsible for collecting input in various forms from the user and processing it to conform to a specification the back end can use. The front end is an interface between the user and the back end.

In software architecture there may be many layers between the hardware and end user. Each can be spoken of as having a front end and a back end. The front is an abstraction, simplifying the underlying component by providing a user-friendly interface.

Reference: Wikipedia - Front ends and back ends

Another way would be to use a metaphor, as in the cars dashboard and all driver controls for Front End and the engine, steering mechanism and breaking functionality for Back End.

Answer 5

A customer probably doesn't need to know or care what a back end or a front end is. To the user it is simply a website and all they are worried about is the website to working to do what they need. The complexity of the details like this are things that we concern ourselves with, not them, so trying to explain to the customer is defeating the purpose of making software more usable.

Answer 6

Front-end and back-end are terms used to characterize program interfaces and services relative to the initial user of these interfaces and services. (The "user" may be a human being or a program.)

• A "front-end" application is one that application users interact with directly.

• A "back-end" application or program serves indirectly in support of the front-end services, usually by being closer to the required resource or having the capability to communicate with the required resource.

The back-end application may interact directly with the front-end or, perhaps more typically, is a program called from an intermediate program that mediates front-end and back-end activities.

Front application is that but which we can see and edit or work like games, billing software etc and the backend application is database which has collection of data executes when the front end gives request. People who do coding comes in Front end design and remaining comes in backend.

• Front end includes rtl description,synthesiser,verilog/vhdl entity,simulator...

• Back end includes floorplanning,place & route,packaging,testing...

Visual basic is a front end Access is a back end

Answer 7

Tell them the front end is the webpage on their browser usually written in HTML. The backend is the software on the server communicating with the HTML frontend page on their browser. Draw up a picture for them.

Answer 8

The client is confounding the terms "back office" and "back end"... which is not bad, within their domain. Educate them on communicating to the right audience with the right language.

Answer 9

Have your client think of a luxury hotel.

The front-end consists of the interior design of all places they're allowed to set foot in the hotel, in addition to the manners and dress of the staff they'll deal with directly.

The back-end will consist of the kitchen, boiler-rooms, rooms where they do their tons of laundry, the endlessly winding and cavernous employee-only hallways and ducts in the basement, the loading docks, and the hundreds and hundreds of people required to keep all these behind the scene concerns operating smoothly.

To address your specific client's confusion, surely the kitchen - being that it's operated by some world class chef who knows his or her stuff - will look really nice and super high tech. Might even be the kind of thing some of the patrons of the hotel would love to actually have in their room, but the reason they don't is because cooking for the entire hotel is still an infrastructural concern.

Your client's admin panel is not the back-end at all, but a nice abstraction - or simple set of dials - with which to control the back-end, much the same way the hotel patron's room phone (or concierge if wealthy) would be the abstraction through which most of the hotel's infrastructural functions can be invoked.

Answer 10

In the long-run it's best to explain the interaction between web servers and client machines, ie explain how initial back-end code is performed before the client receives their web page and how additional back-end interaction require more requests from servers to update the page.

If you must use a metaphor though, then say that front-end code is the skeleton, skin, and reflex muscles of a web page. That is, HTML controls layout, CSS controls look, and JavaScript controls basic interaction. Back-end code is the brains, ie the code that processes form submissions and database interaction of any kind.

Answer 11

Occasionally, we’re being asked some basic questions about software development specifics. That’s one of them. What’s the difference between backend and frontend development? If you want a more detailed answer, check the explainer at our blog. Here we cover the question in a nutshell. Frontend and backend software development: how do they actually differ and what’s involved? http://ddi-dev.com/blog/programming/backend-and-frontend-web-development-comparison/

Frontend

The term is quite self-explanatory. Frontend stands for everything that a user can see and interact with on a web-site: buttons, menus, images, text, etc. Basically, the frontend is a design that was infused with life as it has been written in a code. Every time you click a button or just hover over it and see changing color or some animation happening, it’s the frontend code acting. Although frontend development is considered to be slightly easier in terms of implementation, it’s not always so. Responsive design that dynamically changes as you resize a viewport, cross-browser compatibility, and merely general feel and look have much of engineering intricacy involved behind.

Backend

Every time you click to sign in, or look for a friend in a social media list, you experience the backend code. Backend powers the logics that support websites. The login example is perhaps the simplest one because it takes just looking for your account data in a database, validating your input and confirming that the account exists and is secured by the password you’ve just entered. The complexity of a backend part depends directly on what a website can do. As, for instance, Facebook news feed engine is one of the most intricate backend algorithms in the world: it learns your actions and alters the feed to make it as much engaging as possible. If it’s an ecommerce website with a handful of generic features, the backend complexity might not be that impressive.