Loading presentation...

Present Remotely

Send the link below via email or IM

Copy

Present to your audience

Start remote presentation

  • Invited audience members will follow you as you navigate and present
  • People invited to a presentation do not need a Prezi account
  • This link expires 10 minutes after you close the presentation
  • A maximum of 30 users can follow your presentation
  • Learn more about this feature in our knowledge base article

Do you really want to delete this prezi?

Neither you, nor the coeditors you shared it with will be able to recover it again.

DeleteCancel

Make your likes visible on Facebook?

Connect your Facebook account to Prezi and let your likes appear on your timeline.
You can change this under Settings & Account at any time.

No, thanks

Copy of JavaScript, OData, JayData

See how web services is the past and the successor is JavaScript/JSON
by

Peter Zentai

on 2 May 2013

Comments (0)

Please log in to add your comment.

Report abuse

Transcript of Copy of JavaScript, OData, JayData

Our story will be centered around OData, JavaScript and JayData and how these could serve as the bases of most hybrid/HTML5/Line of business mobile applications.

At the end of the day we boldly will state and with examples prove that OData could revolutionize the AJAX paradigm, and be the ultimate successor for proprietary AJAX APIs. WCF Data Services JaySvcUtil.exe - static context
JaySvcUtil.js - dynamic context
////////////////////////////////////////////////////////////////////////////////////////
////// Autogenerated by JaySvcUtil.exe http://JayData.org for more info /////////
////// oData v2 /////////
////////////////////////////////////////////////////////////////////////////////////////

(function(global, $data, undefined) {




function registerEdmTypes() {

function Edm_Boolean() { };
$data.Container.registerType('Edm.Boolean', Edm_Boolean);
$data.Container.mapType(Edm_Boolean, $data.Boolean);

function Edm_Binary() { };
$data.Container.registerType('Edm.Binary', Edm_Binary);
$data.Container.mapType(Edm_Binary, $data.Blob);

function Edm_DateTime() { };
$data.Container.registerType('Edm.DateTime', Edm_DateTime);
$data.Container.mapType(Edm_DateTime, $data.Date);

function Edm_DateTimeOffset() { };
$data.Container.registerType('Edm.DateTimeOffset', Edm_DateTimeOffset);
$data.Container.mapType(Edm_DateTimeOffset, $data.Integer);

function Edm_Time() { };
$data.Container.registerType('Edm.Time', Edm_Time);
$data.Container.mapType(Edm_Time, $data.Integer);

function Edm_Decimal() { };
$data.Container.registerType('Edm.Decimal', Edm_Decimal);
$data.Container.mapType(Edm_Decimal, $data.Number);

function Edm_Single() { };
$data.Container.registerType('Edm.Single', Edm_Single);
$data.Container.mapType(Edm_Single, $data.Number);

function Edm_Double() { };
$data.Container.registerType('Edm.Double', Edm_Double);
$data.Container.mapType(Edm_Double, $data.Number);

function Edm_Guid() { };
$data.Container.registerType('Edm.Guid', Edm_Guid);
$data.Container.mapType(Edm_Guid, $data.String);

function Edm_Int16() { };
$data.Container.registerType('Edm.Int16', Edm_Int16);
$data.Container.mapType(Edm_Int16, $data.Integer);

function Edm_Int32() { };
$data.Container.registerType('Edm.Int32', Edm_Int32);
$data.Container.mapType(Edm_Int32, $data.Integer);

function Edm_Int64() { };
$data.Container.registerType('Edm.Int64', Edm_Int64);
$data.Container.mapType(Edm_Int64, $data.Integer);

function Edm_Byte() { };
$data.Container.registerType('Edm.Byte', Edm_Byte);
$data.Container.mapType(Edm_Byte, $data.Integer);

function Edm_String() { };
$data.Container.registerType('Edm.String', Edm_String);
$data.Container.mapType(Edm_String, $data.String);

};
registerEdmTypes();
$data.Entity.extend('NorthwindModel.Category', {
'Category_ID': { key:true,type:'Edm.Int32',nullable:false,computed:true },
'Category_Name': { type:'Edm.String',nullable:false,required:true,maxLength:15 },
'Description': { type:'Edm.String',nullable:true,maxLength:Number.POSITIVE_INFINITY },
'Picture': { type:'Edm.Binary',nullable:true,maxLength:Number.POSITIVE_INFINITY },
'Products': { type:'Array',elementType:'NorthwindModel.Product',inverseProperty:'Category' }
});
$data.Entity.extend('NorthwindModel.Customer', {
'Customer_ID': { key:true,type:'Edm.String',nullable:false,required:true,maxLength:5 },
'Company_Name': { type:'Edm.String',nullable:false,required:true,maxLength:40 },
'Contact_Name': { type:'Edm.String',nullable:true,maxLength:30 },
'Contact_Title': { type:'Edm.String',nullable:true,maxLength:30 },
'Address': { type:'Edm.String',nullable:true,maxLength:60 },
'City': { type:'Edm.String',nullable:true,maxLength:15 },
'Region': { type:'Edm.String',nullable:true,maxLength:15 },
'Postal_Code': { type:'Edm.String',nullable:true,maxLength:10 },
'Country': { type:'Edm.String',nullable:true,maxLength:15 },
'Phone': { type:'Edm.String',nullable:true,maxLength:24 },
'Fax': { type:'Edm.String',nullable:true,maxLength:24 },
'Orders': { type:'Array',elementType:'NorthwindModel.Order',inverseProperty:'Customer' }
});
$data.Entity.extend('NorthwindModel.Employee', {
'Employee_ID': { key:true,type:'Edm.Int32',nullable:false,computed:true },
'Last_Name': { type:'Edm.String',nullable:false,required:true,maxLength:20 },
'First_Name': { type:'Edm.String',nullable:false,required:true,maxLength:10 },
'Title': { type:'Edm.String',nullable:true,maxLength:30 },
'Birth_Date': { type:'Edm.DateTime',nullable:true },
'Hire_Date': { type:'Edm.DateTime',nullable:true },
'Address': { type:'Edm.String',nullable:true,maxLength:60 },
'City': { type:'Edm.String',nullable:true,maxLength:15 },
'Region': { type:'Edm.String',nullable:true,maxLength:15 },
'Postal_Code': { type:'Edm.String',nullable:true,maxLength:10 },
'Country': { type:'Edm.String',nullable:true,maxLength:15 },
'Home_Phone': { type:'Edm.String',nullable:true,maxLength:24 },
'Extension': { type:'Edm.String',nullable:true,maxLength:4 },
'Photo': { type:'Edm.Binary',nullable:true,maxLength:Number.POSITIVE_INFINITY },
'Notes': { type:'Edm.String',nullable:true,maxLength:Number.POSITIVE_INFINITY },
'Reports_To': { type:'Edm.Int32',nullable:true },
'Orders': { type:'Array',elementType:'NorthwindModel.Order',inverseProperty:'Employee' }
});
$data.Entity.extend('NorthwindModel.Order_Detail', {
'Order_ID': { key:true,type:'Edm.Int32',nullable:false,required:true },
'Product_ID': { key:true,type:'Edm.Int32',nullable:false,required:true },
'Unit_Price': { type:'Edm.Decimal',nullable:false,required:true },
'Quantity': { type:'Edm.Int16',nullable:false,required:true },
'Discount': { type:'Edm.Single',nullable:false,required:true },
'Product': { type:'NorthwindModel.Product',required:true,inverseProperty:'Order_Details' },
'Order': { type:'NorthwindModel.Order',required:true,inverseProperty:'Order_Details' }
});
$data.Entity.extend('NorthwindModel.Order', {
'Order_ID': { key:true,type:'Edm.Int32',nullable:false,required:true },
'Customer_ID': { type:'Edm.String',nullable:false,required:true,maxLength:5 },
'Employee_ID': { type:'Edm.Int32',nullable:true },
'Ship_Name': { type:'Edm.String',nullable:true,maxLength:40 },
'Ship_Address': { type:'Edm.String',nullable:true,maxLength:60 },
'Ship_City': { type:'Edm.String',nullable:true,maxLength:15 },
'Ship_Region': { type:'Edm.String',nullable:true,maxLength:15 },
'Ship_Postal_Code': { type:'Edm.String',nullable:true,maxLength:10 },
'Ship_Country': { type:'Edm.String',nullable:true,maxLength:15 },
'Ship_Via': { type:'Edm.Int32',nullable:true },
'Order_Date': { type:'Edm.DateTime',nullable:true },
'Required_Date': { type:'Edm.DateTime',nullable:true },
'Shipped_Date': { type:'Edm.DateTime',nullable:true },
'Freight': { type:'Edm.Decimal',nullable:true },
'Customer': { type:'NorthwindModel.Customer',required:true,inverseProperty:'Orders' },
'Employee': { type:'NorthwindModel.Employee',inverseProperty:'Orders' },
'Order_Details': { type:'Array',elementType:'NorthwindModel.Order_Detail',inverseProperty:'Order' },
'Shipper': { type:'NorthwindModel.Shipper',inverseProperty:'Orders' }
});
$data.Entity.extend('NorthwindModel.Product', {
'Product_ID': { key:true,type:'Edm.Int32',nullable:false,computed:true },
'Supplier_ID': { type:'Edm.Int32',nullable:true },
'Category_ID': { type:'Edm.Int32',nullable:true },
'Product_Name': { type:'Edm.String',nullable:false,required:true,maxLength:40 },
'English_Name': { type:'Edm.String',nullable:true,maxLength:40 },
'Quantity_Per_Unit': { type:'Edm.String',nullable:true,maxLength:20 },
'Unit_Price': { type:'Edm.Decimal',nullable:true },
'Units_In_Stock': { type:'Edm.Int16',nullable:true },
'Units_On_Order': { type:'Edm.Int16',nullable:true },
'Reorder_Level': { type:'Edm.Int16',nullable:true },
'Discontinued': { type:'Edm.Boolean',nullable:false,required:true },
'Category': { type:'NorthwindModel.Category',inverseProperty:'Products' },
'Order_Details': { type:'Array',elementType:'NorthwindModel.Order_Detail',inverseProperty:'Product' },
'Supplier': { type:'NorthwindModel.Supplier',inverseProperty:'Products' }
});
$data.Entity.extend('NorthwindModel.Shipper', {
'Shipper_ID': { key:true,type:'Edm.Int32',nullable:false,computed:true },
'Company_Name': { type:'Edm.String',nullable:false,required:true,maxLength:40 },
'Orders': { type:'Array',elementType:'NorthwindModel.Order',inverseProperty:'Shipper' }
});
$data.Entity.extend('NorthwindModel.Supplier', {
'Supplier_ID': { key:true,type:'Edm.Int32',nullable:false,computed:true },
'Company_Name': { type:'Edm.String',nullable:false,required:true,maxLength:40 },
'Contact_Name': { type:'Edm.String',nullable:true,maxLength:30 },
'Contact_Title': { type:'Edm.String',nullable:true,maxLength:30 },
'Address': { type:'Edm.String',nullable:true,maxLength:60 },
'City': { type:'Edm.String',nullable:true,maxLength:15 },
'Region': { type:'Edm.String',nullable:true,maxLength:15 },
'Postal_Code': { type:'Edm.String',nullable:true,maxLength:10 },
'Country': { type:'Edm.String',nullable:true,maxLength:15 },
'Phone': { type:'Edm.String',nullable:true,maxLength:24 },
'Fax': { type:'Edm.String',nullable:true,maxLength:24 },
'Products': { type:'Array',elementType:'NorthwindModel.Product',inverseProperty:'Supplier' }
});
$data.EntityContext.extend('NorthWind.NorthwindEntities', {
Categories: { type: $data.EntitySet, elementType: NorthwindModel.Category },
Customers: { type: $data.EntitySet, elementType: NorthwindModel.Customer },
Employees: { type: $data.EntitySet, elementType: NorthwindModel.Employee },
Order_Details: { type: $data.EntitySet, elementType: NorthwindModel.Order_Detail },
Orders: { type: $data.EntitySet, elementType: NorthwindModel.Order },
Products: { type: $data.EntitySet, elementType: NorthwindModel.Product },
Shippers: { type: $data.EntitySet, elementType: NorthwindModel.Shipper },
Suppliers: { type: $data.EntitySet, elementType: NorthwindModel.Supplier }
});

NorthWind.context = new NorthWind.NorthwindEntities( { name:'oData', oDataServiceHost: 'http://localhost:50538/Knockoutjs/Northwind.svc' });


})(window, $data); C# Classes SQL Azure
Entities, EntitySets, EntityContexts, Linq Queries and WebMethods SQL Server Oracle (?) Entity Framework ASP.NET Web API SharePoint Lists LightSwitch 2012 OData Endpoint JSLQ JavaScript Classes JayData
JavaScript Client
Environment
Entities, EntitySets, EntityContexts, Metadata, Queries ServiceFunctions Downloads metadata
generates JavaScript files JavaScript Crud UI Library Connectors OData client in
the browser/mobile The JavaScript revolution HTML5/Hybrid Mobile Application YQL Facebook MongoDB JavaScript OData consumer on client-side OData provide server-side OData consumer on server-side (Node.js) Different
perspectives of JavaScript Without any manual $.ajax and JSON.parse What is JayData Very similar to EntityFrame and a bit of Data Services just everything is in JavaScript
Destined for all tiers and all devices
Abstraction layer over data sources and protocols
Discoverable metadata (automated UI scenarios, validation)
"Client first" approach
The notion of entities and expressions
Rich set of storage/data providers So what is wrong with JavaScript then? Required tools and concepts are still missing
AJAX
Influencers are not enterprise developers Client-side technology running in browsers
Rarely used (HTML webpages)
Less then 1% of developers use it Dev env support 92% of top 10.000 websites uses JavaScript
JavaScript = front-end technology
Node.js was created JavaScript Language Query - Kill AJAX step #1 Query arbitrary data sources with one and only one query syntax: JavaScript
Avoid manually parsing the result (dynamic binders)
Provide projection/shaping support
Provide an environment that is familiar for C# developers Late XX century 2012 2009 All cloud providers offer Node.js service
25% of DEV jobs require JavaScript skills (UK)
This was 7.5% in 2004
http://www.itjobswatch.co.uk
Cross-platform mobile development technology
PhoneGap, Sencha, etc.
Desktop app development platform: Windows 8
High performance server applications JavaScript developers (%) 30 OData client in the
Middle Tier (mashups)
NodeJS The life cycle of the predicates functions: The OData, the JayData and the JavaScript This you will find hundreds of times within the same applications
Everyone likes to do this, but why??
Total spaghetti (query syntax, protocol handling, serialization, usage maybe within an onclick even handler)
Data has no metadata never 1) filter predicate in JS function 2) AST nodes created with JSLint 3) Model agnostic JavaScript code expressions 4) Domain specific Entity expressions 5) Several totally different final product: SQL query string, OData $filter + xhr requests or in memory function invokations context.persons
.filter( function(p) { return p.Age > 42 && p.Gender == 'Male'})
.orderBy(function(p) { return p.FirstName; })
.map(function (p) { return { Name: p.FirstName + ' ' + p.LastName })
.forEach() "value": "(begin)",
"first": [
{
"value": "function",
"arity": "statement",
"first": [
{
"value": "article"
}
],
"block": [
{
"value": "return",
"arity": "statement",
"first": {
"value": "==",
"arity": "infix",
"first": {
"value": ".",
"arity": "infix",
"first": {
"value": "article"
},
"second": {
"value": "Title"
}
},
"second": {
"value": ".",
"arity": "infix",
"first": {
"value": "this"
},
"second": {
"value": "name"
}
}
}
}
]
}
]
}" {

"expressionType": "FunctionExpression",
"nodeType": "Function",
"parameters": [
{
"type": "unknown",
"name": "article"
"nodeType": "lambdaParameter",
}
],
"body": {
"expressionType": "SimpleBinaryExpression",
"nodeType": "equal",
"type": "boolean",
"left": {
"expressionType": "PropertyExpression",
"nodeType": "memberAccess",
"expression": {
"expressionType": "ParameterExpression",
"nodeType": "lambdaParameterReference",
"type": "unknown",
"name": "article",
"paramIndex": 0
},
"member": {
"expressionType": "ConstantExpression",
"nodeType": "constant",
"type": "string",
"value": "Title"
}
},
"right": {
"expressionType": "PropertyExpression",
"nodeType": "memberAccess",
"expression": {
"expressionType": "ThisExpression",
"nodeType": "this"
},
"member": {
"expressionType": "ConstantExpression",
"nodeType": "constant",
"type": "string",
"value": "name"
}
},
"operator": "=="
}
}" {
"expressionType": "SimpleBinaryExpression",
"nodeType": "equal",
"type": "boolean",
"left": {
"expressionType": EntityFieldExpression
"nodeType": entityField",
"expression": {
"expressionType": "EntityExpression",
"nodeType": "Entity",
"type": "unknown",
"name": "article"
},
"member": {
"expressionType": "ConstantExpression",
"nodeType": "constant",
"type": "string",
"value": "Title"
}
},
"right": {
"expressionType": "QueryParameterExpression",
"nodeType": "constant",
"type": "string",
"value": "TomHunks"
}
},
"operator": "=="
}
}" KnockoutJS
Sencha Touch
Backbone
... JayData & SAP Netweaver Gateway (OData) JavaScript service class
- createPerson
- getPersonsByAge OData Endpoint OData Client JavaScript client class
- createPerson
- getPersonsByAge Client Application Server Application WebSQL/sqLite JavaScript application services hosted in the cloud on EC2 centered around OData as primary API
Launch in 09/12
Targets JavaScript only skills
The customer (developer) can deploy his JavaScript Services based solution pubishing his API with OData
LightSwitch like onscreen data management: the customer builds his schema and the OData endpoint is automatically provisioned JavaScript API Services
(similar to WebAPI) Dreams Your feedback Visibility Cooperation VS2012 Upshot Azure Win 8 Metro First impression Who to contact? Have you tried it? Blogs Evangelism OData projects JayData Entity Contex OData Endpoint OData Client Client Application Server Application JavaScript Data Services
(similar to ASPNET Data Services) Possible future of JayStack project Persons
Products
Etc... JayData Entity Contex Persons
Products
Etc... JayStack Product milestones Concept drafted
Pitch presented 08/2011 Funds raised
JayStack founded 02/2012 OData provider
IndexedDB provider WebSQL/SQLite Provider
YQL, FBQL Provider 03/2012 JayData prototye ready 04/2012 05/2012 JayData available
1st May 2012 JayStorm available
Sept 2012 Amazon EC2 vs Azure evals 06/2012 JayData highlights - general A cool JavaScript library to work with typed local and remote data and operations
Eliminates protocol level approach and provides a protocol and data source agnostic experience
Multiple providers
Works in (almost) every device and in every tier
Same semantic on the client and the server
Leverages OData/datajs 2014 ? JayData client hightlights Provides an OData client environment familiar to C# developers
Geared to work in multiple dev envs (datajs patched)
Supports a number of UI libraries
Provider fallback chain
Sync API* JayData server highlights Provides an OData client environment familiar to C# developers
Geared to work in multiple dev envs (datajs patched)
Supports a number of UI libraries
Provider fallback chain
Sync API* NodeJS is V8 JS engine connected to computer IO
Agile and productive
Event driven
Database drivers
Supports 10K request / sec on an ordinary processor
Creating a simple REST service is a matter of minutes
COOL Improved VS11
IntelliSense Samsung SmartTV
POC 07/2012 08/2012 09/2012 10/2012 11/2012 12/2012 Node.JS
support Knockout.js
support Sencha Touch
support Titanium
support JayService
opensource JayStudio available
Nov 2012 SharePoint
2010/2013 POC SAP Gateway
POC JayData Enterprice
license OData v3 Win8
POC Cloud build
for Jay apps Roadshows VS2012
templates I have to say it is quite an elegant solution  David Sheardown bit.ly/MZg6Xa „ JayData is also an interesting newcomer to the scene Mark Stafford bit.ly/OHXk5x „ JayData is something that’s better than sliced bread. Luckily it’s already invented Rainer Wittmann bit.ly/QFHdIu „ „ JayData Makes Web Phenomenal !
Its amazing .. RIA services but on ASP.NET using auto generated JS context Mohammad Najeeb Aljaber bit.ly/Phvjxy „ JayData sounds really interesting, and the JSLQ syntax looks really good – a query language that's easy to read is very important Jens Arps „ Bart Wullems bit.ly/Msvs6C „ Last week, I wanted to call an oData service from my HTML5 metro app. First I was planning to use datajs until I discovered JayData which offers similar functionality to datajs and much more! ... OData & Jaydata
kill AJAX :) „ „ „ „ „ „ „ The DEV team in heads (11) 2 Architects
4 JavaScript developers
2 Portal developers
1 Designer/Portal builder
2 blogs, forum, support, community managers Dynamic filtering with Knockout Win8 Metro app in JavaScript AJAX Spaghetti SharePoint 2010/2013 browser HTML5 app var person = new Demo.Person( { firstName = "Peter" });
var order = new Demo.Order( { amount: 100, product: 10});
person.orders.add(order);
Demo.context.people.add(person);
Demo.context.saveChanges( function() {
alert("New person " + person.ID + " created");
alert("New order " + order.ID + " created");
}); http://jaydata.org/blog/javascript-language-query-jslq-101 Rich Client Experience Multiple providers VS2012 Cordova/XCode Titanium JavaScript CRUD - Kill AJAX #2 Knockout template JayData code Our goal: Two-way data bindig Mobile Client Browser Client NodeJS client NodeJS service NodeJS service MongoDB Netflix OData OData OData JayData Introduction JayStack Technologies creates tools for JavaScript developers
Founded in 02/2012 with $0.5m
this covers 12 months of operation
JayData 1.0 release 05/2012
5 releases since
Commercial launch in 09/2012 Metro apps Sharepoint WebStorm OK, we can consume OData.
But it is as much fun if not more providing it!
Full transcript