How to Choose a Technology Stack for Web Application Development

Why do we want to talk about choosing the technology stack? For the clients, the main thing is that the application performs correctly, and the choice of technology is the developers' business. That's true, but the technology directly affects the application performance. The opposite is also true – the type of application influences the technology selection.

This is why we've decided to share our views on choosing the technology stack for web application development and the criteria we use in the process. Another aspect that we would like to point out is the effect of the technology stack on the project cost. Some tools are open-source and free to use, while others are licensed. The cost factor, together with the performance, should be considered when selecting the technology.

Moreover, web app development does not stop with the initial release – any working app requires continuous support and maintenance. Knowing the technology stack used during development will make further updates easier, even if you decide to change the outstaffing development service provider.

What is a technology stack?

The technology stack is a set of tools and frameworks that are used in the development of a software product. In web development, the technology stack consists of a very specific set of components that work together to create a functioning web application.

Let's begin with the two main parts of a technology stack: the front-end and the back-end. They are also called client-side and server-side. Each of the two parts performs specific functions and includes a corresponding set of tools.

Front-end, or client-side

The front-end components enable the user's interaction with the application. In the context of web apps, such interaction occurs in the browser and is possible thanks to the following components:

• HTML (Hypertext Markup Language) defining the structure of the information presented in the browser
• CSS (Cascading Style Sheets) determining the style of the application content (colors, fonts, and layouts)
• JavaScript enabling the interactivity of the web page in which the app is running

The majority of web applications are built with Bootstrap as the framework for HTML and CSS. It is considered the most comprehensive library with a great user base and thousands of stars on GitHub. While Bootstrap is the most popular framework, it is not the only one on the market. As an alternative, you can also consider Foundation, which is the second-most used after Bootstrap and shows good performance.

The sector of JavaScript components is a field of fierce competition of front-end frameworks, the leaders being Angular and React. Both are known for their high performance and flexibility, and both have huge armies of supporters and contributors. Moreover, both of them perform equally well regardless of the tools used on the back-end.

While these two frameworks still dominate the market of front-end development, developers are considering Vue.js as the alternative more and more often. Vue.js earns points for its lightweight structure and versatility.

Back-end, or server-side

The back-end part of the development stack includes more components, and there are many more options to choose from here. Back-end works behind the scenes and is invisible to users, but it forms the engine that drives the application and implements its business logic. All back-end tech stacks include the following main parts:

• Operating system in which the development is done
• Web server processing requests from the browser and returning the corresponding content
• Database storing the app data
• Programming language used to create the app code
• Web development framework for faster and easier development. The web framework directly depends on the choice of the programming language

Here we should note that when choosing the right back-end technology, you do not always need to select each component separately. There are already several back-end stacks where the components have proved to form the most optimal development environment. Let's see the most popular technology stack examples that web developers use:

• LAMP standing for Linux (operating system), Apache (web server), MySQL (database), PHP (programming language). LAMP is considered the most popular back-end stack and is appreciated for its scalability, security and high customization options. While most developers prefer Linux as the operating system, the same stack can be used with Windows or Mac OS without sacrificing the development quality.
• Python-Django based on the Python programming language. It also uses the Apache web server and MySQL database, as well as the Django framework, which is also written in Python. Developers love this stack for the possibility of quick development keeping the high level of quality. Many projects opt for Python-Django when creating their MVPs and other time-critical products.
• MEAN, which is an acronym of MongoDB (database), Express.js (application framework), AngularJS (front-end framework), Node.js (runtime environment). Here the stack structure is different, as it includes both the back-end and front-end development tools, and it is more correct to call it a full stack. MEAN is an implementation of the “JavaScript everywhere” concept using the same programming language both client-side and server-side. The back-end is based on Node.js, the first platform to use JavaScript in the back-end development. The MEAN stack is known for its high performance and flexibility, as well as a smooth learning curve, since it uses the same language across all components.
• MERN includes MongoDB, Express, React/Redux, and Node.js. Considering the popularity of ReactJS in front-end development and NodeJS in back-end development, this combination is reasonably called the most-used JavaScript stack for building high-end single-page applications. Except for the “one programming language across all tiers” benefit, MERN also offers a short learning curve, high productivity and enhanced agility. When comparing MEAN vs MERN, the choice boils down to React or Angular, and here it's important to take into account the project's requirements and goals, as well as the familiarity of JavaScript developer(s) with these front-end technologies.

Here we must also mention serverless computing, or function-as-a-service platform. Though it doesn't include any particular programming language or framework, it takes care of all operational responsibilities such as servers, environment or databases within a project. So, to get a full tech stack, software engineers just need to choose frameworks for front-end and back-end development.

By opting for serverless applications, developers can focus on software solutions, instead of runtime or server management. Thus such an approach ensures better agility, shorter time-to-market, and lower overall cost of ownership.

Let's stop briefly to consider web frameworks forming a standardized platform for app development and making it easier. As we've mentioned, web frameworks are related to the development language. The most popular web frameworks in the developer community are:

How to pick the right web technology stack

With this variety of web development tools, platforms, and stacks, choosing the one that will work best for your project may seem like a difficult task. That's true, choosing a technology is a “project within a project” and requires certain effort, but this choice determines how your application is going to be created, run and maintained.

When choosing a technology stack, you may filter your options by analyzing your project requirements and specifics.

Project type and size

The size and complexity of your project may be a factor determining the stack that you choose to develop it.

• Small projects, such as MVPs, can be created using a Python-Django or Node.js-React stack. Moreover, if your MVP format is a landing page, you can go with an even simpler ready-made solution, such as WordPress.
• Mid-size projects, such as online stores or enterprise applications, require a more complex stack with several layers and different languages. Such an app can be delivered with a MEAN, MERN or LAMP stack and be expected to perform well.
• Large projects, such as social networks and global marketplaces, have much higher requirements as to the scalability, speed and maintainability. Their development is usually a complex combination of tools, languages, and technologies ensuring effective performance and customer satisfaction. Many large projects prefer Angular-Node.js, Python-Django or Ruby on Rails as their core technologies.

Time to market

The technology stack may influence your time to market in the way it supports reusable components and third-party integrations. If tools and frameworks allow easy integration, this is going to speed up the development process and, therefore, reduce the time to market. In this respect, the MEAN stack offers quite impressive opportunities for its flexible approach to third-party code.

Another factor that can influence the time to market is your developers' expertise. If the team is familiar with the tools that form the stack, they will get started more easily and spend less time on the project. Here you can also consider the quality of documentation as it may play its part in the selection of tools. For example, PHP is known for its excellent documentation, which could win points for it.

Scalability

If you want your app to grow with your business, start providing for its scalability during the development. Your app can scale in two directions:

• Scale up, or vertically – allowing you to add other software for new tasks
• Scale out, or horizontally – allowing it to handle increased volumes of requests

The tools you choose for your technology stack may have different scalability potentials, and that should be factored in when making the decision. For example, the components of the MEAN stack – namely, Angular and Node.js – have proved to have superb scalability possibilities. Thus, MEAN can be your stack of choice if scalability is critical for your web app.

Cost of development

Most of the web development tools and frameworks are open-source and can be used for free. Their licenses allow free and unrestricted use and modification, which creates great possibilities for their development and maintenance.

At the same time, there is another factor that can affect the cost of development depending on the selected stack – the availability of developers and their salaries. It is no secret that the developer's salary is directly related to the technology they work with and the total number of professionals in the same field.

According to the Stackoverflow Developer Survey 2018, among the languages that are the most frequently used in web development, Ruby developers have the highest salaries, with PHP far below. The same analysis, however, shows that the relative number of Ruby developers is much lower than the number of those working with JavaScript or Python.

These statistics show that opting for Ruby may, on the one hand, result in higher development costs, and, on the other hand, cause difficulties in finding skilled developers. JavaScript developers, in turn, will be easier to hire and, generally, agree to lower rates.

Image credit: Stackoverflow

Successful technology stacks

While each project is unique and has different requirements, analyzing the technologies used in the creation of successful projects may help to better understand the advantages of each tool that was chosen. Let's look at the stacks that are at the core of some popular web applications that have proved their performance.

Facebook – a social network

Image creadit: StackShare

eBay – a global marketplace

Image creadit: StackShare

Slack – a collaboration tool

Image creadit: StackShare

Coursera – an online learning platform

Image creadit: StackShare

As you can see, different web applications use different approaches for choosing the development tools, and this is the greatest proof that there is no technology stack that can be definitely called “the best”. Facebook feels just fine with PHP, while Coursera opted for JavaScript and is running quite effectively.

The technology stack for your project should derive from the specifics of your project. We can help you with that if you share with us your web app idea and your expectations from it. Tell us what you want to achieve, and our tech experts will gladly suggest the best tools to make it real.