HTML, CSS and JavaScript are the only tools needed for frontend developers. Nothing else!

Debunking Frontend Myths

During a webinar, when asked what frontend is, many attendees (recruiters and business developers) gave the same answer: the part of the website that is visible to users.

This definition is missing something essential.

The Frontend encompasses every single thing that users can interact with. 

When you’re driving a car, the GPS is part of the frontend system; it’s an interface you engage in a dynamic way. The users interact with it to access information coming from the backend.

It is therefore not just about web development – It is about interaction. The USER must be considered in any definition of the frontend.

The Industry is still referring to frontend as web-focused. The term UI (User Interface) developer emerged a few years back to include more areas such as mobile UI apps or any UI users can interact with.

Technologies Involved in Frontend

The technologies involved in frontend fall into several categories: programming languages, markup languages, styling languages, and frameworks. The three main languages of the web frontend are JavaScript, HTML, and CSS, and they fall into different categories.

Programming Languages

Programming languages are used to write dynamic computer programs. JavaScript is the most widely used programming language; every search engine uses it. It is a must-have skill for a frontend engineer, as the frontend is extremely JavaScript-heavy.

Typescript is another example of a language used in frontend development. Created by Microsoft in 2012, it is essentially JavaScript that scales, to verify if JavaScript code is fake before it is run. JavaScript alone will not verify if something is fake or not until you start using it. Typescript on the other hand checks the code before it is executed. That is why any frontend engineer should be using Typescript by default.

If a frontend candidate does not have Typescript skills, you should check with the hiring manager if that candidate is someone the company actually wants. If the answer is no, you can suggest this engineer a Hackjam session to bring their Typescript skills up to speed.

Markup Languages

Next, we have markup languages like HTML, SVG, XML, and Markdown.

What is the difference between a programming language and a markup language?

We’re glad you asked.

To answer this, we will compare HTML with a programming language like JavaScript.

HTML is a markup language: a set of tags that specifies the headings and paragraph structure to arrange material on a webpage. It structures elements and makes them look appealing. HTML is thus a static language: its purpose is primarily visual and structural, and as a user, you cannot interact with it. This is what a markup language does.

By contrast, unlike a markup language, JavaScript allows you to interact with the information on a webpage by sending information you enter from the frontend (like a search query) to the backend. JavaScript gives the website its dynamicity so that you can request the information you want from it, and that information is retrieved from the backend.

Styling Languages

Styling languages add extra flavour and dimensionality to structured material written in markup languages. Some prominent frontend styling frameworks are SASS, Less and Stylus. They all augment the capabilities of CSS.

CSS, one of the three original basic languages, qualifies as both a markup language and a programming language, but it has evolved more fully into a styling language. CSS provides colour to your material to make it more beautiful and interesting.

Frameworks

The title of this essay is a bit misleading. In fact, HTML, JavaScript and CSS are the only technologies natively working in web browsers but they are often hidden behind frameworks. These frameworks make the work of a web developer faster and more efficient.

Common frontend frameworks include React, Svelte, Angular, and vue.js. There are many more frameworks on the market that we can included here.

Without a framework, developers are doom to repeat the same basic code needed to build an application over and over gain.

Communication Between Frontend and Backend: HTTP

Communication between the frontend and backend of a website is mediated through the transport protocol HTTP(S) (HTTP stands for ‘hypertext transfer protocol’, while the optional ‘S’ is for ‘secure’).

When you request information from the frontend of a website, your request is sent to a server in the backend. Just like a server in a restaurant, the server brings what you requested, with HTML and CSS rendered into your browser for you to begin interacting with it.

HTTP requires a format for representing data so that it can be sent like a package between frontend and backend. The format JSON does this. It is equivalent to the notebook the restaurant server writes your order in.

If an engineer does not know JSON, that means they probably are not a true frontend engineer, because they do not understand the fundamentals of communication between frontend and backend.

Takeaway and tips

By understanding your frontend jargon, you are better able to fulfill your goal as a recruiter. You can sell frontend jobs, vet candidates, and write precise and enticing job descriptions. You can ask for specific skills in interviews and know the value of each skill in the position that must be filled.

Additionally, you are better able to challenge the hiring manager. For example, if the hiring manager tells you that the company needs a developer versed in an outdated or obscure technology like jQuery, you can immediately counter with “I’m not going to find a developer who does jQuery. Why are you using it?”

Frontend is immensely valuable: it is web applications, mobile applications, and everything the user interacts with. Your knowledge of frontend will produce sudden insight moments in interviews, such as if a candidate is a true frontend engineer or has several additional useful skills. That is why it is important to constantly update and refresh your knowledge of frontend.

Additional tips for frontend knowledge: 

If you’re unsure of the different technologies in any of the tech categories (e.g. frameworks), you can search “Angular vs.” in Google, and autocomplete will fill in all the other options in that framework category.

This was HTML, CSS and JavaScript are the only tools needed for frontend developers. Nothing else!

If you found this useful, please share it around you and don't forget to sign up for our Ultimate Bootcamp for Tech Recruiters. It will help you speak the IT language.

Until next time, take care!