Front End and Back End explained to Granma

lordebasta
5 min readDec 17, 2021

Hi, if you heard the terms Front End and Back End, or even Full Stack Development, but don't know exactly what they mean, you are in the right place. I’ll do my best to explain it to you.

Photo by Domenico Loia on Unsplash

Web dev

For starters, we are talking of web development so this is regarding for example the sites you are able to browse with your browser. Think about Medium. You enter medium.com in your search bar and the home page appears with your account already logged in and a series of stories you might be interested in. What happened? I like to think about the parts in the system as people. You are you and the browser is a person you tell what you want to see and it goes fetch it for you. You want to see the journal, the browser will go ask the journal and will display it on your screen. Do you want to read some stories on medium? The browser will ask the medium guy for some stories. The medium guy will ask who you are and depending on that will suggest a list of stories and the browser will show you that. But the medium guy won’t just give you a list of links, like “Yes the stories for you today are www.medium.com/bulabulabula, www.medium.com/ilikemustard, www.medium.com/iliketrains”. They will send the browser a very nice website page with a nice design with the suggested stories on it, and some other stuff.

It’s just like a shop

So as you can see you receive a very nice view of the information. That’s the front. Like the front of a shop where there is all the merchandise exposed. But in a shop, there is also the back where the merchandise is made, prepared, and stored before it can be sold. So the shop can be divided into these two parts: the front and the back. Perfect, we are getting there.

What are then these two parts in a website like Medium? The Front End as we said is the nice web page we see, with all the nice design and buttons and text with the perfect font to make it appealing and nice for us. In the Back End of Medium is where all the stories are stored, and some other stuff and where the webpage is made for you. Let me explain a bit better. Somewhere there is a database with all the Medium stories. When you ask for your homepage, the medium guy in the front of the shop asks who you are and tells that to the guy in the back. Now, this guy will have to do some work because will have to see your information stored somewhere to see what you like. You like cars, perfect. The guy then will go look for stories on cars that may interest you and will put them on the webpage. Then will give the webpage to the front guy, who will give it to you.

Why not have only one guy to do everything?

Imagine that it’s a big shop, there are several customers. If there is only one employee then one customer will be served at the time. Not so good also because the guy will have to go in the back and the new customers who enter won’t find anyone in the shop unless they wait for the guy to come out of the back, that’s not very nice. If there is a front guy and several back guys, the process is smoother. The front guy will talk to the client and ask a back guy to do the hard work. While this is elaborating and creating the page, the front guy can assist another client and assign another back guy to this client. In this way, there is always a person in the front ready to talk with the customers.

Photo by sgcdesignco on Unsplash

Front End Development

So the front-end developer has the job to create the template of the webpage, he will choose the nice fonts and colors, the position of the elements of the page, where to put the suggested stories, where to put your profile image, where the settings and so on. They won’t care so much about the actual content, e.g. which stories will be displayed, because these will change for each user.

In the front-end dev, the technologies and languages required to know are HTML, CSS, javascript, and/or some frameworks like Vue.js.

Back End Development

Photo by Jan Antonin Kolar on Unsplash

The back-end developer will write algorithms that elaborate information in order to show the right content to the user. These can be written in a lot of languages like javascript (Node.js) or C# or Java, etcetera… But let’s not forget that most sites also have information stored, like Medium has all its stories stored in some database somewhere. The back-end code has to interact with the DB in order to search the stories (modify, create, or delete them). So the back-end developer has to know how to write queries for the DB in a language it can understand, like MySql or NoSql.

Full Stack

A full-stack developer is a person who works both on the front-end and the back-end. It’s the two previous points put together.

Thank you for reading! I hope it was useful for you. If you have anything still unclear or you think of something to improve, comment, please. It’s much appreciated. Have a great day!

--

--