What is the MEAN stack? JavaScript web applications

The web application stack powered by MongoDB, Express, Angular, and Node.js leverages JavaScript from top to bottom

What is the MEAN stack? Next-gen web applications
Thinkstock

Most anyone who has developed web applications knows the acronym LAMP, which is used to describe web stacks made with Linux, Apache (web server), MySQL (database server), and PHP, Perl, or Python (programming language).

Another web-stack acronym has come to prominence in the last few years: MEAN—signifying a stack that uses MongoDB (database server), Express (server-side JavaScript framework), Angular (client-side JavaScript framework), and Node.js (JavaScript runtime).

MEAN is one manifestation of the rise of JavaScript as a “full-stack development” language. Node.js provides a JavaScript runtime on the server; Angular and Express are JavaScript frameworks used to build web clients and Node.js applications, respectively; and MongoDB’s data structures are stored in a binary JSON (JavaScript Object Notation) format, while its queries are expressed in JSON.

In short, the MEAN stack is JavaScript from top to bottom, or back to front. A big part of MEAN’s appeal is this consistency. Life is simpler for developers because every component of the application—from the objects in the database to the client-side code—is written in the same language. 

This consistency stands in contrast to the hodgepodge of LAMP, the longtime staple of web application developers. Like MEAN, LAMP is an acronym for the components used in the stack—Linux, the Apache HTTP server, MySQL, and either PHP, Perl, or Python. Each piece of the stack has little in common with any other piece. 

This isn’t to say the LAMP stack is inferior. It’s still widely used, and each element in the stack still benefits from an active development community. But the conceptual consistency that MEAN provides is a boon. If you use the same language, and many of the same language concepts, at all levels of the stack, it becomes easier for a developer to master the whole stack at once.

Most MEAN stacks feature all four of the components—the database, the front-end, the back-end, and the execution engine. This doesn’t mean the stack consists of only these elements, but they form the core.

MongoDB

Like other NoSQL database systems, MongoDB uses a schema-less design. Data is stored and retrieved as JSON-formatted documents, which can have any number of nested fields. This flexibility makes MongoDB well-suited to rapid application development when dealing with fast-changing requirements.

Using MongoDB comes with a number of caveats. For one, it has a reputation for being insecure by default. If you deploy it in a production environment, you must take steps to secure it. And for developers coming from relational databases, or even other NoSQL systems, you’ll need to spend some time getting to know MongoDB and how it works. InfoWorld’s Martin Heller dove deep into MongoDB 4 in InfoWorld’s review, where he talks about MongoDB internals, queries, and drawbacks.

As with any other database solution, you’ll need middleware of some kind to communicate between MongoDB and the JavaScript components. One common way to do that in a MEAN stack is with Mongoose. Mongoose not only provides connectivity, but object modeling, app-side validation, and a number of other functions that you don’t want to be bothered with reinventing for each new project.

Express.js

Express is arguably the most widely used web application framework for Node.js. Express provides only a small set of essential features—it’s essentially a minimal, programmable web server—but can be extended by way of plug-ins. This no-frills design helps keep Express lightweight and performant.

Nothing says a MEAN app has to be served directly to users via Express, although that’s certainly a common scenario. An alternative architecture is to deploy another web server, like Nginx or Apache, in front of Express as a reverse proxy. This allows for functions like load balancing to be offloaded to a separate resource.

Because Express is deliberately minimal, it doesn’t have much conceptual overhead associated with it. The tutorials at Expressjs.com can take you from a quick overview of the basics to connecting databases and beyond.

Angular

Angular (formerly AngularJS) is used to build the front end for a MEAN application. Angular uses the browser’s JavaScript to format server-provided data in HTML templates, so that much of the work of rendering a webpage can be offloaded to the client. Many single-page web apps are built using Angular on the front end.

One important caveat: Developers work with Angular by writing in TypeScript, a JavaScript-like typed language that compiles to JavaScript. For some people this is a violation of one of the cardinal concepts of the MEAN stack—that JavaScript is used everywhere and exclusively. However, TypeScript is a close cousin to JavaScript, so the transition between the two isn’t as jarring as it might be with other languages.

For a deep dive into Angular, InfoWorld’s Martin Heller has you covered. In his Angular tutorial he’ll walk you through the creation of a modern, Angular web app.

Node.js

Last, but hardly least, there’s Node.js—the JavaScript runtime that powers the server side of the MEAN web application. Node is based on Google’s V8 JavaScript engine, the same JavaScript engine that runs in the Chrome web browser. Node is cross-platform, runs on both servers and clients, and has certain performance advantages over traditional web servers such as Apache. 

Node.js takes a different approach to serving web requests from traditional web servers. In the traditional approach, the server spawns a new thread of execution or even forks a new process to handle the request. Spawning threads is more efficient than forking processes, but both involve a good deal of overhead. A large number of threads can cause a heavily loaded system to spend precious cycles on thread scheduling and context switching, adding latency and imposing limits on scalability and throughput. 

Node.js is far more efficient. Node runs a single-threaded event loop registered with the system to handle connections, and each new connection causes a JavaScript callback function to fire. The callback function can handle requests with non-blocking I/O calls, and if necessary can spawn threads from a pool to execute blocking or CPU-intensive operations and to load-balance across CPU cores.

Node’s approach requires less memory to handle more connections than most competitive architectures that scale with threads—including Apache, ASP.Net, Ruby on Rails, and Java application servers. Thus Node has become an extremely popular choice for building web servers, REST APIs, and real-time applications like chat apps and games. If there is one component that defines the MEAN stack, it’s Node.js. 

For an introduction to Node, see Martin Heller’s explainer. To get started developing with Node, see his Node.js tutorial

MEAN stack companions

There’s nothing that says a MEAN stack must consist of only MongoDB, Express, Angular, and Node.js. The MEAN stack can include other pieces that complement or extend these four components.

For example, caching systems like Redis or Memcached could be used within Express to speed up responses to requests. Or the React framework could be used as an alternative or a complement to Angular. The acronym “MERN” is sometimes used to describe MEAN stacks that use React in place of Angular.