Front-End vs Back-End for Non-Developers
All what you need to know to understand web development if you are not a developer.
Whether you are a Business Owner, a Managing Director, a Startup Founder or a Project Manager, you might come across a situation where you find yourself in need of hiring a developer or managing a development project. If you don’t have the basic understanding of what development is, you might find it difficult to find a starting point. There are thousands of developers with different titles and skills, but who should you hire, and why? Why the developer you hired is not suitable for the project you want to start? At the end of the day you don’t want to hire a Software Engineer that develops an Aviation Systems for an E-Commerce website.
In this article, we will go through the basic understanding of what web development is, what are the skills that you should look for, and how to find them. This article is written for non-technical people who want to have a good understanding about web development.
In the web development world, we can categorize developers into two different environments that you need to look at both: Front-End developers and Back-End developers. But before we talk about the differences between the two, we need to explain the fundamental computing model that the web runs on: The Client-Server Architecture, or the Client-Server model.
Client vs. Server
Client-Server Architecture is a computing model, that divides computing tasks into two main sections: The Client, and the Server. Where the client requests the service, and the server serves them. Exactly like the customer and the waiter in a restaurant. The customer requests food from the waiter, who takes orders from multiple customers and serves them each of what they have requested.
Let’s take this example and apply it in the web world. The Client (A browser like Chrome or Firefox) requests a service (Website content) from the Server which delivers to the Client to present or process. This can go for all processes of the website, for example, the client sends login information to the server, the server authenticates and sends the confirmation of the validity to the client to process next step.
Keeping this in mind, you might now be thinking of the differences in nature between the tasks on the server and the tasks on the client side. The client-side tasks are more related to the presentation of the information and processing it for the user to interact with, while the tasks on the server-side are more related to authentication, availability, processing, security, storing and retrieving data… etc.
Web Development
Web development is a very broad and popular field in Software Engineering and it is concerned with developing websites on the network (internet or internal networks). Websites can be different in the way the work depending on their contents. They can be static and informative only with little or no programming at all. These types of websites are usually company profiles and personal portfolios where there is no much of interactivity involved. On the other hand, interactive websites have a lot of programming in them both on the client and on the server side. Imagine the things you can do on a website like Facebook, YouTube, or Amazon. You can login, comment, request friendships, watch videos, add items to cart, track shipment and much more. Interactive websites are usually called Web Applications or simply Web Apps.
Now, as we mentioned before, there are two sides of any website or web app. The Client side, and the Server side, and they are referred to as Front-End and Back-End.
Front-End
Everything you see on the web as a user is considered Front-End (hence, the name). This section is responsible for interaction and presentation of the content. All the front-end technologies are categorized into 3 main languages: HTML, CSS and JavaScript. Each of these languages have different responsibilities as we explain in the following.
HTML
HTML stands for HyperText Markup Language, and it is responsible for structuring the presentation of the data. This includes showing them in tables, lists, paragraphs, next to each other, or below each other, in addition to hyperlinks that take you somewhere else once you click on them.
CSS
CSS stands for Cascading Style Sheet, and it is responsible for the beautification of the content like colors, content alignment, fonts, presenting information according to screen size …etc. (Maybe you have noticed that a website looks different on a mobile screen vs a desktop screen). CSS can be written as they are (sometimes called pure CSS) or use frameworks to generate CSS like Bootstrap and W3CSS.
JavaScript
In interactive websites you will find that the web app does more than the presentation of the content, like showing popups, pausing a video, adding a comment, send partial information to the server, add items to cart etc… This is done through programming. Therefore, a programming language is needed to perform all these tasks on the client side. All modern browsers come with a JavaScript engine that is responsible for running the JavaScript codes that come with the website content. In fact, it is the only language that modern browsers understand. We can write JavaScript as they are (Sometimes called Vanilla JavaScript) or use frameworks and libraries that write JavaScript for us using different syntax like React.JS, Angular, jQuery and other libraries and frameworks. All of these libraries and frameworks generate Pure JavaScript codes eventually, so JavaScript is the sole language used in the Front-End.
Job Titles for Front-End Developers
Job titles can differ for Front-End developers depending on the frameworks and technologies one uses. Here we will show few common job titles in the Front-End world.
Web Designer: a web designer is someone who is expert in HTML, CSS, and CSS frameworks. A web designer works with a variety of designing tools such Adobe Photoshop, Adobe Illustrator and other tools that work with images and CSS. Web designers also work with multimedia files such as images, videos, audios and editing tools.
Web Developer: a web developer is someone who is expert in web programming using JavaScript languages and frameworks. Web developers are not necessarily expert in the designing aspect of Front-End development, but have a good understanding of CSS and HTML. Usually, web developers specialize in one or two frameworks and libraries such as React.JS and Angular and sometimes called React Developer and Angular Developer. Web developers could also include back-end development of the web as we will discuss later.
Front-End Developer: Front-End developers usually work with both design and programming of web, and have the necessary skills in both areas. Unlike Web developers, the fact that the developer is titled front-end developer denotes that the developer only works on the front-end and not in the back-end.
There are various job titles in Front-End development. It is not the job title of the developer that determines their technical skills, but the skills set that is needed for the project.
Back-End
As was mentioned before, Front-End is everything you see in the web. Back-End is exactly the opposite of that. Its all the things that is happening in the server side of a web-app that the end-user and the browser cannot see. Usually, the server side programming is more complex than the things happening in the Front-End, thats why there are more patterns and layers in the bank-end to categorize and divide development tasks.
The simplest way to categorize the web development is to divide them into three layers: Presentation, Application, and Data layers. We call this model the 3-Tier Architecture model. These layers are detailed below:
Presentation Layer: Everything related to the presentation of the software, and in this case, it is the Front-End as a whole.
Application Layer: The first part of the back-end is the application layer. This is the logic or the brain of the software. All the codes, frameworks, middleware and software in the back-end are within this layer and its the largest and most complex of the three. The application layer can by itself divided into multiple layers, but in the 3-Tier architecture model, they all lay within the Application Layer.
Data Layer: Basically, all the databases and storages of the back-end where data, documents and files are stored.
When talking about a web app, we are usually talking about these three layers. In this model, the client processes and requests information from the server (Presentation Layer). The server processes these request (Application Layer) and accesses the data when needed(Data Layer) to serve the client.
All the codes and development in the back-end happen in the Application Layer. There are different tasks in this layer such as processing login, save and retrieve data, security, authentication, performance, processing payments etc… And because these things happen in the back-end we don’t see them. In this model, all three layers should be completely separate. So the choice of technology and language in each layer should not affect other layers at all.
Back-End Development
When talking about Front-End web development, we are only talking about JavaScript language as it is the sole language that works on the browser. However, this is not the case of the back-end as there are many languages and frameworks that we can work with. As we mentioned before, the Application Layer is completely separate from the Presentation and Data layer, so the choice of technology in each should not affect the technologies in other layers.
Back-End Languages
Each back-end programming language has its own advantages and disadvantages, so the choice of language is usually determined by the use-case requirements and the available technical knowledge of the developers. In the next section we will talk about some of the mosts popular languages in the back-end world.
JavaScript using Node.JS
JavaScript has cut its way in to the Back-End world recently and is now one of the most popular Back-End language thanks to Node.JS. As mentioned earlier, In the Front-End, JavaScript runs on the browser as each browser is shipped with an engine to do that. However, since the back-end does not run on a browser, it needs another engine. Node.JS is an application server runs on the back-end and it is shipped with an engine to run JavaScript. Node is a very popular server and mostly popular among developers who want to work both on the client and the server as they use the same language.
Python
Python is another popular language for back-end web development. It is famous for its easy and simple syntax which makes it a preferred choice for beginners. Lately, Python became very popular in the AI field. The most popular Python frameworks are Django and Flask.
Java
One of the most important and popular languages in the programming world. Java is famous for its stability and maturity as it was around on a heavy scale for long time. It is also one of the two languages used in Android development. Java is popular in the enterprise level and its most popular frameworks are Spring, Jakarta EE, and Struts.
C#
C# is another mature language developed by Microsoft. It is mostly popular among companies that rely on Microsoft products. In the past, it was not possible to run in any environment but Microsoft Windows. However, this has changed now as it can run in any environment just like Java. Its most popular framework is ASP.NET Core.
PHP
One of the popular languages in the Back-End. PHP is popular among beginners as it can be written without learning a lot of programming patterns and structures. WordPress is a very popular web tool that uses this language. Its most popular frameworks are Laravel, Symfony, and Zend.
Databases
Storage is a fundamental feature of any web app. Without storage, your web app will remain static all the time in terms of data. When we talk about storage, we could be talking about storing data, files or documents. However, the most important one is obviously Data. Data is stored in a special software called database. There are different databases that differ in purpose, functionality or performance. There are two main categories we can divide databases into: Relational and Non-Relational databases.
Relational Databases
Relational databases store data in tables, where rows represent records or entries, and columns represent attributes. For example, for a user table, attributes could be first name, last name and email, and entries can be John, Smith, johnsmith@gmail.com. Relational databases are manipulated via a language called SQL. That’s why relational databases are sometimes called SQL databases. SQL is used to create tables, insert, update, delete or retrieve records. Each database software has its own variation of SQL with small or big additions, and they are often called SQL dialects. In the following we will go through some of the most popular databases exist nowadays.
Oracle
Arguably one of the best relational databases in the industry is Oracle. Oracle is most popular with large enterprises. Its main feature is high performance and is not suitable for small businesses due to its high licensing cost.
Microsoft SQL Server
One of Oracle main competitors is SQL Server and just like oracle, it is famous for its high performance, and not suitable for small businesses due to its high cost. It is popular within companies that use Microsoft products intensively.
MySQL
Perhaps, one of the most popular free databases around the world. It is popular among small businesses and startups as it has a community version that is free to use. MySQL was developed in Sweden and later acquired by Oracle in 2010.
PostgreSQL
PostgreSQL Or simply Postgres is an open source database developed by volunteers from around the world. And because its free, it is very popular among small and medium companies.
Non-Relational Databases
Non-relational databases or as they are called (NoSQL) store data in different ways other than tables and use other ways to retrieve data. One of the most popular ways of storing data is key-value pairs. NoSQL is used in companies that have a big amount of data (Big Data).
MongoDB
MongoDB is the most popular and most used NoSQL database exist as of 2020. It is free and easy to use, and very popular among new developers as there are a lot of tools that manage the database without directly interacting with it. One of these tools are Parse server.
Importance of Back-End Development
Without back-end, a web app lacks a large set of features such as storing, authentication, controlling and retrieving data. Therefore, its crucial for any web app to have a strong back-end and this requires a great knowledge of the tools, technologies, languages, containers, operating systems …etc.
Job Titles for Back-End Developers
Job titles for back-end developers vary depending on the nature of technologies used. The most popular job titles are:
Software Engineer Is a person that can build any software using different design patterns and engineering concepts based on the. requirements of the software. Software Engineers can design, develop or manage software at the back-end using a variety of technologies, languages and tools.
Back-End Developer is a person who is specialized in the back-end development using one or more languages and frameworks. Usually the term Back-End developer denotes that the person only works in the back-end and not in the front-end
Full-Stack Developer is a person who is comfortable both in Front-End and Back-End development. They often familiar with JavaScript frameworks and other languages in the back-end. This can be also true for job titles such as Web Developer.
Python Web Developer/ Python Engineer:
Is a developer that uses python for web development (or any other language eg. Java Engineer, PHP Developer …etc)
Conclusion
As we mentioned before, job titles are not enough for determining what you should work with or what you should hire. It is the tech stack that matters. This article was written for non-technical people who want to hire a developer for their project, or to have a basic understanding of the tech project.