MEAN STACK

Agenda
• Introduction
• What is LAMP?
• Requirements for a modern web
• What is MEAN?
• What is MongoDB?
• What is Express?
• What is Angular JS?
• What is Node.JS?
• Disadvantages of MEANSTACK
• Conclusion
• Any Questions?
 Introduction
• MEAN is an opinionated full stack JavaScript
framework which simplifies and accelerates web
application development.
• MEAN represents a major shift in architecture and
mental models — from relational databases to
NoSQL and from server-side Model-View-Controller
to client-side, single-page applications.
• MEAN is an acronym for Mongo DB, Express
JS,Angular JSand Node. Js.
 What is LAMP ?
• Linux
• Apache
• MySQL
• PHP
• LAMP stack is a popular open source web platform commonly
used to run dynamic web sites andservers.
• It includes Linux, Apache, MySQL, and PHP/Python/Perl and is
considered by many the platform of choice for development
and deployment of high performance web applications which
require a solid and reliable foundation.
 Problems with LAMP?
• Apache is not the fastest web serveraround
• It’s hard to write good-to-read, reusable and fastPHP
code
• Frontend works with other languages than the
backend
• Too many conversions (XML to PHPto HTML, model
to SQL)
• There is no separated server-side and client-side
development
 Requirements for a
modern web?
• Customers want fast web sites/fast response times
• No page reloads
• Enterprises want to govirtual
o One box + Several virtual images => Shared Hardware
o System with minimal memory footprint/overhead needed
• As many concurrent requests aspossible
• Only load resources when needed (conditional
loading)
• Mobile/Responsive UIs
 What is MEAN Stack?
MEAN Stack is a full-stack JavaScript solution that
helps you build fast, robust and maintainable
production web applications using MongoDB, Express,
AngularJS, and Node.js.
• 100% free , 100% Open Source
• 100% Java Script (+JSONand HTML)
• 100% Web Standards
• Consistent Models from the backend to the frontend and back
• Use a uniform language throughout your stack
o JavaScript (the language of the web)
o JSON(the data format of theweb)
o No conversion needed for the database
• Use JavaScript with a great framework (compared to jQuery)
• Allows to start with the complete frontend development first
• Very low memory footprint/overhead
Processing model
 MongoDB
MongoDB is a cross-platform document-oriented
database - classified as a NoSQL database which
eschews the traditional table-based relational database
structure in favour of JSON-like documents with
dynamic schemas.
 What is MongoDB
• Developed by software company 10gen (now
MongoDB Inc.)
• Fast NoSQLschemaless database written in C++
• Document-Oriented Storage
o JSON-style documents with dynamic schemas
• Full Index Support
o Index on any attribute
o Replication & HighAvailability
• Auto-Sharding
o Scale horizontally without compromising functionality
 MongoDB RDBMS

Collection Table

Document Row

Index Index

Embedded Document Join

Reference Foreign Key

 Example
>db.mycol.insert({ _id: ObjectId(7df78ad8902c), title:
'MongoDB Overview', description: 'MongoDB is no sql
database', by: 'tutorials point', url:
'http://www.tutorialspoint. com', tags: ['mongodb',
'database', 'NoSQL'], likes: 100 })
MongoDB - Document
MongoDB - Collection
MongoDB – Query a
database
 Advantages And
Disadvantages
Advantages
• Lightening fast.
• Auto sharding.
• Replication is very easy.
• You can perform rich queries, can create on the fly
indexes with a single command.
Disadvantages
• Very unreliable
• Indexes take up a lot of RAM.
o B-tree indexes
 Express JS
Express is a minimal and flexible node.js web
application framework, providing a robust set of
features for building single and multi-page, and hybrid
web applications.
 What is Express ?
• Node JSbased web framework
• Based on connect middleware
• Makes usage of Node JSeveneasier
• Easy to implement RESTAPI
• Easy to implement session management
• Supports several template rendering engines (Jade,EJS)
o Supports partials -> so you can split your HTML in
fragments
• Asynchronous
• Implements MVCpattern
 Express – What is it?
• Allows to set up middlewares to respond to HTTP
Requests.
• Defines a routing table which is used to perform
different action based on HTTPMethod and URL.
• Allows to dynamically render HTML Pages based on
passing arguments to templates.
 Example
var express = require('express');
var app = express();
app.get('/', function (req, res)
{
res.send('Hello World!'); });
app.listen(3000, function ()
{
console.log('Example app listening on port 3000!');
});
 Advantages And
Disadvantages
Advantages
• Regardless of complexity, there should be very few
roadblocks if you know JavaScriptwell.
• Supports concurrency well.
• Fast and the performance is comparable with Golang
micro frameworks and Elixir's Phoenix.

Disadvantages
• There is no built in error handlingmethods.
 What is Angular?
AngularJS is an open-source JavaScript
framework, maintained by Google, that assists with
running single-page applications.
• Its goal is to augment browser-based applications
with model–view–controller (MVC) capability, in an
effort to make both development and testingeasier.
 AngularJS
• JavaScript framework developed by Google
• Based on Model-View-* Pattern (client-side)
o MVC/MVVM
o Bi-Directional Data Binding
• Declarative Programming (focus on what – not the how!)
o Directives are integrated in HTMLdirectly
o DOM Manipulations completely hidden
• Great for Frontend development
o Great for SPA(Single PageApplications)
o Great for mobile apps
• Very modular and extensible
o Makes testing an ease
• Great Browser support (> IE8)
• Well documented
Two Way Data-binding
 AngularJs directives
• ng-app
o Declares an element as a root element of the application
allowing behaviour to be modified through custom HTML
tags.
• ng-bind
o Automatically changes the text of a HTML element to the
value of a given expression.
• ng-model
o Similar to ng-bind, but allows two-way data bindingbetween
the view and the scope.
• ng-controller
o Specifies a JavaScript controller class that evaluates HTML
expressions.
 AngularJs directives
• ng-repeat
o Instantiate an element once per item from acollection.
• ng-show & ng-hide
o Conditionally show or hide an element, depending onthe
value of a boolean expression.
• ng-switch
o Conditionally instantiate one template from a set of choices,
depending on the value of a selectionexpression.
• ng-view
o The base directive responsible for handling routes that
resolve JSONbefore rendering templates driven by specified
controllers.
 Advantages and
Disadvantages
Advantages
•Fast development
•Makes developing SPAeasy
•Awesome performance
•Make apps scalable
Disadvantages
•Good for IO driven apps only (not games)
 Node JS
Node.js is a platform built on Chrome's JavaScript
runtime for easily building fast, scalable network
applications.
• Node.js uses an event-driven, non-blocking I/O
model that makes it lightweight andefficient,
perfect for data-intensive real-time applications that
run across distributed devices.
 What is Node JS?
• Written in C/C++
o Can also use Clibraries
• Built on top of Chrome’s V8 engine – sopure
JavaScript!
o Therefore based on latest ECMAScript 5
• Framework to build asynchronous I/O applications
• Single Threaded – no concurrency bugs – no
deadlocks!
o Not internally though – but we’ll get to that
• One node process = one CPUCore
 What is Node JS continue
• Can easily handle 10k concurrent connections
o Doesn’t have any problems with concurrency
o Doesn’t create much overhead (CPU/Memory)
• Easily scalable (just create a cluster)
• Very fast (well, it’s mostly Ccode)
• Installation and first server start within less than5
minutes
o REST-API that replies to GETrequests can be
implemented in less than 5 minutes aswell!
• It’s not a web framework!
 Blocking I/O vs.
Non-Blocking I/O
 Example
var http = require('http');
http.createServer(function (req, res)
{
res.writeHead(200, {'Content-Type': 'text/plain'});
res.end('HelloWorld\n');
}).listen(80);
console.log('Server listening on port 80');
 Advantage and
Disadvantage
Advantages
• Node.js is fast
• The ever-growing NPM
• Real-time web apps
• Productivity
Disadvantages
• JavaScript's semantics and culture
 Disadvantages of mean
Stack
• There are still no general JScoding guidelines
• MongoDB is not as robust as an SQLserver
o This security is what they sacrifice to gain speed
• Once you’ve created the first site with this
technology, it’s hard to go back tothe old approach
 Conclusion
In the end, Mean is a full stack, Javascript, web
application framework. If you require a fast, easy,
simple way to create a modern, responsive, dynamic
web site then MEAN would be a great solution.

PPT Source : Krishna Prasad

 References
• http://www.mean.io
• https://angularjs.org
• http://mongodb.org
• https://nodejs.org
• http://expressjs.com
• http://slideshare.net
Any Questions ? ?
THANK YOU