JavaScript Grows Up in the Enterprise

The meteoric rise of JavaScript, a programming language created in 10 days nearly 20 years ago, continues to astound believers and skeptics alike. It may not be the most elegant, consistent, or powerful language, but like the English language, you can use it practically everywhere and to do almost anything. Developers have pushed the envelope of JavaScript both on a grass-roots level with open source libraries, as well as within the standard bodies to push for richer language features. This acceptance has created an increasingly better variant of modern JavaScript that is rapidly becoming the dominant language and forming a thriving ecosystem for professional software development. Today, developers use JavaScript as wiring to build reactive interfaces on the front-end, as glue to connect systems in real-time in the middle-tier, and as lever to scale out the back-end in the cloud.

Smart enterprises are starting to tap into the boundless energy, fast pace of innovation, and ready-made parts available in the JavaScript ecosystem. Top developers joining enterprise teams are bringing their strong expertise of JavaScript along their equally strong opinions about their favorite frameworks or libraries with them. Christopher Tse, the founding Senior Director of McGraw-Hill Education’s R&D lab, will share the insights and lessons from three years of using JavaScript, JSON, node.js, and NoSQL to tackle hard problems that the previous generation of technologies like Java, CMS, RDBMS, and BI tools left unsolved.

Chris will show real-world examples of how JSON-native stores like Couchbase are giving JavaScript apps the scalability leverage to securely extend enterprise data to end-users globally, on a delivery platform of their choice, while shielding those systems from the unpredictable spikes on the Internet. Additionally, he will paint a picture of a JSON-centric architectural landscape that will highlight tools and libraries that are the emerging winners in the JavaScript world.

This talk was originally presented at Couchbase Live NYC on June 3, 2014. http://www.couchbase.com/couchbase-nyc-2014

Resources & Links:

Ember.js - http://emberjs.com
AngularJS - http://angularjs.org
Backbone.js - http://backbonejs.org
node.js - http://nodejs.org
Node Packaged Modules - https://www.npmjs.org
Connect Middleware - http://www.senchalabs.org/connect
Cloudify - http://getcloudify.org
d3.js - http://d3js.org
Ziggrid [Baseball Demo] - http://www.zinikinetwork.com/#beane-counter
Ziggrid [Full 30 min Presentation] - https://vimeo.com/90248214
Ziggrid [GitHub Project] - https://github.com/Ziniki-Network/Ziggrid
JSON API - http://jsonapi.org
ZINC - Coming soon!
Couchbase Server - http://www.couchbase.com

Follow @christse on Twitter (http://twitter.com/christse) for updates on topics like Enterprise JavaScript, HTML5-based Cards, and Reactive Data Analytics.

Transcript

1. JavaScript Grows Up In the Enterprise Christopher Tse (@christse) Senior Director, MH Education Labs
2. Front-End Applications Back-End Systems Cloud Integration BI & Analytics x x x x
3. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x JS N
4. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x
5. Delivering Scalable User- Facing Apps in the Cloud 1 Front-End Application Cloud Integration
6. Database App Server Browser Traditional Web App Architecture Model Controller View Relational Tables DOM
7. Browser Database API Server Modern JavaScript Web App Architecture Model Controller View NoSQL Documents DOM REST APIs
8. Browser API Server Modern JavaScript App Model Controller View DOM REST APIs App Server Browser Model Controller View DOM Traditional Web App JSON FAT HTML vs.
9. Case Study: Medici Builder Browser API Server JavaScript MVC Framework JavaScript MVC Framework EmberJS: JavaScript MVC Framework Ember Data: Client-Server Data Sync Library Ruby on Rails: Model-based API Generator JSON 175K SLOC 25K SLOC
10. Unifying Web and Mobile WEB TABLET API Server JSON JSON Database CDN
11. Unifying Web and Mobile WEB TABLET API Server JSON JSON Database CDN
12. Sync Gateway Unifying Web and Mobile WEB TABLET API Server JSON JSON Database CDN
13. Sync Gateway Unifying Web and Mobile WEB TABLET API Server JSON JSON Database Just Scale the APIs CDN
14. Distributing Data & Content Globally via an API Grid 2 Cloud Integration Back-end Systems
15. REST APIs are Everywhere (already) App Persistence REST APIs RDBMS CRM System In the Cloud REST APIs User Profiles On a Service Bus REST APIs Line-of-Business Applications SOAP APIs On a Sunset Plan
16. Couldn’t really do this: App Persistence REST APIs RDBMS CRM System In the Cloud REST APIs User Profiles On a Service Bus REST APIs Line-of-Business Applications SOAP APIs On a Sunset Plan » Latency » Security concerns » Not designed to handle load » API Inconsistencies
17. App Persistence REST APIs CRM System REST APIs User Profiles REST APIs Line-of-Business Applications SOAP APIs CS101: Add a layer of abstraction
18. API Grid App Persistence REST APIs CRM System REST APIs User Profiles REST APIs Line-of-Business Applications SOAP APIs SQL
19. API Grid in a Nutshell It’s like a CDN (Content Distribution Network). For JSON documents that public-facing APIs return. Reads & writes can originate from anywhere. It distributes your cached documents globally.
20. Private APIs Private APIs Private APIs Local View Public APIs Secaucus, NJ Data Center NEW YORK Global View JSON Response
21. NEW YORK SINGAPORE Global View
22. NEW YORK SINGAPORE Global View XDCR Cross Data Center Replication JSON Responses
23. NEW YORK Local View SINGAPORE Global View Local View JSON Responses AWS Asia Pacific (Singapore) Region Public APIs
24. NEW YORK Local View SINGAPORE Global View Local View JSON Responses AWS Asia Pacific (Singapore) Region Public APIs
25. NEW YORK Local View SINGAPORE Global View Local View JSON Responses AWS Asia Pacific (Singapore) Region Public APIs
26. NEW YORK Local View SINGAPORE Global View Local View JSON Responses AWS Asia Pacific (Singapore) Region Public APIs
27. Local View AWS Asia Pacific (Singapore) Region NEW YORK Local View SINGAPORE Global View JSON Responses Private APIs Private APIs Private APIs Local View Public APIs JSON Responses Public APIs Secaucus, NJ Data Center
28. Local View AWS Asia Pacific (Singapore) Region NEW YORK Local View SINGAPORE Global View JSON Responses Private APIs Private APIs Private APIs Local View Public APIs JSON Responses Public APIs Secaucus, NJ Data Center
29. Local View AWS Asia Pacific (Singapore) Region NEW YORK Local View SINGAPORE Global View JSON Responses Private APIs Private APIs Private APIs Local View Public APIs JSON Responses Public APIs Secaucus, NJ Data Center
30. Local View AWS Asia Pacific (Singapore) Region NEW YORK Local View SINGAPORE Global View JSON Responses Private APIs Private APIs Private APIs Local View Public APIs JSON Responses Public APIs Secaucus, NJ Data Center
31. Public API Facades & Private API Adapters Node.js, Connect middleware, with other npm modules Data Grid Middleware JSON Response Document Storage and Replication Couchbase Clusters with Cross-Data Center Replication Cloud US / Asia Point-of-Presences Amazon EC2 and EBS, orchestrated by Cloudify API Grid Architecture Sum m ary
32. Building Data Marts with NoSQL and NoETL 3 . Cloud Integration BI & Analytics
33. Traditional Data Warehouse & BI Data Sources Data Warehouse Data Marts Reports & Dashboards SQL SQL Raw Data Insights
34. Reports & Dashboards Data Sources Data Warehouse Data Marts “Big Data” Architecture (2013) SQL SQL Raw Data Insights
35. Reports & Dashboards Data Sources Data Warehouse Data Marts “Big Data” Architecture (2013) SQL SQL Raw Data Insights More Sources
36. Reports & Dashboards Data Sources Data Warehouse Data Marts “Big Data” Architecture (2013) SQL SQL Hadoop Cluster Raw Data Insights More Sources
37. Reports & Dashboards Data Sources Data Warehouse Data Marts “Big Data” Architecture (2013) SQL SQL Hadoop Cluster Aggregate Store Raw Data Insights More Sources
38. “Big Data” Architecture (2013) SQL SQL Raw Data Insights Data Sources Data Warehouse Data Marts Reports & Dashboards ETL ETL Hadoop Cluster Aggregate Store More Sources
39. SQL Some-sort-of query language ETL To extract, transform and load in steps We mean: So we can: Declaratively express the logic for the machine to calculate and process But: Processing complex, multi- layered queries upon request can be slow Store the results from the intermediate or final steps of our calculations Stored data gets out-of- sync with reality. And refresh is often expensive When we say:
40. SQL ETL
41. SQL ETL Logic
42. SQL ETL Logic Steps
43. SQL ETL Logic Steps Fresh Data
44. SQL ETL Logic Steps Fresh Data Fast Access
45. SQL ETL Logic Steps in Fresh Data Fast Access &
46. FRP Logic Steps in Fresh Data Fast Access &
47. FRP
48. Introducing Functional Reactive Programming FRP
49. Excel is FRP Functional Every cell is either is a value or a f(x) that generates a value
50. Excel is FRP Functional Reactive Every cell is either is a value or a f(x) that generates a value If you change one cell, all the other cells that refer to it changes immediately
51. Excel is FRP Functional Reactive Programming Every cell is either is a value or a f(x) that generates a value If you change one cell, all the other cells that refer to it changes immediately Yes, you are programming when you are create a model in an Excel spreadsheet
52. Start with a simple sum() Adding numbers within one worksheet Excel is FRP
53. Start with a simple sum() Add more tabs Adding numbers within one worksheet To reflect higher level aggregates Excel is FRP
54. Start with a simple sum() Add more tabs Draw fancy graphs Adding numbers within one worksheet To reflect higher level aggregates That visualizes the valuable aggregates Excel is FRP
55. What if... Cells inside Sheets Documents in JSON Data Model: Calculating: When you open the file Visualization: Supported chart types All the time in the cloud Anything drawable in HTML5 Instead of... We have... =SUM(A1:B10) function Sum() { ... } Language:
56. Ziggrid is FRP Stores values in JSON Inside a Couchbase cluster
57. f(x) f(x) f(x) Ziggrid is FRP Stores values in JSON Specifies f(x) in JSON Inside a Couchbase cluster Also builds a dependency graph
58. f(x) f(x) f(x) Ziggrid is FRP Stores values in JSON Specifies f(x) in JSON Inside a Couchbase cluster Also builds a dependency graph Push data out via JSON So clients can render data in HTML5, etc
59. Ziggrid is FRP Stores values in JSON Specifies f(x) in JSON Push data out via JSON Inside a Couchbase cluster Also builds a dependency graph So clients can render data in HTML5, etc f(x) f(x) f(x) “The Ziggurat”
60. Ziggrid is FRP Stores values in JSON Specifies f(x) in JSON Push data out via JSON Inside a Couchbase cluster Also builds a dependency graph So clients can render data in HTML5, etc f(x) f(x) f(x) “The Ziggurat” JS N
61. Layers of the Ziggurat Raw Events Enhanced Events Summaries Rankings Correlations Snapshots Composites Raw Data Insights
63. Action Collections EdSense: Real-time Recommendations Learning Style Engagement User Intents Recommendations Reaction Activity Log Achievements Efficacy Raw Data Insights
64. Action Collections EdSense: Real-time Recommendations Learning Style Engagement User Intents Recommendations Reaction Activity Log Achievements Efficacy Raw Data Insights
65. FRP Analytics Architecture HTML5 Data Tables and SVG Visualization Ember.js + D3.js via Zinc + JSONAPI Middleware Front-end Model Description, Calculation, and Event Chaining Java via Memcached Protocol Backend Raw and Aggregated Data Storage and Indexing Couchbase JSON Store + Incremental MapReduce (JavaScript) Sum m ary
66. FRP Analytics Architecture HTML5 Data Tables and SVG Visualization Ember.js + D3.js via Zinc + JSONAPI Middleware Front-end Model Description, Calculation, and Event Chaining Java via Memcached Protocol Backend Raw and Aggregated Data Storage and Indexing Couchbase JSON Store + Incremental MapReduce (JavaScript) Sum m ary Database Change Protocol
67. Completing the Loop with Reactive Data Applications 4 . BI & Analytics Front-End Applications
68. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x
69. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x Detailed BIG DATA
70. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x Insightful Detailed BIG DATA ANALYZED DATA
71. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x Insightful Detailed Fresh BIG DATA ANALYZED DATA INTERACTION DATA
72. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x Insightful Permanent Detailed Fresh BIG DATA OFFICIAL DATA ANALYZED DATA INTERACTION DATA
73. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x Insightful Permanent Detailed Fresh BIG DATA OFFICIAL DATA ANALYZED DATA INTERACTION DATA
74. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x Insightful Permanent Detailed Fresh BIG DATA OFFICIAL DATA INTERACTION DATA ANALYZED DATA
75. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x Insightful Permanent Detailed Fresh BIG DATA OFFICIAL DATA INTERACTION DATA ANALYZED DATA Complete REACTIVE DATA
76. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x Insightful Permanent Detailed Fresh BIG DATA OFFICIAL DATA INTERACTION DATA ANALYZED DATA Complete REACTIVE DATA
77. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x Insightful Permanent Detailed Fresh BIG DATA OFFICIAL DATA ANALYZED DATA Complete REACTIVE DATA INTERACTION DATA
78. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x JS N
79. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x d3.js EmberJS Zinc + JSON API JS N
80. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x node.js d3.js EmberJS Zinc + JSON API JS N Couchbase
81. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x node.js node.js d3.js EmberJS Zinc + JSON API JS N Couchbase npm Modules (Node Package Manager) Couchbase
82. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x node.js node.js d3.js EmberJS Zinc + JSON API Couchbase JS N Couchbase npm Modules (Node Package Manager) Couchbase Ziggrid
83. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x Couchbase JS N Couchbase Couchbase
84. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x Real-time Data Mart Global Data Grid Database of Record
85. Front-End Applications Back-End Systems BI & Analytics Cloud Integration x x x x Real-time Data Mart Global Data Grid Database of Record On Device Database
86. IsJavaScript the enterprise? ready for
87. Is JavaScript the enterprise ? ready for
88. Is JavaScript the enterprise ? ready for The whole internet is already there.
89. Thank you. Christopher Tse (@christse) Senior Director, MH Education Labs