Blog

How to Choose the Right Front-end Framework for Your Company
Lyudmyla Kyrylyuk
Lyudmyla Kyrylyuk
Marketing Content Manager
Roman Kryvun
Roman Kryvun
Front-end developer

Lately, we came across the article on Forbes about things that non-technical founders have to know about tech. This piece inspired us to create own guide explaining complex technical stuff in simple terms.

As we mentioned in our previous article, we do believe that the perfect scenario for non-technical founders is to find a tech partner. But still, we find it useful for founders to be familiar with the project technical side. As it gives an understanding of the main processes and logic behind the software.

This time we decided to highlight the topic of choosing the front-end framework for the online project. Our guide won’t tell you which framework you must choose, but it rather aims to show crucial elements to consider before choosing one.

What is the front-end framework for?

Before dive in, let’s figure out what framework should do. The framework is a ready-made canvas for building a software aimed to reduce development time. We can compare the framework to a set of tools used by a plumber, which he will use depending on his experience and the nature of the breakdown etc.

Front-end framework is a base for writing website’s part that user will see and use. It’s responsible for pre-built website components like side panels, buttons, and navigation.

front-end framework

The size of the project and its business goals

There is no single rule for choosing a front-end framework for the project. Different projects will require different tools. Before starting with the framework, stop and try to analyze the idea and understand what is important and what is not. The choice always has to be based on real needs and goals.

There are some tips that can help to spot a suitable alternative. Business goal of every project determine the criteria of future development. Firstly, we have to rely on that goals to find a suitable pair for the project. Let’s consider three types of goals for the project. We can sell, test and promote.

Sell

  • Enterprise-grade project:

Enterprise projects usually are complex, processing a large volume of users and funds. Such software requires consistency, clear best practice, and minimal unknowns. Technology should be reliable and reusable. Front-end frameworks like Angular and React can help in this field with more years in the market. 

Angular is a library backed by Google, which provides a rigid code structure and ready-made solutions for common problemsOne of the coolest things about Angular is the popularization of TypeScript, which ensures a rich toolkit for enterprise development and relevant documentation updates. Angular has a strong community and it’s easy to find “Best practices” for the framework in general and for every framework element separately.

React is a flexible tool backed by Facebook that gives developer freedom for experiments. Thanks to flexibility, there are many ways how to organize the application, that sometimes can be overwhelming. When you have too many choices, it is harder and longer to make a decision. Also, the flexibility of Angular is considered to be a downfall. Since it provides a developer with more routine work, where it is easier to make but harder to detect mistakes. React is not a framework, but a library. Thereby, it results in some inconveniences. For example, to get an application running developer has to integrate 3rd party solutions, which can slow down the application.

  • E-commerce: Marketplace, online shop 

Under the e-commerce, we mean marketplaces, online shops, and platforms. In terms of structure e-commerce projects are easier than software projects, but still, there are some nuances which should not be missed. Concerning tools for building e-commerce product, we recommend using ready build solutions – Content Management Systems (CMS). This is a system that allows building and modifying the platform, according to your requirements. It can be services like WooCommerce, WordPress, Magento etc.

Also, there is always an alternative to go with custom development, but it will be more expensive and time-consuming. Mid-sized e-commerce website may cost up to $80.000. This includes design, development, hosting and SEO optimization. Development by means of CMS will cost you much cheaper.

front-end framework

Custom development can be a good idea for building marketplaces or bigger online platforms. JQuery or Vue js are the frameworks suitable for such projects. But be aware that using frameworks may hurt site web optimization (we will talk about this in more details later on).

JQuery is a popular JavaScript library that ensures high performance and simplicity of coding. The framework is cross-browser, meaning it supports all modern browsers, including old, but widely used browsers like Internet Explorer 7. Many tasks for jQuery developers can solve by one line, which cuts development time and eliminates mistakes in coding. JQuery fits for the small simple projects that have to be done in a short time. 

VueJS is a JavaScript framework designed to develop a user interface. The framework is still gaining its popularity. This framework came to us from Asia, therefore the majority of materials like “Best Practices” and tutorials are in Chinese. VueJS has adopted the various advantages of Angular and React and built an efficient library. It is a fast and flexible framework that suits small and big projects. 

Test

The testing of a business idea is an effective way to check whether it is viable and worth to be implemented. Here we talk about MVP, the initial version of the project with basic functions. This project is small and has strict timeframes.

  • MVP

In MVP development are two important things to consider before choosing the front-end framework. How much money do you have and what are your timeframes. Of course, you can approach the case seriously and use some high-profile framework like React or Angular. But let’s be honest MVP won’t benefit from that. MVP is all about fast decisions and strict deadlines.

The main purpose of MVP is to test whether your business vision is viable and preferably enter the market before competitors did. For this matter, we consider VueJS as a suitable framework for this work. It will help to design an appealing application with basic functions in short terms, which is a critical element in the startup world.

You can develop MVP even without back-end in order to launch fast. Naturally, after the testing period, when you collect all the feedbacks, you can rewrite an application using another framework. But using VueJS will give you leg up on competitors.

Promote

  • Landing page 

Let’s define what is a landing page and what purposes it serves for business. This will give us an understanding of how it should look from the technical side to meet all the requirements we will put on it. A landing page is a single web page, created to translate leads into clients.

From the point of complexity, landing is the primary application, usually, one page with no fancy structure. This tells us that it can be built using the framework for the simple application. You already know that JQuery and VueJS are suitable for this work. They will ensure good looking smooth little web page. And the primary reason for using them is a time of development. It will be quick and painless.

To fulfil its marketing destiny, the landing page should be easily found online, thus web optimized in the right manner. Creating a landing page using the framework can hurt content indexation if you don’t take care of it beforehand. (Read more on web optimization).

We don’t recommend using frameworks like React or Angular for this work unless you are planning to build a whole platform for creating landing pages. Some kind of contractor for designing custom landings.

Web optimization

Under web optimization, we mean how search engines detect and display your website. Web optimization is something that a lot of founders consider in the last turn when the product is finished and there is not much can be changed. Site web indexation depends on tech stack used for programming. The major challenge with using JavaScript programming is content indexation. Search engines have problems finding sites that display content via JavaScript. Lately, Google improved its ability to find such applications, but other engines still struggle.

We have encountered this problem with our own website. As we wrote the website on JavaScript, we quickly realized that it’s invisible to search engines. So, our developers migrated Sombrainc on other platform and after SEO inspection, the site appeared in the searches.

Developers can optimize sites written in JS, but they have to consider it on the initial stages of development. Good if your team realizes the importance of content indexation. But anyway make sure to set your preferences before development starts.

Let’s see which projects need web optimization and which don’t. Enterprise-grade projects we can divide into open and close. Open are projects available online. Booking is an open project, where every page should be optimized, thus users can find it under specific keywords. Close are projects available only after registration. In this case, it is enough to optimize visible pages and maybe create a landing page to attract users.

E-commerce platforms also need optimization, since it is impossible to gain new customers without an online presence. Like in the case of Booking every page should be optimized and searchable. If you use CMS for website building, you won’t have troubles with optimization. But in the case of JavaScript programming, developers should either break the project into separate parts or use server sites rendering, which will help Crawlers index all the content as any static site.

MVP optimization is up to you. If you already have a sample of testers for the product, don’t bother with optimization. If you want to gain potential testers online, it makes sense, to ensure indexation. Landing page as the marketing tool requires web optimization to attract new customers and drive sales.

Development team

There are two questions to consider. What team do you have? How easy is to find and change developers?

When you already have a development team, choose a framework according to the developers’ background. If your team consists of skilled middle and senior developers, choose frameworks they had commercial experience with. If your team is junior developers with no extensive knowledge, it is important to find someone with greater experience. For example, middle developer, who will lead the team and rely on his/her experience. There is no difference for junior developers what to study, they can adopt, but a good leader with solid knowledge and commercial experience is crucial.

If you don’t have an in-house team and consider going with outsourcing, focus on how easy to find and change developers. For example, if you want your project to be written on Ember, you can have some problems forming a team. Since there is not that much of Ember developers out there.

We investigated using Codementor what frameworks are the most popular among freelance front-end developers. The majority of developers know JQuery and search for a job related to this framework. React and Angular share the second place. VueJS and Ember are the least popular in rating.

This is pretty raw statistics, but the situation on the labour market is quite the same. Developers learn more popular technologies as it simplifies the job search in the future. It’s possible to find specialists that work with rare technologies, but they cost more.

Mobile version

You think about a mobile version of your project or not, it doesn’t matter. Sooner or later you will need a mobile app or at least optimized web app for mobile devices. The world is going mobile, 9 out of 10 of our workers choose mobile devices over the desktop.

Not all frameworks work good with mobile, so we recommend thinking about a mobile version while working on a web application. The mobile app will depend on the tech stack of the web application. The perfect scenario is to reuse code from web app in mobile, this will save time and cut costs. Considering today the possibility of the mobile app is the best you can do for the future of your business. 

Summary

Remember that there is no perfect front-end framework out there. Every framework suits for specific project and choice always has to rely on business goals and objectives. This piece aimed to pay your attention to elements, which determine the framework choice. Remember about web optimization, consider your team background and ideal framework will find you.