Creating Data Driven HTML5 Applications
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share

Creating Data Driven HTML5 Applications

  • 3,065 views
Uploaded on

Creating Data Driven HTML5 Applications session was delivered in DevConnections 2013

Creating Data Driven HTML5 Applications session was delivered in DevConnections 2013

More in: Technology , Design
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
3,065
On Slideshare
2,477
From Embeds
588
Number of Embeds
13

Actions

Shares
Downloads
28
Comments
0
Likes
0

Embeds 588

http://blogs.microsoft.co.il 470
http://cloud.feedly.com 47
http://feeds.feedburner.com 36
http://72.15.222.207 18
http://www.hanrss.com 5
http://silverreader.com 3
http://newsblur.com 2
http://www.newsblur.com 2
http://www.feedspot.com 1
http://reader.aol.com 1
http://digg.com 1
http://stage.blogs.microsoft.co.il 1
http://feedly.com 1

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Gil Fink Senior Architect SELA Creating Data- Driven HTML5 Applications
  • 2. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS AGENDA  HTML5: Recap  Storing Data in the Client-Side  Q&A  Summary
  • 3. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS HTML5: RECAP  HTML5 ~= HTML + CSS3 + JavaScript API  The future of the web  Still under development  Supposed to be ready at ~2014
  • 4. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS WHAT’S UNDER THE HTML5 UMBRELLA?
  • 5. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS STORING DATA IN THE CLIENT-SIDE
  • 6. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS DEMO Using HTML5 Storages and AppCache
  • 7. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS WEB STORAGE  Key/value storage  Simple API  sessionStorage  Data is accessible to any page from the same site opened in that window  localStorage  Data spans multiple windows and lasts beyond the current session
  • 8. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS APPCACHE  Create offline web applications  Use a manifest file to configure the cache  Introduces API to interact with cache events and the navigator.onLine property
  • 9. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS INDEXEDDB  Advanced key/value data management  Made of records holding simple values and hierarchical objects  Enables  Storage of large numbers of objects locally in the browser  Fast insertion and extraction from the store  Asynchronous/Synchronous API
  • 10. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS WEB APPLICATION APIS SUPPORT – WEB STORAGE http://caniuse.com
  • 11. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS WEB APPLICATION APIS SUPPORT – OFFLINE WEB APPLICATIONS http://caniuse.com
  • 12. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS WEB APPLICATION APIS SUPPORT – INDEXEDDB http://caniuse.com
  • 13. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS WHAT WE SAW  Web Storage  AppCache  IndexedDB  We didn’t cover other storage APIs such as  File API  FileSystem API
  • 14. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS QUESTIONS
  • 15. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS SUMMARY  You can start depending on client-side storages  Will help you:  To decrease the load on server-side and databases  To create offline web apps
  • 16. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS RESOURCES  Session slide deck and demos – http://sdrv.ms/1ekp929  API specs – http://www.w3.org/TR/webstorage/ http://www.w3.org/TR/IndexedDB/ http://dev.w3.org/html5/spec/offline.html  My Website – http://www.gilfink.net  Follow me on Twitter – @gilfink
  • 17. www.devconnections.com CREATING DATA-DRIVEN HTML5 APPLICATIONS THANK YOU Gil Fink Senior Architect gilf@sela.co.il @gilfink http://www.gilfink.net