Choosing a Tech Stack for Full-Cycle Web Application Development

LANARS — Painless Innovations Provider
Frontend Weekly
Published in
13 min readFeb 19, 2020

Web apps are still the dominant form of digital products globally. It’s no wonder that technology stack remains a critical question to consider when calculating the software development budget costs, choosing a development vendor, or planning a marketing strategy.

A good tech stack allows you to save time and money, avoid serious programming mistakes, scale up your project when required, and keep corporate and user data secure.

Which software stack is the best one — LAMP or MEAN, MERN or Python-Django? Use our article to find out about the latest tech updates, factors that may influence your stack decision, and common mistakes you should be aware of when following the most popular approaches. You will also find information about LANARS’ own tech stack.

Web Development Technology Stack

A web stack is a set of digital tools and programming languages that a software engineer uses to create a product according to your tech requirements and ideas.

The tech stack as a term, is used both for web and mobile-oriented products and means a combination of development instruments, frameworks, programming languages (as well as dialects), and other components that may differ regarding the type of web application.

A tech stack includes front-end (client’s side of the app) and back-end (the server and web technology behind the product) components. The main reason to use a proven tech stack is to speed up the development process and optimize team resources. To demonstrate, let’s analyze the stack behind almost any web app:

  • Front-end

The front-end is about what clients see while interacting with your product. The web app is run in browsers and needs HTML, JavaScript and CSS to be displayed properly.

HTML (Hypertext Markup Language) with HTML5 as the latest version, is a programming language for structuring web page information. CSS (Cascading Style Sheets, with CSS3 as the most popular version), is used to describe what the HTML pages should look like on the screen. JavaScript is used to design dynamic content and interactive elements. There are also various frameworks that are used to enlarge the possibilities of the three basic front-end components.

  • Back-end — HTTP server and app servers

The back-end is about everything else that is running in the background that users don’t see. The back-end side can be split into a server, app server, and database parts.

How does it work? Once the user has provided a web app with data (for example, pressing the button), the request is sent to the browser. Then, an app server processes the request, interprets it, searches the database, and comes up with the response that should be shown on the users screen. The algorithm can be built in different programming languages including Ruby, PHP, Java, .Net, or Python.

  • Databases

A database is organized data storage for various files your web app may need. Some databases are more suitable for commercial information, while others are better for media file management, healthcare files, IoT data, or geo-location. Oracle is a unit-based database, PostgreSQL is an object-relational one, and MongoDB remains the most common non-relational instrument to work with web app data.

  • APIs

API (application programming interfaces) is a technology that makes it possible for front-end and back-end web app sides to stay connected. Your web app can interact with several APIs at the same time.

  • Server architecture

Developers may choose server architecture taking into account its scalability, performance, reliability, maintenance features, and costs. A server is a place where the programming code is securely kept. It includes hardware and software sides. In most cases, companies decide to use cloud servers to host their web apps (AWS, Google Cloud Platform Services, Microsoft Azure, and others).

Server architecture, in its turn, is a software environment, where integration and continuous deployment are going on, and reverse proxies appear. Nginx, Apache, and IBM WebSphere Application Servers are some of the most popular servers.

Choosing a Web Application Stack

The type of Web application tech stack solution will result in increasing or decreasing development and marketing costs. Structured frameworks are more convenient to work with, while those that need to be improved and adapted to your particular project are likely to limit your business growth.

The Languages used for web development are just one aspect of a tech stack. Databases, server apps, and working algorithms also need to be chosen carefully.

Some app types require extra security levels, while others can easily cope with media data. There are some factors we advise you to consider when choosing a tech stack:

  • Project size

Projects can be classified by size and complexity. Both factors may affect the tech stack solution. Small projects such as online magazines and blogs, one-page sites, simple presentations, and most of the landing pages could be put together with the help of site builders or a single programming framework.

Mid-sized products include interactive platforms, like online shops and web apps, as well as online banking and eHealth tools. They are multilayered and require several development frameworks and libraries to be built. At the same time, mid-sized projects are usually required to be cross-platform and interact with a number of APIs.

Large projects, like international marketplaces or social networks, are incredibly complicated and interactive. Moreover, there are extra requirements in terms of security. To develop a product of this kind, you need a variety of frameworks, programming languages, and development tools. The front-end and back-end are usually built separately. In the case of such a product development, start with a list of MVP features first and present them to your vendor, to make sure your partner’s technologies can support the MVP. For more on MVP read here — How to Build an MVP.

  • Time to market

The general rule is — if you need to see a result quickly, be ready to spend extra money on it. However, the right tech stack might help you to minimize costs, due to ready-made components and convenient access to various in-built development tools.

Third-party integrations, standard tasks such as database development and set up and building default app features could be implemented without writing programming code from scratch. What you really need to do to save time and budget costs is to get to know the MVP features and try to find a product that is close to yours, in terms of web app algorithms, features, and database architecture. Use the same tech stack without reinventing the wheel!

More information — blog article How to Start a Startup.

  • Scalability

If you can’t scale up your product, you can’t grow your business. Regardless of the growth speed you expect from your project idea, choose a tech stack that allows you to add units, integrate third-party APIs, and execute tasks of various kinds.

Keep in mind that there are two dimensions to your product’s growth — vertical (from less to more complicated structure) and horizontal (requires processing growth potential). AWS and React remain a good choice in this case.

  • Security

Financial, eHealth, eCommerce, and some other types of web apps, must have certain data processing security levels, to become trustworthy in the eyes of customers as well as operate legally.

There are some common approaches to cybersecurity — authorization algorithms, using a proven API when processing interactions with customers, limited periods of APS access, instant data backups, and a web app infrastructure is held on a secure server. Choose a tech stack that supports these options.

  • Maintainability

What is the best language for web development? The language decision affects codebase and software architecture, and both of them influence web app maintenance costs.

Open-source technologies are the simplest way to avoid costly codebase development and app maintenance, while working to consistency and reusability principles are two others. As well as all this, to be easily maintainable, the software architecture needs to be scalable, portable, and dynamic.

Do Not Choose a Software Stack Based on…

If you are about to start building your first web app products, you might have already chosen the application stack. Don’t be too hasty! There are a number of pitfalls that can expose your project to commercial risks. We advise you not to rely on the following things when deciding on a tech stack:

  • Competitors’ experiences

The worst thing about choosing the wrong tech stack is you then need to transform it into something else. This process needs money and time.

A Competitors’ experience in the field of marketing, inner processes management, product modernization, and monetization could be useful for you, however, each competitor’s tech stack might have been chosen considering issues that are not applicable in your case (for example, the database security approach or the digital engineers’ experience).

  • Online research

A development stack can take different forms. But since there are relatively few of them, you may find hundreds of reviews on each of them.

What you need to understand is that all exciting tech approaches were developed for a purpose and there is always a way to benefit from them.

Naturally, you can always find pros and cons regarding any tech stack.

The question is whether or not a particular approach suits your tech requirements. When choosing an option, opt for one your developers have practical knowledge of. Or, if you don’t have a team yet, ask candidates about their skills and get to know their experience of similar feature implementation.

  • Previous projects

The modern version of the tech stack components you used in your previous project may have changed a lot since then. Use the same approach only if you are totally sure of its potential and have specialists who can keep an eye on component updates and know how to handle them.

Another major issue is about your project requirements. Just like with tech stack components, your project requirements may become more complicated over the years.

To beat competitors, you need to work on neoteric solutions. For that, you need new technologies. Invest time in studying what’s going on in the digital world and speak with practical specialists.

  • Personal preferences

Choose components for your tech stack if you are a CTO or have a similar background. If not, it’s better to rely on the opinions of your developers. Factors that usually help digital engineers to choose the right tech stack are its flexibility, scalability, security, and complexity.

You will be unable to expertly evaluate a tech stack based on these factors without an in-depth knowledge of the digital field.

The Most Popular Technology Stack Models

So as not to reinvent the wheel, it is always a good idea to use good old web development stack models developed years and years ago. Their components are being updated constantly, however, the general principles remain the same.

One more advantage of working with well-known web development stacks is the knowledge base that has been gathered by its adopters over the years. You can easily find ideas on how to solve problematic issues on the Internet.

LAMP
components — the Linux operating system, the Apache HTTP server, the MySQL relational database management system, the PHP programming language (Perl or Python are also possible)

LAMP is an acronym that stands for the names of its 4 original components. It is a basic web app technology model that is widely used by developers globally. The LAMP approach works well for dynamic web sites and web apps. The tech stack model is based on free open-source software, which makes it so popular.

At the same time, LAMP’s components are interchangeable and you can integrate other components into the system. WAMP for Microsoft Windows and MAMP for macOS are the most common examples of LAMP adoption potential.

Python-Django
components — the Python programming language as a base, the Apache web server, the MySQL database management system

The Django framework was designed for those who prefer a robust and readable Python as the main programming language of their product. Its key advantage is that you can significantly speed up the development process by using a framework which already includes the ORM layer and admin panel for module management. Django also has inbuilt CSRF and SQL injection protection.

At the same time, without proper server architecture optimization, sites and web apps written within Django could perform slowly. That’s why it’s a great idea to work with Python framework if you’ve got a Python developer in your team. It’s good for web apps, but too complicated for sites.

MEAN
components — the MongoDB NoSQL database, the Express.js web app framework, the Angular JS (or Angular) Javascript MVC framework, the Node.js execution domain

The MEAN website development technology is a native environment of JavaScript where both the front-end and the back-end are built using the same programming language. That makes it easy for developers to code and interact with each other. That’s why MEAN is considered to be a cost-effective approach.

MEAN is open-sourced, structured, and flexible. Due to JSON used for data transfer and free module library access, the tech stack helps to create agile and highly-scalable products. It is applicable to dynamic web apps and sites of any kind.

MERN
components — the MongoDB NoSQL database, the Express.js web app framework, the React/Redux library, the Node.js runtime environment

The MERN tech stack is similar to MEAN. The difference is React.js, which replaces MEAN’s Angular.js executing environment. React is believed to be more flexible and convenient than Angular and that’s the reason why it’s also more popular.

The key advantages of MERN, which is open-source and free, include: React building block integration, an opportunity to use code on servers and browsers at the same time, full-cycle development options (front and back-end), MVC architecture support, testing tool integration, and a rich library. MERN is extremely flexible and can be used for building complicated web apps.

.NET
idea — a software framework, which was designed and developed by Microsoft

Today, .NET is one of the best tools to build dynamic web apps based on C# language and attached to Microsoft’s technology stack. It can be used with other open-source technologies and is highly integrative concerning various libraries, languages platforms, SDKs, IDEs, and SOA.

The .NET tech stack is about portability and interoperability across different platforms and languages. This allows developers to apply the approaches that are used to. The stack also has hacker protection and shows great performance speed.

Ruby on Rails
idea — model–view–controller server-side web application framework in Ruby

Ruby on Rails is one more programming environment designed to simplify the development process. A server-side web app development framework written in Ruby programming language requires less knowledge to work with, as it allows using application default structures for web pages and database arrangement.

Ruby on Rails can be matched with JSON or XML standards for data transfer, as well as HTML, JavaScript, and CSS for developing an interface. Librarie integration, framework scalability, integrated Ruby databases, and ActiveRecord pattern for database management are the most significant advantages of the framework.

The development Stack of Famous Projects

A tech stack description might be useful for you in terms of gaining theoretical experience or collecting fresh ideas of how a particular web development task could be successfully solved. Although we do not recommend that you copy a market leaders’ tech stack completely, we suggest that you use the information to help define some general approaches to your web app development.

Bear in mind also that products like Facebook or Amazon are extremely complicated, so the list of tech stack components may not be complete.

Focus on startups with a limited but clear functionality, as it will help you to understand component interaction better.

The Facebook social network doesn’t exploit one major development stack. The core technologies behind its functionality include JavaScript, React.js, Apache, PHP, MySQL, and Memcashed.

The Twitter social network was basically created with Ruby on Rails. Components: Node.js, React, MySQL, Redis, JavaScript, GraphQL, Memcached, Apache Storm, Heron, Pelikan Cache, and others.

The Amazon platform was built using several programming languages and within various frameworks, including C++, Java, Python, Perl, and Ruby. Components: Java, MySQL, AngularJS, native Amazon components (EC2, S3, RDS, EC2 Container Service, DynamoDB, SQS, VPC, ElastiCache, Redshift, EBS, RDS for PostgreSQL, RDS for PostgreSQL), and Perl.

The Github software development platform is Ruby on Rails-based. Its components include MySQL, Ruby, Rails, Markdown, C, Unicorn, and Sinatra.

The PayPal money transfer system is a built-in Python programming language. Basic components: Amazon CloudFront, Amazon EC2, Amazon Route 53, Akamai Intelligent Platform, Apache Web Server, Atlassian Bitbucket, Atlassian JIRA, Bluehost, Comodo SSL, DigiCert, Dyn CNS, Elastic Kibana, Elasticsearch, GitHub, Grafana, Jenkins, Kubernetes, MongoDB, PostgreSQL, Vagrant, Nagios, Okta, Packer, Splunk, Terraform, Zoneedit, and Nginx.

The Instagram visual content-based social platform was created with Python. Components: JavaScript, React.js, Nginx, the Python-Django framework, PostgreSQL, and Redis.

The Shopify eCommerce platform uses Ruby on Rails as the major technology. Tech stack components: JavaScript, React.js, Nginx, Java, MySQL, the Ruby on Rails framework, Redis, and Memcashed.

The Airbnb apartment rental service is built on Ruby on Rails. Components: JavaScript, Java, React.js, Nginx, Java, Amazon EC2, Sass, Amazon S3, Hadoop, Airflow, Presto, Druid, MySQL, Amazon Elasticache, Amazon EBS, Airpal, and Redis.

Official tech stack details were taken from the StackShare website.

Web Development Stacks at LANARS

At LANARS, we aim to provide you with the best possible result for reasonable money. Advanced web application technologies are the way we help you to reduce the development and project maintenance budget, keep your databases secured, and launch your project as it was planned.

We use both popular and custom tech stack solutions, in an effort to match the one that suits your product requirements best. At the same time, we never offer you technologies that have not been tried and tested by our team. Our core principles:

  • Proven and tested development tools
  • Experienced developers with practical knowledge of the tech stack they are going to work with regarding your project
  • We constantly watch the industry and implement web application stack updates, to deliver the best results
  • Security and scalability are our key priorities

What do we commonly use to embody clients’ ideas? For the front-end, we use such components as React.js, Redux, Next.js, Angular, Rx.js, ES5, ES6, and Typescript. The back-end; Node.js, Feathers.js, Nest.js, Redis, and Python (Django or Flask) are popular. Our developers build and manage databases with MySQL, Postgresql MongoDB, and FireBase Realtime Database. Components like Nginx, Bitbucket, Team City, Docker, Zabbix, and Apache are commonly used for infrastructure and side algorithms.

Learn more on web development technologies and approaches from our blog article What does the CTO in a startup do.

Choose a perfect web stack for your project with LANARS.

Contact us for advanced consulting.

--

--

LANARS — Painless Innovations Provider
Frontend Weekly

LANARS is an international hardware & software development company. We develop IoT, IIoT, mobile applications, web applications, and custom software solutions.