WEB FRAMEWORKS

Web Frameworks, What are They?

BCiriak • December 11, 2019

What is (web) framework?

Web framework or just a framework as a whole, is kind of a structure that can be used to build something. In case of web frameworks, these help us build the web. When you decide to use some web framework for your next project, you get a set of tools that help you with common tasks.

Most of the web frameworks have a standard ways of how to go about solving problems that are typical for web applications. Some frameworks force these conventions on developer more than others and in many case that is a good thing. Oftentimes, these conventions are created by skilled teams of developers. For example, Angular is a framework created by Google, and this fact ensures that the code and conventions of Angular are of highest quality.

Imagine solving some kind of routing without a framework. Well, it is certainly possible, but the amount of development effort would be just unreasonably high. In my opinion, it is much better to choose some framework and stick with the solutions for routing it offers. Much better option.

Why we need web frameworks?

As just stated in previous paragraph, standards and conventions for certain problems are one of the main reasons for why to use web frameworks. This goes hand in hand with the development speed. Some frameworks will setup CRUD application literally in minutes.

There are many languages that were designed to build the web. Let’s take an example with PHP. One has all the tools within the language to build web application, but doing common tasks like connecting to database, without framework like Laravel is much harder and much more time consuming. That’s why we use frameworks to simplify these necessary tasks, so we can concentrate on main application functionality.

Express.js is one of many JavaScript frameworks that let’s us easily build application APIs, handle resources and more.

Web app stack - client, application and database

Main reason for writing this article was to differentiate between frameworks. Lot of times I read, which framework is better, Angular or Express.js? Node.js or Angular, etc.? The point is, these tools are very different from each other. Yes, you certainly can call them frameworks, in a way, these all are frameworks, but they really are different species of frameworks.

To see the difference between them, we need firm understanding of web application stack. I am gonna use very simple terms here and divide the stack into three basic tiers. Database, application and client. This organisation of tiers helps us see how data actually flows within our application. From database to application and then to the client, which can be browser, mobile application, desktop software etc.

And since 99% of the code is written on the application (server) and client level, web frameworks for these two tiers were developed throughout the years. Now, the general division is server-side and client-side frameworks.

List of different kinds of web frameworks

Server-side vs. Client-side

Server-side or backend is where the actual web frameworks started. Languages like C#, Java, Python or PHP were used for building web applications. Need for some “standardised” way for developing web apps brought frameworks like .NET, Django, CakePHP and these are what we call backend frameworks. With these frameworks, we handle requests, data validation, work with filesystem and serve html webpages. Node.js enabled JavaScript on the backend and this brought JavaScript frameworks like Express.js, Koa.js and others. On the other hand we have client-side frameworks.

Client-side frameworks, or front-end frameworks started popping up when Node.js and NPM started gaining traction. Front-end frameworks are almost exclusively JavaScript frameworks like Angular, VueJS, React and more. These frameworks are different from backend technologies because they work within the browser. We ask for data through our application web API and once we have the data we need, we can do all sorts of magic. Routing, manipulating the data, UI rendering. These kind of apps are also called Single Page Applications.

Single Page Applications - SPAs

Main reason for creating Single Page Applications is user experience. SPA asks the server for some data and necessary assets, and once it receives the data, the page is loaded single time. Frontend framework takes over the page and does all the page interactions. This enables very seamless, desktop-like user experience. No page reloads, no waiting for responses etc. There is much more to SPAs and I will probably get into detail in separate article on Single Page Applications. That’s it for now.

Cow says bye!

Read More

Single page application example

Web Frameworks

Single Page Application Example

What are Single Page Applications? In this article we will have look at Single Page Application example, understand how they work and what makes them SPAs.

How to include JavaScript files

JavaScript

How to include JavaScript file into another JavaScript file?

Learn different ways how to include JavaScript file into another JavaScript file. Go through the code examples inside the article to grasp this topic.

Hello world example with Node.js and Koa.js background.

Web Frameworks

Node.js and Koa.js - Hello world! Example

Have a first look at Node.js and Koa.js together. Go over simple 'Hello world!' application created with these tools. Jump right in!