Meanstack overview

Agenda
• When using “MEAN”
• Why use “MEAN”
• Break 15 minutes
• What is “MEAN”
– MongoDB
– ExpressJS
– NodeJs
– AngularJS
• Break 15 minutes
• How to be “MEAN”
– Model - View -
Controller
– Server - Client
– Request Sequence Flow
– V 0.3.x meanjs
– V 0.4.x meanjs

When MEAN
Scenario of using meanjs

Equinox Platform Architecture
ES00
E00
E01
E03
E04
E06E11
ES04 ES05 ES06 ES07 ESXX
AF
SF
HTTP
...........................................................................................................
ECXX

ES00
ES04 ES05 ES06 ES07 ESXX
SF
HTTP
E01
E03
E04
E06E11 E00
AF
ECXX
AngularJS (client) NodeJS + ExpressJS SERVER
When MEAN

AngularJS (client) NodeJS + ExpressJS SERVER
When MEAN

• Automated build for backend AND frontend
– Including check for coding conventions, testing,…
– Integration in company’s continuous integration platform
– For JS see. Gulp, yeoman, mocha, jasmine
• Customers want fast web sites/fast response times
• Response to Requirement Change (Easy to change)
• No page reloads and (Angular)
• Enterprises want to go virtual
– One box + Several virtual images => Shared Hardware
– System with minimal memory footprint/overhead needed
• As many concurrent requests as possible
• Only load resources when needed (conditional loading)
• Most of the data must come from a slim REST-API
• Mobile/Responsive UIs
Requirements for a modern web?
Why MEAN

Why MEAN
Reasons you should love mean

Why MEAN
Terminology of Webapplication

Why MEAN
Terminology of Conventional Technologies (Servlet / ASP.NET)

Why MEAN
Terminology of MEANJS

Why MEAN
Blocking I/O with Multi Threading Server (JAVA / .NET)

Why MEAN
Non-Blocking I/O with Node.js Server
https://blog.pivotal.io/pivotal-cloud-foundry/products/future-proofing-your-apps-cloud-foundry-and-node-js

Why MEAN
Let’s learn more blocking I/O

Why MEAN
Let’s learn more nonblocking I/O

Why MEAN
• http://www.behindjava.com/2015/05/why-you-are-using-nodejs.html
• https://kenai.com/projects/grizzly-sendfile/pages/Algorithms
• http://berb.github.io/diploma-thesis/original/042_serverarch.html
• http://bijoor.me/2013/06/09/java-ee-threads-vs-node-js-which-is-better-
for-concurrent-data-processing-operations/
• https://www.nginx.com/blog/thread-pools-boost-performance-9x/
• https://www.toptal.com/nodejs/why-the-hell-would-i-use-node-js
• http://www.journaldev.com/7462/node-js-processing-model-single-
threaded-model-with-event-loop-architecture
• http://www.slideshare.net/zaubersoftware/non-blocking-io-with-netty
• https://blog.pivotal.io/pivotal-cloud-foundry/products/future-proofing-
your-apps-cloud-foundry-and-node-js
• http://berb.github.io/diploma-thesis/original/042_serverarch.html
• http://www.behindjava.com/2015/05/why-you-are-using-nodejs.html
Let’s learn more nonblocking I/O
https://blog.pivotal.io/pivotal-cloud-foundry/products/future-proofing-your-apps-cloud-foundry-and-node-js

What’s MEAN
Component surgery of mean stack

What’s MEAN
Component of MEAN

What’s MEAN
AngularJS IN Depth

What’s MEAN
What is it?
• JavaScript framework developed by Google
• Development started in 2009 (Open Source)
• Based on Model-View-* Pattern (client-side)
– MVC/MVP/MVVM
– Bi-Directional Data Binding
• Declarative Programming (focus on what – not the how!)
– Directives are integrated in HTML directly
– DOM Manipulations completely hidden
• Great for Frontend development
– Great for SPA (Single Page Applications)
– Great for CRUD applications (e.g. offers factories)
– Great for mobile apps
• Very modular and extensible
– Makes testing an ease
• Great Browser support (> IE8)
• Well documented
• Less custom code than good old jQuery (which is not needed here!)

What’s MEAN
Model – View – Controller(*)

What’s MEAN
Data Binding in Classical Template Systems

What’s MEAN
Create Sample application
/overviews/code/gulp-ng(2 ci)

What’s MEAN
Node in depth
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 and efficient, perfect for data-intensive realtime
applications that run across distributed devices.
(Source: http://www.nodejs.org)

What’s MEAN
Architecture
LibUv: environment abstraction layer (on top of libeio & libev)
libuv

What’s MEAN
Architecture
• Released in 2009 by Ryan Dahl (working for Joyent)
• Written in C/C++
• Can also use C libraries
• Built on top of Chrome’s V8 engine – so pure JavaScript! ?
• Therefore based on latest ECMAScript 5
• Framework to build asynchronous I/O applications
• Single Threaded – no concurrency bugs – no deadlocks!
• Not internally though – but we’ll get to that
• One node process = one CPU Core
• Can easily handle 10k concurrent connections
• Doesn’t have any problems with concurrency
• Doesn’t create much overhead (CPU/Memory)
• Easily scalable (just create a cluster)
• Very fast (well, it’s mostly C code)
• Great community and well-maintained
• Extensible with a lot of modules (> 15.000!)
• Installation and first server start within less than 5 minutes
• REST-API that replies to GET requests can be implemented in less than 5 minutes as well!
• Careful: It’s not a web framework!

What’s MEAN
Event Loop and Single Thread app

What’s MEAN
Problem of single thread

What’s MEAN
Problem of single thread
Solutions:
Distribute the load!
• Tell node.js to fork processes (natively supported by nodeJS)
• Fabric-engine
• Cluster-api
• Jxcore
• Use nginx as load balancer

What’s MEAN
Tale form Paypal
• Five engineers started in January with Java app
• Using the Spring Framework
• In March two engineers started with the Node JS
application
– Kraken.js, express and dust.js
• In June both applications had the same functionality
• Node JS Development success in numbers
– Built almost twice as fast with fewer people
– Written in 33% fewer lines of code
– Constructed with 40% fewer files

What’s MEAN
Tale form Paypal
• Double the requests per second vs. the Java application
• Node JS -> Single Core
• Java -> Five cores!
• 35% decrease in the average response time for the same page
• Pages served 200ms faster

What’s MEAN
3 minutes rest application
/overviews/code/gulp-ng(2 ci)

What’s MEAN
ExpressJS in depth

What’s MEAN
ExpressJS in depth
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’s MEAN
What is expressjs
• Node JS based web framework
• Inspired by Sinatra (Ruby)
• Based on connect middleware
• Makes usage of Node JS even easier
• Easy to implement REST API
• use restify if you don't need anything else!
• Easy to implement session management
• Supports several template rendering engines (Jade, EJS)
• Supports partials -> so you can split your HTML in fragments
• Asynchronous (of course!)
• Implements MVC pattern
• Good documentation
• Lots of examples
• Many extensions with a nice community

What’s MEAN
Let try express
• Express application
• Public folder
– Contains all public files to be served to the client
• Routes folder
– Each route serves its own purpose
• Routes represent a URI/path
• Views folder
– Template folder
– Template can be rendered using placeholders
• Express uses Jade as default
• App.Js
– Standard Node JS Application
• Package.json
– NPM packages (dependencies)
– Remember when we’ve created the app, we’ve
called “npm install” which downloaded the
dependencies specified in there

What’s MEAN
Model – View – Controller(*)
View
Controller
Model Model
Controller
Route

What’s MEAN
MongoDB in depth

What’s MEAN
MongoDB in depth
MongoDB (from "humongous") is a cross-platform
document-oriented database - classified as a
NoSQL database which eschews the traditional
table-based relational database structure in favor
of JSON-like documents with dynamic schemas

What’s MEAN
MongoDB - What is it?
• Developed by software company 10gen (now MongoDB Inc.) in October 2007
• Fast NoSQL schemaless database written in C++
• Document-Oriented Storage
– JSON-style documents with dynamic schemas
• Full Index Support
– Index on any attribute, just like you're used to
• Replication & High Availability
– Mirror across LANs and WANs for scale and peace of mind
• Auto-Sharding
– Scale horizontally without compromising functionality
• Fast In-Place
– Updates/Atomic modifiers for contention-free performance
• Map/Reduce
– Flexible aggregation and data processing
• GridFS
– Store files of any size without complicating your stack (JSON file limit: 16MB – GridFS chunk: 255k)
– Also useful for storing any files which you want access without having to load the entire file into
memory

What’s MEAN
More Data Storage

What’s MEAN
More Data Storage
Rich Queries
•Find Paul’s cars
•Find everybody in London with a car
built between 1970 and 1980
Geospatial
•Find all of the car owners within 5km of
Trafalgar Sq.
Text Search
•Find all the cars described as having
leather seats
Aggregation
•Calculate the average value of Paul’s car
collection
Map Reduce
•What is the ownership pattern of colors
by geography over time? (is purple
trending up in China?)
{
first_name: ‘Paul’,
surname: ‘Miller’,
city: ‘London’,
location:
[45.123,47.232],
cars: [
{ model: ‘Bentley’,
year: 1973,
value: 100000, … },
{ model: ‘Rolls Royce’,
year: 1965,
value: 330000, … }
}
}

What’s MEAN
Driver and Support
Drivers
Support for the
most popular
languages and
frameworks
Frameworks
Morphia
MEAN Stack
PerlRuby

What’s MEAN
Query a database

What’s MEAN
Relationships by reference

What’s MEAN
Aggregation with Map Reduce

What’s MEAN
Aggregation with Distinct

What’s MEAN
Replication – secondaries communicate

What’s MEAN
Automatic failover

What’s MEAN
Sharding
• Sharding = horizontal scaling
• Method for storing data across multiple machines
• divides the data set and distributes the data over multiple
• servers, or shards
• Each shard is an independent database, and collectively, the
• shards make up a single logical database
• MongoDB uses sharding to support deployments with very large data
• sets and high throughput operations
• High query rates can exhaust the CPU capacity of the server
• Larger data sets exceed the storage capacity of a single machine
• Vertical scaling might be a solution
• BUT are mostly disproportionately more expensive than smaller systems

What’s MEAN
Sharding in clusters

What’s MEAN
Sharding & Replication

How to be MEAN
Develop Tools
ServerClient
View
Controller
Service Route
Controller
Model
REST API call

How to be MEAN
Sequence Diagram

How to be MEAN
Version 0.3x Folder Structure

How to be MEAN
Version 0.4x Folder Structure

How to be MEAN
Version 0.4x Modulalities

Meanstack overview

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to Meanstack overview

Similar to Meanstack overview (20)

Recently uploaded

Recently uploaded (20)

Meanstack overview