Frontend? Backend? The two sides of programming

| Articles | by Diego Casillas
Frontend and Backend

Programming is complex. There are always many things to take care about, but we as developers always try to simplify and divide our problems.

Programming is simple. There are always many things to take care about, but that’s why it’s easy. We rarely need to deal with only a huge problem. Instead, we need to deal with many little problems, which is convenient because good programming practices encourage us to isolate chunks of code by functionality.

There are numerous ways to achieve that, and one of the most important of them is having our software separated in two clearly differentiated layers: Frontend and Backend. If you are learning about programming, you have probably heard about these terms everywhere, but still not know what they are.

Well, that’s easy: Frontend is what the user interacts with and Backend is what powers it, roughly speaking. So the user uses a client, and what powers it is a server. Client-side and Server-side. Boom.

Frontend

Think about your favorite app or website. At the very least, it displays some info. It wouldn’t be crazy to bet that it also has some buttons that you press and make stuff happen, like sending a message or opening a picture.

When you launch that app or visit that website, you are using the client-side of the software. This side doesn’t need to know about how the server-side works. It just needs to fetch the data from the server, process it to display it as necessary, deal with the user’s input and send data to the server. Let’s imagine that you are using Spotify and press an Add new playlist button. Then you start filling the requested data, such as the playlist title or its privacy settings. You add a couple of nice songs from The Bee Gees and hit the Save button.

What happens next?

Backend

Obviously your new playlist is saved. Now everytime you use Spotify you can listen to that playlist in shuffle mode. It’s like magic, but there’s no such thing. How did it happen?

When you pressed the Save button, your client sent the data from your playlist to the server. In order to do that, it probably made a POST request to a REST API served by the server. Then, the server processed the data, making sure that everything is OK and legit and stored it in a database. A database is probably the most important part in the backend. It makes possible to make our data persistent and retrieve it when needed. This server may be used by more than one client, as it’s completely independent from the frontend. The same logic applies the other way around: a client may use more than one server.

Technologies

As you probably know, different technologies are used on each side. Frontend web development technologies include HTML, CSS and JavaScript (either vanilla or frameworks, like Angular, Vue, React, Ember…). Backend technologies are wider, including PHP, Python, Node, Java, C#, Ruby, Golang… along with different database systems like MySQL, SQLite or MongoDB.


Knowing the difference between frontend and backend (and most importantly, knowing how they interact together) should be the keystone to any developer building modern apps. They are both very important and mastering any of them takes many years. Those who become experts at both sides refer themselves as full-stack developers.

Will you be the next one?

Diego Casillas

I am a Web Application Developer. I was bored so I created this blog to share stuff about programming.

Twitter | GitHub | LinkedIn
Author image

Comments

All field are required