updated 21 April 2022
Maybe you were bombarded by the terms. So read on to have the full knowledge.
It all started as one just like what Mark Zuckerberg did in his platform Facebook. But nowadays it's getting bigger and bigger, more sophisticated technologies.
Well, it ended up into several subfields. Nowadays, they are too immense that you can simply focus on one. But of course, you must understand everything here, which is which. For example, others will start a debate which is the best framework or scripting language. But if you have the full knowledge, you would say, it's just like you are comparing two unrelated things.
Remember, in the end, it's just programming. Again, the only difference is that you are just having focus on one or two, because software development nowadays is already a very comprehensive field. The reason why there are several frameworks, for example, and several programming languages, is to solve several problems in development, so even if it seems they are the same, they are not. Those that gain popularity mostly are the very practical ones, so they are being used by developers.
And it's very important to understand this:
(photo credit: https://images.slideplayer.com/19/5827227/slides/slide_3.jpg)
Programming languages are considered high-level because they are not close to the machine language. It is just like the computer and the programmer meets halfway. Of course, the programmer would find it difficult to program at low level and the machine would not understand the human language. So, it's halfway. The job of any compiler is to translate everything so that the computer can follow the instructions of the programmer.
In the field of software development, we tend to work on abstraction by adding another layer just like the image above. Even nowadays, there is the current trend of no-code & low-code software dev, so that would be another level of abstraction.
A browser is an app that is programmed to run on your local computer. It is the user end where sites will be seen as formatted content, mainly because of HTML. But again, it's all bytes being transferred to another machine in the end. What we see is an outputted result, not 0s and 1s (representation of electric pulse).
And finally, if you never heard of computer network programming, it's worth learning the basics even if this is not your interest. It will give you the full understanding.
But again, to make the long story short, computers are communicating with one another. This started through an attempt to create a communication network that should not use a central core so that communication would still be available even if telephone lines were attacked: the ARPANET. It was made accessible to the public later on. This is the Internet nowadays. This should not be confused with the World Wide Web.
https://www.britannica.com/topic/ARPANET
Back then, we had File Transfer Protocol (and other older protocols like Telnet). Instead of wanting less, we wanted more, so that information could be accessible to all with less hassle. (Take note, even sending emails successfully back then was for the computer science students.) It was the World Wide Web that changed the world forever. The World Wide Web by Tim Berners Lee sparked the almost-endless capability of computer networking. By finding a way to display information just like a site, not through upload and download of FTP, he simplified things that would otherwise be unappealing to the common public: we interact through buttons, images, not through the console. (The World Wide Web is using the HyperText Transfer Protocol (HTTP). When we say protocol, it's how data will be interpreted). And then, we still wanted more: a dynamic website. And as you know, what we have today is a very sophisticated system and different technologies working together to achieve such.
If you are interested learning the hardcore, you want to read some of this information from the two leading organizations, the World Wide Web Consortium (W3C) and the Internet Engineering Task Force (IETF). Surely, that's not for the general population. It's mostly for computer scientists and hardcore developers but simply knowing it is worth it.
https://www.rfc-editor.org/rfc-index.html
The technologies that comprise front-end are technologies that reside on the browser.
Remember too that a browser is a program, much like anything that runs on your local computer but, of course, have the full Internet functions, even WebDAV and FTP most of the time. It's communicating in terms of the four GET, POST, PUT, DELETE and PATCH verbs of HTTP (HyperText Transfer Protocol is a very interesting topic in network programming). If you are interested to see that, you can check out my program:
https://github.com/xdvrx1/lightweight-web-server
So, for example, JavaScript and all technologies that
mainly reside on the browser
are considered front-end.
Vue.js is considered to be a framework
of JavaScript for web interfaces
while we can say that Angular is for
heavyweight development.
Twitter Bootstrap is mainly for the layout
across multiple devices, the aim is
a correct display across devices.
(A framework is a shortcut so that
you as the developer will not manually
do all the tedious infrastructure, you
can simply focus on your development.
Now, you just need a framework when
it is really needed. As long as
you can do the project manually with
ease, you don't want to use a framework.)
If in case JavaScript was used to fetch data from a database, this is still not back-end dev. The JavaScript code would only relay that to a certain program running on the server side. So make sure, you are not confused with this kind of situation.
If your code is directly talking to a server or directly manipulates a database, that is considered back-end. It resides on the server side.
For example, when a page is requested, say, a PHP code is in charge of outputting the HTML, the page that a user will be seeing is the end product of PHP.
But why do we need to code in PHP if the end result is simply an HTML? Why not simply write directly the HTML document?
If your site is simply static, well, you can do that. But if your website is just like an app, then you need to have a script to automate things for you. The script will do the job that otherwise you would do manually.
Java also, other than networking, is capable of doing back-end jobs paired with several technologies, just like the Spring Boot framework.
So, combining things together, if a developer is talented enough to handle both server-side and browser-side, he/she can claim that he/she is a full stack developer, much like Mark Zuckerberg when he built his Facebook in the early days of this platform.
It is very important to mention HTML because it's the endpoint of all development. Others consider HTML as a programming language.
Take note, IT IS NOT A PROGRAMMING LANGUAGE. Rather, it is a markup language.
HTML came from SGML (Standardized Generalized Markup Language) and SGML is also a markup language. You can also call a markup language a metalanguage. It deals with annotation. Think of it just like the practice back then when a writer submitted his written work so that it could be published. The writer would leave his/her annotations so that when printed, it would be exactly the writer wanted it.
https://www.ncbi.nlm.nih.gov/staff/beck/xml/markup/I-A.html
So the next time you encounter these terms you will not be shocked just like when you don't have the full understanding yet. Again, they are just programmers (with, of course, different focus) in the end.