Full Stack JavaScript Development With MEAN

Adam Bretz

JavaScript has come a long way since being released back in 1995. We've seen several major versions of the ECMAScript specification and the rise of single-page web applications, all powered by client side JavaScript frameworks. Initially, all JavaScript development and innovation was done in the browser because that was the only context that supported the language. As time passed, web developers started to realize that many of JavaScript's most useful features (that it's non-blocking, it's event-driven, that it's a familiar language for many) could be leveraged in environments other than the browser. This kick-started a second round of innovation in the JavaScript community that resulted in JavaScript running on servers and on databases.

Suddenly, knowing JavaScript didn't automatically pigeonhole you as a "front end web developer." If you know the language well, you can build servers and databases, in addition to front end user experiences. Now, for the first time, developers can build an entire web application using only JavaScript. This trend is often called things like "full stack JavaScript" or "pure JavaScript solutions." Combining four popular JavaScript technologies; MongoDB, Express, AngularJS, and Node.js to build web applications has become so popular, that it has become known as the "MEAN Stack."

MEAN Stack

  1. MongoDB – MongoDB is what's known as a NoSQL database. It can be thought of as a database of documents, rather than consisting of rows, columns, and tables. The primary use case is storing JSON data; a perfect fit when writing applications with JavaScript. What it may lack in relations and a draconian adherence to schema, it makes up for in speed, scalability, and ease-of-use.
  2. Express – Express is a thin web server framework designed to make building web servers with Node easier and more maintainable. It is an unopinionated framework which provides developers a high level of customizability but is "low-level" enough to still have access to the underlying Node framework it's built on. Express provides an easy to use request router, cookie management, a static file server, and many other HTTP building blocks needed to create enterprise-grade web servers.
  3. AngularJS – Angular is a feature-rich client side MVC JavaScript framework. It can be used to make robust and complex single-page web applications. It has built in two-way data binding and its own HTML-based templating language. It also has a feature called "directives" that allow you to extend HTML with new attributes, and even new elements. Angular is also highly testable, which may not be the most interesting facet of development, but it is often the most important and is frequently overlooked with client side code. Finally, it provides conventions and best practices to help developers structure client side solutions.
  4. Node – Node is a JavaScript runtime used to build server and networking applications. It provides all the JavaScript features found in the browser with additions for file and network I/O. It uses Google's V8 engine (the same one used in Google Chrome) to execute JavaScript. It also boasts a very active community of developers and ecosystem of Node modules (Express is one such module). While there have been other server side implementations of JavaScript, Node is, by far, the most successful in terms of development and adoption by both enthusiasts and large corporations as well.

If you are a fan of JavaScript, like I am, you should be excited by the prospect of building an entire web application using only JavaScript. The MEAN Stack is an extremely popular topic, and there is tons of information on the web out there for how to get started working with it. In fact, there is so much information, the thought of "getting started" might seem a little daunting.

That's why myself and Colin Ihrig wrote a book about it. In it, we discuss each of the four technologies that comprise the MEAN stack. We cover the most important features of each technology that will help you get up to speed and become productive very quickly. Explanations only go so far however. In addition to the many code examples, we will also walk through building a simple HR-style web application throughout the book. You'll learn a technology, see some code examples, and then walk through building a real system using the technology. At the end of the book, you'll have a functional web application that you can work on, and expand on your own with the information from the book.