An Overview of Popular Web Frameworks (and stacks)

Contents

• Intro
• Front-end frameworks
• Back-end frameworks
• Popular web stacks

Intro

Frameworks help you get projects started more quickly compared to using "vanilla" code. Instead of building completely from scratch, you make use of existing code, libraries, layouts, etc to get your project up-and-running faster.

When it comes to web development, we typically split things into front-end and back-end. Front-end typically consists of languages that implement what you see: HTML, CSS, JavaScript, etc. Back-end typically consists of tech that deals with data processing, using server side languages and databases like Python, Java, PHP, MySQL, PostgreSQL, etc.

Let's look at some popular front-end frameworks first, then we'll move onto back-end.

Front-End Frameworks

Vue (Vue.js)

• Language: JavaScript
• First released: 2014
• Developed by: Evan You
• Used by: Nintendo, Google, Adobe, BMW, Apple (source: madewithvuejs.com)
• Popularity: 15.2% (stackoverflow developer survey 2019) / 166k stars on GitHub
• Website: vuejs.org​
• Repo: github.com/vuejs/vue​

View is an open-source model-view-viewmodel (MVVM) JavaScript framework for building user interfaces and single-page applications. It uses an incrementally adaptable architecture that focuses on declarative rendering and component composition.

Angular

• Language: JavaScript
• First released: 2016
• Developed by: Google
• Used by: Samsung, Google, GitHub, Delta, Microsoft, Santander, Forbes, etc (source: madewithangular.com)
• Popularity: used by 30.7% of developers (in stackoverflow 2019 survey) / 62.2k stars on GitHub
• Website: angular.io​
• Repo: github.com/angular/angular​

Angular is a TypeScript-based open-source web application framework. Angular does not have a concept of "scope" or controllers; instead, it uses a hierarchy of components as its primary architectural characteristic. Angular JS = v1.x and up; Angular = v2.x and up.

React (React.js)

• Language: JavaScript
• First released: 2013
• Developed by: Jordan Walke / Facebook
• Used by: Facebook, Instagram, Netflix, New York Times, WhatsApp, Dropbox, etc (source: madewithreactjs.com)
• Popularity: used by 31.3% of developers (in stackoverflow 2019 survey) / 151k stars on GitHub
• Website: react.js​
• Repo: github.com/facebook/react​

React is an open-source JavaScript library for building user interfaces that uses a component-based architecture. It's commonly used as a development base for creating single-page or mobile apps. React only renders the Document Object Model (DOM) so additional libraries are needed for state management and routing (such as Redux and React Router).

Ember

• Language: JavaScript
• First released: 2011
• Developed by: Yehuda Katz / Ember Core Team
• Used by: Apple Music, LinkedIn, PlayStation Now Vine, Twitch (source: builtwithember.io​)
• Popularity:  21.5k stars on Github
• Website: emberjs.com​
• Repo: github.com/emberjs/ember.js​

Ember is an open-source JavaScript web framework based on the model-view-viewmodel (MVVM) pattern. Developers can create scalable single-page web applications by using common idioms and best practices.

Backbone

• Language: JavaScript
• First released: 2010
• Developed by: Jeremy Ashkenas
• Used by: AirBnB, Hulu, WordPress.com, Bitbucket, Foursquare, Delicious (source: Backbone.js Examples​)
• Popularity: used by 0.7% of all websites according to w3techs / 27.6k stars on Github
• Website: backbonejs.org​
• Repo: github.com/jashkenas/backbone​

Backbone is an open-source JavaScipt library with a RESTful JSON interfaces that uses the model-view-presenter (MVP) application design paradigm. It's a ligjtweigt library that's deigned for single-page applications and keeping various aprts of the application synchronised.

jQuery

• Language: JavaScript
• First released: 2006
• Developed by: The jQuery Team
• Used by: Google, Facebook, Twitter, Amazon, LinkedIn, Reddit
• Popularity: used by 48.7% of developers (in stackoverflow 2019 survey) / 53.5k stars on Github / 75% of the top 10 million websites use jQuery, according to w3Techs​
• Website: jquery.com​​
• Repo: github.com/jquery/jquery​

jQuery is a small, fast, and rich, open-source JavaScript library. It's essentially a Document Object Model (DOM) manipulation library. Although it's popularity has been declining in recent years due to modern web browser improvements and other frameworks such as React and Angular. Some say there's less need for jQuery in modern web development.

Bootstrap

• Language: CSS (cascading style sheets)
• First released: 2011
• Developed by: Mark Otto / Jacob Thornton / Twitter
• Used by: Ninterndo, Twitter, Apple, Reuters, etc (source: getbootstrap.com)
• Popularity: used by 21% of all websites (according to w3techs) / 141k stars on Github
• Website: getbootstrap.com​
• Repo: github.com/twbs/bootstrap​

Bootstrap is a CSS framework that's aimed at responsive and mobile-friendly front-end web development. It contains CSS and (optionally) JavaScript-based design templates for typography, forms, buttons, navigation, and other interface components.

Back-End Frameworks

Django

• Language: Python
• First released: 2005
• Developed by: Django Software Foundation
• Used by: Instagram, Spotify, YouTube, BitBucket, DropBox, Pinterest, etc (source: djangostars.com)
• Popularity: used by 13% of developers (in stackoverflow 2019 survey) / 50k stars on Github
• Website: djangoproject.com​
• Repo: github.com/django/django​

Rails (Ruby on Rails)

• Language: Ruby
• First released: 2004
• Developed by: David Heinemeier Hansson
• Used by: Airbnb, Bloomberg, GitHub, Soundcloud, Groupon, etc (source: netguru.com)
• Populatiry: used by 8.2% of developers (in stackoverflow 2019 survey) / 45.8k stars on Github
• Website: rubyonrails.org​
• Repo: github.com/rails/rails​

Rails is an open-source web framework written in Ruby that uses the model-view-controller (MVC) framework. Rails emphasises popular software engineering patterns and paradigms such as convention over configuration (CoC), don't repeat yourself (DRY), and the active record pattern. It is widely regarded as one of the most developer-friendly frameworks.

Laravel

• Language: PHP
• First released: 2011
• Developed by: Taylor Otwell
• Used by: BBC, 9GAG, Pfizer, Ratio, Crowdcube, etc (source: donatix.net)
• Popularity:  used by 10.5% of developers (in stackoverflow 2019 survey) / 21.3k stars on Github
• Website: laravel.com​
• Repo: github.com/laravel/framework​

Laravel is an open-source web framework written in PHP that follows model-view-contrller (MVC) architectural pattern. Laravel is based on Symfony (a popular web application framework) and features a modular packaging system with a dedicated dependency manager, application deployment tools and maintenance, and orientatt towards syntactic sugar (i.e. code that's more human-friendly).

Spring

• Language: Java
• First released: 2002
• Developed by: Pivotal Software
• Popularity: used by 16.2% of developers (in stackoverflow 2019 survey) / 37.7k stars on Github
• Website: spring.io​
• Repo: github.com/spring-projects/spring-framework​

Spring is an open-source application framework and inversion of control container for the Java platform. It uses its own model–view–controller (MVC) web application framework. The framework doesn't impose any specific programing model but it has become popular in the Java community as an addition to the Enterprise JavaBeans (EJB) model

Express (express.js)

• Language: JavaScript
• First released: 2010
• Developed by: TJ Holowaychuk / StrongLoop
• Used by: PayPal, Uber, IBM, Accenture, etc (source: expressjs.com)
• Popularity: 19.7% (stackoverflow developer survey 2019) / 49k stars on Github
• Website: expressjs.com​
• Repo: github.com/expressjs/express​

Express is an open-source web application framework for Node.js that doesn't enforce any architecture pattern. It's a realtively minimal framework with many features availabel as plugins. Express is the back-end component of the MEAN stack, together with the MongoDB database software and AngularJS front-end framework

Flask

• Language: Python
• First released: 2010
• Developed by: Armin Ronacher
• Used by: Pinterest, LinkedIn, Red Hat, Netflix, Samsung, etc (source: github.com)
• Popularity: used by 12.1% of developers (in stackoverflow 2019 survey) / 50.8k stars on Github
• Website: palletsprojects.com/p/flask​
• Repo: github.com/pallets/flask​

Flask is an open-source micro web framework written in Python. It's very minimal and doesn't come with any tools or libraries out of the box. However, Flask is a very extensionable framework, therefore its features can be highly customised.

Popular Web Stacks

Having looked at some popular frameworks and libraries, it's now time to group some of them together to help us create a functioning web app. This is where the web/tech stack comes in.

A web stack typically consists of one or more front-end libraries or frameworks (such as React for JavaScript, Bootstrap for CSS, etc), a back-end framework (such as Django for Python), a database (such as PostgreSQL), a server (such as Apache) and an operating system to run everything on (such as Ubuntu on Linux).

When it comes to chosing which technnologies / libraries / frameworks / languages to use, it really depends on the project, infrastructure requirements, developer skillsets, etc. Listed below are some common web stacks - but a project could pick-and-mix its own stack (e.g. Django, PostgreSQL, Linux, Nginx, React) or even go serverless.  

LAMP: Linux - Apache - MySQL - PHP / Python / Perl - (JavaScript)

LEMP: Linux - Nginx - MySQL - PHP - (JavaScript)

MEAN: MongoDB - Express - AngularJS - Node.js

MERN: MongoDB - Express - React - Node.js

MEVN: MongoDB - Express - Vue - Node.js

Ruby on Rails: Ruby - SQLite - Rails - (JavaScript)