The document provides an overview of the MEAN stack, which is a full-stack JavaScript solution for building web applications. It consists of MongoDB (a NoSQL database), Express (a Node.js web application framework), AngularJS (a client-side framework), and Node.js (a JavaScript runtime). The document discusses each component, how they work together, advantages like using a single programming language throughout and ability to build fast applications, and disadvantages like MongoDB not being as robust as SQL databases. It concludes that MEAN provides a fast, easy way to create modern, responsive dynamic web sites.
2. Agenda
• Introduction
• What isLAMP?
• Requirements for amodernweb
• What isMEAN?
• What isMongoDB?
• What isExpress?
• What is AngularJS?
• What isNode.JS?
• Disadvantages of MEANSTACK
• Conclusion
• Any Questions?
3. Introduction
• MEAN is an opinionated
framework which simplifies
full stack JavaScript
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-pageapplications.
• MEAN is an acronym for Mongo DB, Express
JS,Angular JSand Node.Js.
4. What is LAMP ?
• Linux
• Apache
• MySQL
• PHP
• LAMPstack is apopular open source web platform commonly
used to run dynamic web sites andservers.
• It includes Linux,Apache, MySQL,and PHP/Python/Perl andis
considered by many the platform of choice for development
and deployment of high performance web applications which
require asolid and reliable foundation.
5. 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 thanthe
backend
• Toomany conversions (XMLto PHPto HTML,model
to SQL)
• There is no separated server-side and client-side
development
6. Requirements for a
modern web?
• Customers want fast web sites/fast responsetimes
• No page reloads
• Enterprises want to govirtual
o Onebox +Severalvirtual images =>Shared Hardware
o Systemwith minimal memory footprint/overhead needed
• Asmany concurrent requests aspossible
• Only load resources when needed (conditional
loading)
• Mobile/Responsive UIs
7. 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.
8. • 100%free , 100%Open Source
• 100%JavaScript (+JSONandHTML)
• 100%Web Standards
• Consistent Models from the backend to the frontend and back
• Useauniform 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
• UseJavaScriptwith agreat framework (compared to jQuery)
• Allows to start with the complete frontend development first
• Very low memoryfootprint/overhead
11. What is MongoDB
• Developed by software company 10gen (now
MongoDB Inc.)
• FastNoSQLschemaless database written inC++
• Document-Oriented Storage
o JSON-styledocuments with dynamicschemas
• Full Index Support
o Index on anyattribute
o Replication & HighAvailability
• Auto-Sharding
o Scalehorizontally without compromisingfunctionality
17. Advantages And
Disadvantages
Advantages
• Lightening fast.
• Auto sharding.
• Replication is very easy.
• Youcanperform rich queries, cancreate on the fly
indexes with asingle command.
Disadvantages
• Very unreliable
• Indexes take up alot of RAM.
o B-tree indexes
18. Express JS
Expressis aminimal and flexible node.js web
application framework, providing arobustset of
features for building singleand multi-page, and hybrid
web applications.
19. What is Express ?
• Node JSbased webframework
• Basedon connect middleware
• Makesusageof Node JSeveneasier
• Easyto implement RESTAPI
• Easyto implement sessionmanagement
• Supports several template rendering engines (Jade,EJS)
o Supports partials -> soyou cansplit your HTMLin
fragments
• Asynchronous
• Implements MVCpattern
20. Express – What is it?
• Allows to set up middlewares to respond to HTTP
Requests.
• Defines arouting table which is used to perform
different action based on HTTPMethod and URL.
• Allows to dynamically render HTMLPagesbased on
passingarguments to templates.
21. 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!');
});
22. Advantages And
Disadvantages
Advantages
• Regardlessof complexity, there should be veryfew
roadblocks if you know JavaScriptwell.
• Supports concurrency well.
• Fastand the performance is comparable with Golang
micro frameworks and Elixir's Phoenix.
Disadvantages
• There is no built in error handlingmethods.
23. What is Angular?
AngularJSis an open-sourceJavaScript
framework, maintained byGoogle,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 andtestingeasier.
24. AngularJS
• JavaScriptframework developed by Google
• Basedon Model-View-* Pattern (client-side)
o MVC/MVVM
o Bi-Directional DataBinding
• Declarative Programming (focus on what – not thehow!)
o Directives are integrated in HTMLdirectly
o DOMManipulations completely hidden
• Great for Frontenddevelopment
o Great for SPA(Single PageApplications)
o Great for mobileapps
• Very modular and extensible
o Makestesting an ease
• Great Browser support (>IE8)
• Well documented
26. 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 changesthe text of aHTMLelement tothe
value of agivenexpression.
• ng-model
o Similar to ng-bind, but allows two-way data bindingbetween
the view and thescope.
• ng-controller
o Specifies aJavaScriptcontroller classthat evaluates HTML
expressions.
27. 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 abooleanexpression.
• ng-switch
o Conditionally instantiate one template from aset ofchoices,
depending on the value of aselectionexpression.
• ng-view
o Thebasedirective responsible for handling routes that
resolve JSONbefore rendering templates driven by specified
controllers.
29. Node JS
Node.js is aplatform built on Chrome'sJavaScript
runtime for easily building fast, scalablenetwork
applications.
• Node.js usesan event-driven, non-blockingI/O
model that makesit lightweight andefficient,
perfect for data-intensive real-time applicationsthat
run acrossdistributed devices.
30. What is Node JS?
• Written in C/C++
o Canalso useClibraries
• Built on top of Chrome’s V8engine – sopure
JavaScript!
o Therefore based on latest ECMAScript5
• Framework to build asynchronous I/Oapplications
• SingleThreaded – no concurrency bugs– no
deadlocks!
o Not internally though – but we’ll get to that
• Onenode process =one CPUCore
31. What is Node JS continue
• Caneasily handle 10k concurrent connections
o Doesn’t have any problems with concurrency
o Doesn’t create much overhead (CPU/Memory)
• Easilyscalable (just create acluster)
• Very fast (well, it’s mostly Ccode)
• Installation and first server start within lessthan5
minutes
o REST-APIthat replies to GETrequests canbe
implemented in lessthan 5 minutes aswell!
• It’s not awebframework!
35. Disadvantages of mean
Stack
• There are still no general JScodingguidelines
• MongoDB is not asrobust asan SQLserver
o Thissecurity is what they sacrifice to gain speed
• Onceyou’ve created the first site with this
technology, it’s hard to go back tothe old approach
36. 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 MEANwould be agreat solution.
PPT Source : Krishna Prasad
