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 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.
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.
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 problems. One 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.
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).
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.
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.
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.
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.
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.
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.
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.
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.