Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

HTML5 for the Ruby Developer


Published on

Silicon Valley Ruby on Rails Meetup:
Speaker: Seth Ladd
Date: November 10, 2010

Published in: Technology
  • Be the first to comment

HTML5 for the Ruby Developer

  1. HTML5 for the Ruby Developer Seth Ladd Google Chrome DevRel
  2. Learn JavaScript
  3. Any Questions?
  4. No, really... Learn JavaScript
  5. The Modern Web App 1.Rich front end 1.Business logic 2.JSON REST API 3.Business logic 4.Data store
  6. Old 'n Busted Page oriented design Long page loads Online only Server only business logic Synchronous behavior Progressive enhancement
  7. New Hotness Action oriented design Insanely fast Offline JavaScript heavy front-end Asynchronous Graceful degradation
  8. Still Around Beautiful URLs REST JSON HTTP HTML5 Links Ruby and Rails!!!
  9. Audience Participation!
  11. Smart Browsers I found the future of the Internet, it's in my browser.
  12. HTML5one big happy family
  13. Storage and Files
  14. Semantics
  15. Multimedia
  16. CSS3http://slides.html5rocks. com/#slide40 Demo!
  17. Graphics and Effects Demo!
  18. Connectivity and Networking http://slides.html5rocks. com/#slide11 Demo!
  19. Device Access Demo!
  20. you betcha!
  21. don't start from scratch
  22. tested, so you don't have to
  23. pre-configured Rails 3 project using HTML5 Boilerplate
  24. HTML5 Boilerplate Cross browser (IE6!) Optimal caching and compression rules Mobile browser optimizations Hooked up to a test script Pre-set best practices Much, much more
  25. What would you have me do? Spend my time hacking around issues in older technologies like Internet Explorer 6 or would you like that time spent making the site look the best that it can on better desktop browsers, as well as on the iPhone, iPod Touch, iPad, Blackberry and a whole host of other mobile devices? - Andy Clarke
  26. Chrome Frame Plugin your escape hatch
  27. Activating Chrome Frame <meta http-equiv="X-UA-Compatible" content=" chrome=1"> ^-- (don't wrap in conditional comments) or, HTTP Header: X-UA-Compatible: chrome=1
  28. Target Smart Browsers gracefully degrade
  29. Rails 3 The Future is Here
  30. <!DOCTYPE html> You're doing it!
  31. <meta charset="utf-8"> Not present in template, Rails 3 sets Content-Type header.
  32. <%= video_tag "awesome.webm" %>
  33. <%= audio_tag "awesome.mp3" %>
  34. config.action_dispatch .best_standards_support = true Turns on Chrome Frame. It's the default!
  35. HTML5 Input Fields <%= f.number_field %> <%= f.email_field %> <%= f.telephone_field, , :required => true %> etc Search for "Rails 3, HTML 5 and client-side forms validations using Validator"
  36. easy App Cache
  37. Rails::Offline match "/application.manifest" => Rails::Offline CACHE MANIFEST javascripts/application.js javascripts/jquery.js images/masthead.png NETWORK: /
  38. Build the Best Possible Experience with HTML5 and target Smart Browsers
  39. Many Books
  40. Resources
  41. Gaze Into the Future