You've probably heard the terms front-end, back-end, and full-stack development. But what do these terms actually mean?

Let's get the easy things out of the way first. Firstly, these terms are specific to web development, as front-end relates to web browsers, and the back-end relates to web servers.

Next, a full-stack developer is someone who does both front-end and back-end development.

Okay, but now let's get to the meat: What do back-end and front-end developers do?

Front-end developers create the code that ends up in your browser. That is, when you navigate to a web page using your web browser, what really happens is that your browser accesses some code from the internet, and then interprets that code to display a webpage. In fact, most browsers allow you to right-click on a webpage, and then choose an option called, "View Page Source" that allows you to see some of the actual code that is powering that webpage.

Again, every webpage that appears in your browser is a result of your browser getting code from the internet and turning that code into the visual elements that a user can view and interact with. This is the "front-end code," and is precisely the code that front-end developers create.

Generally, the front-end code consists of a combination of three coding languages: HTML, CSS, and JavaScript. Why do we need three languages?

HTML is the language that forms the structure of the page. That is, HTML code can say, for example, that this webpage will contain one header, three paragraphs, and a footer. Thus, HTML is the skeleton of the page.

CSS is the language that is used to describe the visual aspects of the webpage - that is, how the page will actually appear to the viewer. So CSS is what's used to create the colors, the fonts, the sizes, and the positions of everything on the page.

With HTML and CSS alone, though, a webpage is merely something pretty to look at. It's JavaScript that makes a webpage functional. That is, JavaScript is the code that describes what happens when a user clicks on a button or hovers over a dropdown menu.

Now, let's tie these concepts together to nail down what front-end development is. Front-end developers write HTML, CSS, and JavaScript code that a web browser accesses and uses to display a web page that a user can view and interact with.

Many front-end developers work with all three languages. Some, though, focus mainly on HTML and CSS. These latter developers often act more as designers, as they're concerned solely with how the webpage appears. The typical front-end developer position, though, is dedicated mostly to JavaScript, since it's JavaScript where most of the complexity lies, as coding functionality is generally more complex than coding appearance.

Now that we've explained front-end development, what is back-end development?

We've mentioned that front-end code is the code that your browser accesses and processes to display web pages. Now, where does the browser actually get this code from? It gets the code from the internet. But let's explore this in more detail.

When you navigate to a website with your browser (by clicking on a link or typing a url directly into the url bar of your browser), your browser uses the internet to connect with a server. A server is simply a computer whose primary function is to sit around and wait for other computers (like yours) to connect to it.

So when you go to a webpage - say google.com - you're essentially having your browser reach out to a server owned by Google and asking the server for some front-end code. The Google server then responds by transmitting the front-end code to your browser. Your browser then takes this front-end code to display the webpage.

Now, how does Google's server know what front-end code to send to your browser? That's where back-end code comes in. The back-end code is the code that is written for the server. So, back-end programmers code the server so that it knows what front-end code to send to your browser. It takes some time to wrap one's head around this concept, but the main point is that back-end code is to written for the server, while front-end code is written for the browser.

But there's more. Most web applications allow a user to save information on the web. For example, if you upload a picture to Facebook, you're allowing Facebook to save the picture. Even if you've lost your computer, that picture would still be on Facebook. The way that information is saved on the web (also known as "the cloud") is by use of databases.

Now, think for a moment: For Facebook to store your photo - where does the Facebook database live? In your browser or on their servers?

Answer: Web databases live on servers. If your photo only remained on your laptop, none of your friends would be able to see it . And you'd never be able to see your own photos from a different computer or your phone. So all data is stored inside databases on the servers. This way, the data can be accessed by all different platforms and all different people (such as your Facebook friends).

Because databases live on the server, and back-end code is code for the server, it's back-end code that runs the databases as well. So if you upload a new profile photo to Facebook, your browser (with its front-end code) sends that photo to Facebook's server, and the back-end code on the server then processes that photo and stores it in a server database. Similarly, when your browser asks to retrieve something from a database (such as viewing your friend's profile photo), the browser needs to ask the server for it, and the server's back-end code retrieves the photo from the database and sends it to your browser to display it.

While front-end code is pretty much exclusively HTML, CSS, and JavaScript, a whole variety of languages are available for back-end development, including Ruby, Python, Java, PHP, C#, and more. (In fact, JavaScript can be used to write back-end code too.)

No matter the language used, though, back-end code is all about functionality. Whereas a language such as CSS is about visuals, back-end code is all about data processing and the preparation of front-end code to be delivered by the server to the browser.

And this is where we get to the plot twist: The skills used in front-end development and back-end development are pretty much the same. Writing functional code for the front-end (with JavaScript) and for the back-end (with a choice of languages) are very similar. And while the languages and frameworks may be a slightly different between back-end vs. front-end development, the core principles and ideas are the same.

And that's why it's actually not that difficult to be a full-stack developer. Because once you know how to code one end, it's not a big jump to learn the other end. So, if you've been deciding whether to learn one or the other, my recommendation is that you not limit yourself to just one. While you may want to start with one end, realize that once you're proficient in it, it's a small jump to learn the other end as well. In fact, that's why many web development tutorials and coding bootcamps (such as Actualize) teach full-stack development.

So don't box yourself in! If you're learning web development, you can learn both front-end and back-end development, as they're not terribly different from each other.

Back to all posts