How are they different?
If you are new to the web development industry, you may have heard people refer to themselves as Frontend developers, Backend developers or even Fullstack developers. Even though it may seem confusing at first glance because they are all writing code to build websites, these three roles are actually very different and have different job responsibilities. Before we dive into job details of each role, let’s look at an example to help you understand better.
Suppose we are building a smart robot that can take people’s command and provide assistance. The exterior appearance of the robot and how the robot interacts with its clients can be considered as the responsibilities of Frontend developers. Frontend developers need to make sure that when a client approaches, the robot will react quickly and provide an awesome user experience while serving the client. Also, it is Frontend developers’ job to make sure that the robot always looks visually appealing to the client.
In contrast, how the robot thinks, makes decisions, or memorizes its clients will be considered as the responsibilities of Backend developers. Backend developers need to develop logics to help the robot make smart decisions and remember what he has done in the past. They can be considered as the brain of the robot. The appearance of the robot may change, but the brain will always stay the same, which is why most of the time Frontend has a faster pace than Backend does.
Perhaps now you have a better understanding of how Frontend Developers and Backend Developers different from each other. Let’s look at each role in more detail. We’ll get to Full stack Developer at the end of this article.
Responsibilities of Frontend Developers
Frontend Developers are responsible for the visual appearance (User Interface) and data presentation of the website as well as how users interact with the website (User Experience). When a user visits the page, source codes will be downloaded from the server to the users’ browser, since all source code can be viewed by anyone who can access the website, most companies choose to keep their business logics or secret formulas at the Backend and only send the results to the Frontend. Also, taking into account the fact that some users’ devices may not be that powerful, jobs that require heavy calculation are often done at the Backend. Frontend Developers will focus on making sure the same website will look astounding on devices of all sizes.
In addition to visual appearance, search engine optimization (SEO) is also an important responsibility of Frontend Developers. Frontend Developers need to design their page layout and structures carefully, so search engines can read and understand their websites with ease.
Skill sets of Frontend Developers
It’s not possible to list the entire skill tree of Frontend Developers here, so instead we will only list some core skills. Starting from the basic, Frontend Developers must understand HTML, CSS and Javascript. They will use HTML to structure the website, Javascript to control Frontend logics, and CSS to change the appearance of the website and make it pretty or to create awesome animations..
Basic skills: HTML, CSS, Javascript
After they master the basics, they will need to learn Frontend frameworks to boost their productivity. Angular, React, and Vue are the three most popular frameworks. Some companies that have a longer history might still use jQuery.
Frontend Frameworks: Angular, React, Vue, jQuery
To take it further, many Frontend Developers will learn preprocessor languages like TypeScript, SASS, SCSS, Pug, Slim, etc… The purpose of preprocessor languages is to speed up the development process by reducing what the developer has to type or simply make the code looks simpler to increase maintainability. Code written in preprocessor languages will still need to be compiled though before they can be shipped to the browser since browsers still only recognize HTML, Javascript and CSS.
Preprocessor Languages: TypeScript, SASS, SCSS, Pug, Slim, etc…
Beside from the skills mentioned above, it is also very important that Frontend Developers learn to use public libraries. Public libraries will often provide useful functions or interfaces that can be used directly. They provide their area of expertises, so Frontend Developers can focus on their core business logic. Some well known and popular libraries are Bootstrap, RxJS, D3JS, GreenSock, etc…
Public Libraries: Bootstrap, RxJS, D3JS, GreenSock, etc…
Responsibilities of Backend Developers
Backend Developers are responsible for doing the heavy lifting jobs at the server side and send the result to the Frontend. These include designing database schema that can hold different types of data, designing API so that Frontend can use it as an interface to get desired data, and sometimes handling the OS level tasks such as preparing the operating system of the server and log files.
Apart from the application related tasks mentioned above, there are many more tasks such as designing the server infrastructure, setting up CICD tools, building infrastructure on cloud services, and code deployment. While these tasks can all fall into the Backend Developer category, big companies have specific job titles for each type of task. We will discuss them in another article.
Skill sets of Backend Developers
Backend Developers need to design database schema and relationships between tables that fits business needs, so that data can be stored and easily retrieved when in need. Some popular relational databases include MySQL, PostgreSQL, and Oracle. Non-relational database or NoSQL database includes: MongoDB, Cassandra, and DynamoDB.
Database: MySQL, PostgreSQL, Oracle, MongoDB, Cassandra, DynamoDB, etc…
When it comes to programming languages for Backend Developers, there are too many of them and some will even have their own framework to use together with, so we will only list some popular ones here: PHP, NodeJS, Python, Ruby, Java, ASP.NET, etc…
Backend Languages: PHP, NodeJS, Python, Ruby, Java, ASP.NET, etc…
Depending on the language, Backend Developers will need to learn the corresponding framework and master the Model-View-Controller design pattern.
Backend Frameworks: Laravel, Symfony, Ruby on Rails, Spring, Spark, etc…
Since Backend Developers often need to interact with the operating system, it is also important for them to learn Linux commands and some scripting languages like Shell script or Perl.As well as how to handle their log files for issue tracing.
Linux Skills: Linux command, Shell script, Perl, Log files handling
Responsibilities of Fullstack Developers
Now you understand the differences between Frontend Developers and Backend Developers let’s discuss what Fullstack Developers are about. In simple terms, Fullstack Developers are developers who can do both Frontend and Backend.
You may wonder why do we need Fullstack Developers if their jobs can already be covered by Frontend Developers and Backend Developers? The reason behind is that since Frontend and Backend are so different, sometimes it can be hard for Frontend Developers and Backend Developers to come to an agreement during discussions. Time like this is when Fullstack Developers shine. Fullstack Developers understand how both sides function, so they can make precise decisions and reduce communication cost. They can also participate in the project planning phase or join either team to develop programs depending on the needs. This however does not mean Fullstack Developers will master both Frontend and Backend. Most Fullstack Developers will lean toward Frontend or Backend, but are still capable of other parts’ jobs.
They are also great candidates to communicate with the clients. Knowing the entire life cycle of web development can help them quickly design solutions that fit clients’ requirements and can help them assess project cost precisely.
Conclusion
We have covered the responsibilities and skill sets of Frontend, Backend, and Fullstack Developers. However, there are still many key roles involved in a web development process that we haven´t covered. We will gradually cover them in upcoming articles. In the end we will explain the complete lifecycle of web development and how each role takes parts.