Home/Blog/What is a front-end framework?/

Frontend

What is a front-end framework?

Only available in the source language

18 Apr 21

What is a front-end framework?

What is actually a so-called frontend framework? If you deal with the topic of web development, you will most likely come across terms like frontend or framework. However, you may also have received an offer from an agency and now want to understand what exactly is meant. In the following, we will introduce you to some important terms.

If you have any questions about this post or would like to commission custom web development, get in touch! The initial consultation is of course free of charge.

Get in touch

Typically, a web application consists of several parts. There is the application itself, a server on which it is hosted, a database and much more.

First, we need to clearly specify the terminology:

Frontend

The frontend is the part of an application that can be seen and used by a (usually human) user with any role. It contains pages, buttons, forms, controls, etc.

Backend ≠ Backend

When it comes to the backend, things get trickier. Many people often refer to the administration interface of an application as the "backend". However, this is not meant in this context. In programming, the backend is the part of the application that, for example, handles data storage and manipulation, performs internal tasks, communicates with interfaces, and generally represents the interface to the front end.

What is a framework?

There are frontend and backend frameworks. There are data frameworks, test frameworks and quite a few more. As a rule, a framework takes over a number of basic functions that are frequently reused, sets uniform standards and supports the developer in clean and secure development.

What about frontend frameworks?

In the example of frontend frameworks, these can be buttons, forms or layout functions, for example. By adhering to standards and defining variables, applications can be better maintained and developed faster.

In addition, frontend frameworks standardize the display in different browsers in devices.

By the way, there are not only browser frontend frameworks. There are also those that specialize in emails or print layouts.

JavaScript Frameworks (React, VueJS, Angular) vs. CSS Frameworks (Bootstrap, Tailwind)

The above-mentioned terms crop up again and again in modern application development. Basically, a distinction can be made between JavaScript and pure CSS frameworks.

JavaScript Frameworks

- "Reactive", content can change dynamically, e.g. after communication with the server.

- Provides possibilities for data storage, data mutation, data manipulation

- Functions beyond mere styling:

- Building reusable components

CSS Frameworks

- Lean and fast

- Easy to learn and use

- Sufficient for classic multi-page applications (https://medium.com/@NeotericEU/single-page-application-vs-multiple-page-application-2591588efe58)

Advantages and disadvantages

Advantages

- Faster development due to existing elements and components (e.g. buttons, form elements)

- Consistent and secure development throughout the application

- Same appearance in different browsers and devices

- For JS frameworks: Fast and cost-effective development of responsive frontends

- Depending on the framework used: updates, additions and community

Disadvantages

- Depending on the framework used, longer loading time

- Larger application, more files

- Dependence on framework developer

Is a frontend framework a toolbox?

Yes and no! Often components and elements are presented on the web pages of the framework manufacturer in such a way that the impression is created that one only has to "click together" the individual elements and would already be at the goal. Here caution is necessary: A Framework represents only a tool for developers, approximately like a tool suit-case for the craftsman. Although some things are made easier, they can also have harmful consequences if used incorrectly.

What is the alternative?

Even without the use of frameworks, practically one framework is used: That, of the browser. The browser already displays elements on the screen in a special way without additional instructions. E.g. form elements or buttons.

However, the use of a frontend framework is strongly recommended in any case.

Popular frontend frameworks

  • React

  • VueJS

  • Angular

  • Bootstrap

  • Tailwind

  • Foundation

About the author
Author

Christoph Heike

Christoph Heike is the managing director of Webzeile GmbH and has been programming since he was 12 years old. Currently he is interested in technologies like PHP, Symfony, VueJS, React and many more.


Get in touch with us right away.

Get to know us. Arrange a free initial consultation.