Building Ext JS Using HATEOAS - Jeff Stano

127 views

Published on

Newer REST-based APIs are starting to use HATEOAS, which stands for Hypermedia as the Engine of Application State. The central idea of HATEOAS is to allow the server to control the state transitions instead of hard coding all the links into the client. We've integrated a HATEOAS layer in the Ext JS framework based on the HAL standard (http://stateless.co/hal_specification.html) and into the Ext JS model and store system. We will be showing the techniques we used to accomplish this in a way that keeps the Ext JS model and store usage the same as the standard mechanism.

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
127
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Building Ext JS Using HATEOAS - Jeff Stano

  1. 1. Using HATEOAS with ExtJS Jeff Stano Chief Software Architect at UniFocus
  2. 2. What is HATEOAS • Representational State Transfer (REST) - Was defined by Roy Fielding in 2000 - Is the foundation of the modern WEB • REST constraints - Resources must have identifiers - Manipulation of resource through representations - Resources are self describing - Hypermedia as the engine of application state (HATEOAS) 2
  3. 3. What is HATEOAS continued • The application is modeled as an engine that moves from one state to another by picking state transformations in the current set of representations • State: the current representation of a resource • Transitions: instructions on how to move a resource from on state to another 3
  4. 4. Why HATEOAS Reduce coupling between client and server • Client discovers the URLs of the available state transitions • Client does not need to know how resources are identified • Client only need to know the root URL • Server can change the URL layout without impacting the client • Server can control which state transitions are available to the client 4
  5. 5. HATEOAS Media Types
  6. 6. HATEOAS Media Types • HAL - http://stateless.co/hal_specification.html • Siren - https://github.com/kevinswiber/siren • Collection+JSON - http://amundsen.com/media-types/collection/ 6
  7. 7. Why HAL • Widely adopted • Has good support in server side technologies for generating the JSON • Simple format that is easily generated and consumed 7
  8. 8. The HAL Media Type • http://stateless.co/hal_specification.html • application/hal+json • Resources - State: the data - Links: available state transitions - Embedded resources: • Links - Relation (rel): the name of the link - Target (href): the URL of the link 8
  9. 9. Sample HAL Document { "name": "Isaac Asimov” "_links": { "self": { "href": "/" }, "books:books": { "href": "/books/asimov" }, "curies": [ { "name": "books", "href": "http://rels.test.com/books/{rel}", "templated": true } ] }, {"_embedded": { "books:books": [ { "title": "Foundation", "_links": { "self": { "href": "/books/foundation" } } } ] } }
  10. 10. ExtJS and HAL
  11. 11. How does ExtJS handle REST • ExtJS builds URLs on the client and assumes the server can handle what it generates • This is not ideal since the client is essentially forcing its will on the server • Client hard codes URLs and must determine state transitions through other means • It’s not handling the Hypermedia portion of REST 11
  12. 12. Extending ExtJS to use HAL • Need to extend Ext.data.Model - Add methods that support the HAL meta-data - Override the load and save methods - Override the id handling so the id is set to the self URL • Need to extend the Ext.data.reader.Json class • Need to extend the Ext.data.proxy.Rest class 12
  13. 13. Live Coding Examples
  14. 14. Sencha Hal Package - https://github.com/jstano/sencha-hal 14
  15. 15. References
  16. 16. Websites • https://en.wikipedia.org/wiki/HATEOAS • https://en.wikipedia.org/wiki/Representational_state_transfer • http://roy.gbiv.com/untangled/2008/rest-apis-must-be-hypertext-driven • http://martinfowler.com/articles/richardsonMaturityModel.html • https://www.infoq.com/articles/webber-rest-workflow • http://stateless.co/hal_specification.html 16

×