Meanstack overview
Download as PPTX, PDF2 likes516 views
The document discusses the MEAN stack and its components. It begins with an agenda that includes discussing when and why to use MEAN, what MEAN is comprised of (MongoDB, ExpressJS, NodeJS, and AngularJS), and how to implement MEAN. It then covers each component in more depth, discussing MongoDB's document-oriented data structure, ExpressJS's web application framework capabilities, NodeJS's asynchronous and non-blocking architecture, and AngularJS's model-view-controller capabilities for building single-page apps. Examples are provided for building sample MEAN applications.
![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, … }
}
}](https://image.slidesharecdn.com/meanstack-overview-161005091911/85/Meanstack-overview-66-320.jpg)
![[Blibli Brown Bag] Nodejs - The Other Side of Javascript](https://cdn.slidesharecdn.com/ss_thumbnails/i9sycn9mqmawqhdzv0i6-signature-6c4174f35aa29065af3a8befc1a3a39ca764f84b5c082116486141991cd72c8c-poli-160225041632-thumbnail.jpg?width=560&fit=bounds)
![Java script nirvana in netbeans [con5679]](https://cdn.slidesharecdn.com/ss_thumbnails/javascriptnirvanainnetbeanscon5679-160927041807-thumbnail.jpg?width=560&fit=bounds)
Ad
More Related Content
What's hot (20)
Similar to Meanstack overview (20)
Ad
Recently uploaded (20)
Ad
Meanstack overview
- 2. 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
- 3. When MEAN Scenario of using meanjs
- 4. When MEAN Scenario of using meanjs
- 5. When MEAN Scenario of using meanjs
- 6. When MEAN Scenario of using meanjs
- 7. Equinox Platform Architecture ES00 E00 E01 E03 E04 E06E11 ES04 ES05 ES06 ES07 ESXX AF SF HTTP ........................................................................................................... ECXX
- 8. ES00 ES04 ES05 ES06 ES07 ESXX SF HTTP E01 E03 E04 E06E11 E00 AF ECXX AngularJS (client) NodeJS + ExpressJS SERVER When MEAN Scenario of using meanjs
- 9. ES00 ES04 ES05 ES06 ES07 ESXX SF HTTP E01 E03 E04 E06E11 E00 AF ECXX AngularJS (client) NodeJS + ExpressJS SERVER When MEAN Scenario of using meanjs
- 10. AngularJS (client) NodeJS + ExpressJS SERVER When MEAN Scenario of using meanjs
- 11. AngularJS (client) NodeJS + ExpressJS SERVER When MEAN Scenario of using meanjs
- 12. • 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
- 13. Why MEAN Reasons you should love mean
- 14. Why MEAN Terminology of Webapplication
- 15. Why MEAN Terminology of Conventional Technologies (Servlet / ASP.NET)
- 16. Why MEAN Terminology of MEANJS
- 17. Why MEAN Terminology of LAMP
- 18. Why MEAN Terminology of LAMP
- 19. Why MEAN Blocking I/O with Multi Threading Server (JAVA / .NET)
- 20. 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
- 21. Why MEAN Let’s learn more blocking I/O
- 22. Why MEAN Let’s learn more blocking I/O
- 23. Why MEAN Let’s learn more blocking I/O
- 24. Why MEAN Let’s learn more blocking I/O
- 25. Why MEAN Let’s learn more nonblocking I/O
- 26. Why MEAN Let’s learn more nonblocking I/O
- 27. Why MEAN Let’s learn more nonblocking I/O
- 28. Why MEAN Let’s learn more nonblocking I/O
- 29. Why MEAN Let’s learn more nonblocking I/O
- 30. 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
- 31. Why MEAN Bundle BDD and TDD
- 33. BREAK 15 MINUTES
- 34. What’s MEAN Component surgery of mean stack
- 35. What’s MEAN Component of MEAN
- 36. What’s MEAN AngularJS IN Depth
- 37. What’s MEAN AngularJS IN Depth
- 38. 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!)
- 39. What’s MEAN Model – View – Controller(*)
- 40. What’s MEAN Data Binding in Classical Template Systems
- 41. What’s MEAN Data Binding in Classical Template Systems
- 42. What’s MEAN Data Binding in Classical Template Systems
- 43. What’s MEAN Create Sample application /overviews/code/gulp-ng(2 ci)
- 44. What’s MEAN Node in depth
- 45. 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)
- 46. What’s MEAN Architecture LibUv: environment abstraction layer (on top of libeio & libev) libuv
- 47. 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!
- 48. What’s MEAN Event Loop and Single Thread app
- 49. What’s MEAN Problem of single thread
- 50. 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
- 51. 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
- 52. 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
- 53. What’s MEAN 3 minutes rest application /overviews/code/gulp-ng(2 ci)
- 54. What’s MEAN ExpressJS in depth
- 55. 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
- 56. 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
- 57. What’s MEAN Model – View – Controller(*)
- 58. 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
- 59. What’s MEAN Model – View – Controller(*) View Controller Model Model Controller Route
- 60. What’s MEAN MongoDB in depth
- 61. 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
- 62. 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
- 63. What’s MEAN What is it?
- 65. What’s MEAN More Data Storage
- 66. 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, … } } }
- 67. What’s MEAN Driver and Support Drivers Support for the most popular languages and frameworks Frameworks Morphia MEAN Stack PerlRuby
- 68. What’s MEAN Query a database
- 70. What’s MEAN Relationships by reference
- 72. What’s MEAN Aggregation with Map Reduce
- 73. What’s MEAN Aggregation with Distinct
- 75. What’s MEAN Replication – secondaries communicate
- 77. 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
- 79. What’s MEAN Sharding in clusters
- 80. What’s MEAN Sharding & Replication
- 81. What’s MEAN Create Sample application /overviews/code/gulp-ng(2 ci)
- 82. What’s MEAN Node in depth
- 83. How to be MEAN Develop Tools
- 84. How to be MEAN Develop Tools
- 85. How to be MEAN Develop Tools ServerClient View Controller Service Route Controller Model REST API call
- 86. How to be MEAN Sequence Diagram
- 87. How to be MEAN Version 0.3x Folder Structure
- 88. How to be MEAN Version 0.4x Folder Structure
- 89. How to be MEAN Version 0.4x Modulalities