Does your web app need a front-end framework?

Let's imagine it's been a while since the successful launch of your product. You've heard something about popular frameworks as Vue, React, and Angular. But you have little understanding of what they can help you with. Probably, you feel that your front end has become bulky and it needs supervision. But you are not sure which framework to choose and what to start from. This article will serve as some help. We have compiled a list of reasons for implementing a framework in your project and mentioned a few handy alternatives.

As your app grows

There are 4 situations developers usually encounter they say:

1. the code doesn't work and you don't know why – the worst-case scenario, yet the most common one
2. the code works and you don't know why – a slightly better situation, as it may turn into the previous one in no time
3. the code doesn't work and you know why – easily fixed situation, but it's better to stay alert
4. the code works and you know why – you are the king of the world

To start an app, you need just HTML, CSS, and JavaScript. Those three will equip your product with a working front end. However, as time passes, the code will gradually turn into absolute spaghetti. And that is the moment a developer starts rambling among the four situations mentioned above.

Any application will need updates and it will scale up. Thus, developers will add several additional lines of code. With time, you may find yourself struggling with one of the following issues:
• The quantity of JavaScript and CSS files expands, and there’s lots of repeated code between them.
• You’re writing functions to update the elements after you have linked them to some events.
• Even a small change in the code may affect the whole application.
• When a new developer is hired to the team to facilitate your workload, you will spend hours explaining how your code works, which does not relieve your stress level.

The benefits and drawbacks of exploiting a framework

There are dozens of frameworks both in the open space and for commercial license. They differ in the price, components on the list, and design. However, the issues they are supposed to cope with are quite similar.
• Your code will become maintainable: easy to read, test, and change for any developer.
• When you decide to make a complex interface, you will not need to create the components from scratch, as the components of any framework are reusable and multifunctional.
• The UI will be user-friendly, which means it is easy to manipulate, it is intuitive and consistent.
• There will be enough ready-to-use templates in case you need to expand functionality.
• You cooperate with other developers and finally understand each other.

On the flip side, using a framework is always a challenge. You can thoroughly pick up a solution, however, you are never 100% sure you made the right decision before you study the framework and use it for quite some time. Besides, there is always a learning curve. Regardless of how big the team is, you still need to allocate some time to look through the documentation, study the snippets, understand how the front end is related to the server-side. Moreover, frameworks usually offer rather limited design options. If the project you are working on requires a unique design and looks of the elements, a framework is not a solution. The last and the most serious argument against implementing a framework is that it may stop being updated by its creators. That is why developers prefer the most popular frameworks that have been on the market for quite some time. And also that is the reason for harsh market entry for the competing frameworks. Developers don't risk implementing them, as they may disappear after a few releases.

You probably know a lot about the existing popular frameworks. If not, you can easily find the information online. We now will focus on the alternatives to frameworks.

Template processors

Those use special software to combine templates with data and to produce result documents. A resulting document may be a document, a web page, a source code. Examples include Handlebars.js, EJS, or mustache.js.

JavaScript UI libraries

Libraries include a set of components or widgets that can be used independently or built into your environment. For instance, Bootstrap, SemanticUI, or DHTMLX might be a good option. Webix UI Library is an interesting product, as it comprises various components, complex widgets, that are complete SPAs by themselves, and a micro framework Webix Jet, that is designed to logically combine all the components to get a working and good-looking user interface.

Full-stack monolith apps

Here we can mention Ruby on Rails, Meteor.js which come with the templating engines to render HTML on the server. This might be a solution if you are choosing a full-stack framework for your entire application and writing the presentation layer and server logic within a single codebase. Most full-stack frameworks do allow you to opt for front-end frameworks of your choice but limit you to the default templating engines.

Conclusion

Frameworks can become both a salvation and a curse for any project. The advantages they enclose do sound tempting. Frameworks save time and resources, maintain the code, and prevent developers from reinventing the wheel. However, you should always think twice and consider the value of the framework for the particular project. Probably, it is too specific, or too small, or you are coping with all the issues successfully by yourself, so there is no need to rush. Before making any decision, think about whether it will really facilitate your working processes.