Mean Stack Development

MEAN is an acronym for MongoDB, ExpressJS, AngularJS and Node.js

Let’s get started with MEAN stack as it is a more established stack, but most of what’s there in MEAN is covered in MERN as well (swapping Angular with React).

MEAN is a set of components that together, provide an end-to-end framework for building dynamic web applications; starting from code running in the browser to accessing the database at the backend.

Every software stack consists of an operating system, a database, a server, and a development platform—all you need to build and run the back end of a website or web applications.

Unlike other conventional stacks, the MEAN stack is purely JavaScript-powered, thanks to Node.js, the JS development environment that gives JavaScript back-end functionality.

The MEAN stack is made up of –

  • MongoDB: Document database – used by back-end application to store its data as JSON (JavaScript Object Notation) documents
  • Angular (earlier Angular.js, now known as Angular 2): Front-end web app framework that runs JavaScript code in the user’s browser, allowing the application UI to be dynamic
  • Express (also Express.js): Back-end web application framework running on top of Node.js
  • Njs: JavaScript runtime environment – that allows the implementation of application back-end in JavaScript

A common thread running through the MEAN stack is JavaScript – every line of code written is in the same JavaScript language. There are huge advantages to using a uniform language throughout the stack. Even the database is accessed using MongoDB’s native Node.js driver. Using the driver makes JavaScript developer at ease as all interaction is performed using familiar concepts such as JavaScript objects and asynchronous execution using callback functions etc.

MEAN Stack Architecture

MongoDB

MongoDB is an open-source, document database –

  • That provides persistence for application data and is designed for scalability and developer agility.
  • It bridges the gap between key-value stores, that are fast and scalable, and relational databases, that have rich functionality.
  • Instead of storing data in table rows and table columns as in a relational database, MongoDB stores JSON documents in collections with dynamic schemas.
  • MongoDB makes it easy to store and combine data of any structure, without giving up sophisticated validation rules, flexible data access, and rich indexing functionality.
  • It is possible to dynamically modify the schema without downtime, that is vital for rapidly evolving applications.
  • It can be scaled within and across geographically distributed data centers, providing high levels of availability and scalability.
  • As the deployments grow, the database scales easily with no downtime, and without changing the application.

Advantages of using MongoDB in MEAN stack

  • It allows us to define our schema entirely on the code side.
  • With an RDBMS you have to deal with the fact that objects in your database are stored in a format that is not usable by your front end and vice versa.
  • This wastes precious time and energy whenever a data issue arises or some database administration is done.

In contrast, in MongoDB, the format of the documents in your collections is not an issue. This lets you spend a lot less time worrying about schema migrations because adding or deleting data items from your schema doesn’t require you to do anything on the database side. MongoDB is the bedrock of MEAN stack, and one should strongly consider using it in one’s next project.

Angular

Created and maintained by Google,

  • It runs on JavaScript code within the user’s web browsers to implement a reactive user interface (UI).
  • A reactive UI gives the users immediate feedback as they give their input as compared to static web forms where all data is submitted and there is waiting.
  • Earlier Angular was called AngularJS but now it is Angular or Angular 2 after it was rewritten in Typescript, a superset of JavaScript.
  • The application front-end is implemented as a set of components – each of which consists of JavaScript code and an HTML template that includes hooks to execute and use the results from functions. Complex application front-ends can be crafted from many simple nested components.
  • Angular application code can also be executed on the back-end server rather than in a browser, or as a native desktop or mobile application.

    Express

    Express is the web application framework

    • that runs the back-end application JavaScript code. Express runs as a module within the Node.js environment.
    • Express can handle the routing of requests to the right parts of the application or to different apps running in the same environment.
    • The application’s full business logic can be within Express and even the final HTML can be generated to be rendered by the user’s browser. Also, Express can be used to simply provide a REST API and thereby giving the front-end app access to the resources it needs for example, the database.

      Node.js

      Node.js is a JavaScript runtime environment

      • that runs that back-end application via Express.
      • js is based on Google’s V8 JavaScript engine which is used in the Chrome browsers.
      • It also includes several modules that provides features essential for implementing web applications – including networking protocols such as HTTP.
      • Third party modules, including the MongoDB driver, can be installed, using the npm tool.
      • js is an asynchronous, event-driven engine where large numbers of operations can be performed in parallel which is essential when scaling applications.
      • MongoDB was also designed to be used asynchronously and so it works well with Node.js applications.

      Advantages of MEAN Stack

      • By coding with Javascript throughout, performance gains in both the software itself and in the productivity of developers can be realized.
      • With MongoDB, documents can be stored in a JSON-­like format, JSON queries can be written on our ExpressJS and NodeJS based server, and JSON documents can be passed on seamlessly to the AngularJS frontend.
      • Debugging and database administration become much easier when the objects stored in the database are identical to the objects the client Javascript sees.
      • Developers working on the client side can easily understand the server-side code and database queries;
      • Using the same syntax and objects throughout saves the developer from dealing with multiple sets of language best practices and makes it easy to understand the codebase.
      • One can write entire stack in one language, have schemes for ease of use on top of a flexible NoSQL database, and nest schemas when one doesn’t really need to have separate collections.
      • All
of this adds up to one saving time and spending it more productively and not worrying about how the objects translate between different levels of the stack.

      The above technologies are revolutionizing the web, building web-based services that have the look, feel, and performance of native desktop or mobile applications.