fizzbuzz_client.rb

# coupled
(1..100).each do |i|
  answer = HTTP.get("/v1/fizzbuzz?number=#{i}")
  puts answer
end

# decoupled
root = HTTP.get_root
answer = root.link('first').follow
puts answer
while answer.link('next').present?
  answer = answer.link('next').follow
  puts answer
end

microdata_bob.html

<div> 
  My name is Bob Smith 
  but people call me Smithy. 
  Here is my home page:
  <a href="http://www.example.com">www.example.com</a>
  I live in Albuquerque, NM and work as an engineer
  at ACME Corp.
</div>

<div itemscope itemtype="http://schema.org/Person"> 
  My name is <span itemprop="name">Bob Smith</span> 
  but people call me <span itemprop="nickname">Smithy</span>. 
  Here is my home page:
  <a href="http://www.example.com" itemprop="url">www.example.com</a>
  I live in Albuquerque, NM and
  work as an <span itemprop="title">engineer</span>
  at <span itemprop="affiliation">ACME Corp</span>.
</div>

microdata_dom_api_sample.js

var user = document.getItems('http://schema.org/Person')[0];
var name = user.properties['name'][0].itemValue;
alert('Hello ' + name + '!');

notes_index.html.haml

%div{itemscope: true, itemtype: 'http://schema.org/ItemList',
 itemid: notes_url, data: {main_item: true}}
  - @notes.each do |note|
    = link_to note.text.truncate(20), note,

              rel: 'item', itemprop: 'hasPart'
  = form_for Note.new do |f|
    = f.text_field :text
    = f.submit rel: 'create'

notes_index.json

{
  "uber": {
    "version": "1.0",
    "data": [{
      "url": "http://www.example.com/notes",
      "name": "Collection",
      "data": [
        { "name": "hasPart", "rel": "item", "url": "/notes/1" },
        { "name": "hasPart", "rel": "item", "url": "/notes/2" },

        { "rel": "create", "url": "/notes", "action": "append",
          "model": "note%5Btext%5D={text}" },
        { "rel": "profile", "url": "/assets/note.alps"}
      ]
    }]
  }
}

notes_show.html.haml

%div{itemscope: true, itemtype: 'http://schema.org/Article',
 itemid: note_url(@note), data: {main_item: true}}
  %span{itemprop: 'articleBody'}= @note.text
  %span{itemprop: 'datePublished'}= @note.published_at
  %span{itemprop: 'dateCreated'}= @note.created_at
  %span{itemprop: 'dateModified'}= @note.updated_at
  = form_for @note, method: :put do |f|
    = f.text_field :text
    = f.submit rel: 'update'
  = button_to 'Destroy', @note, method: :delete, rel: 'delete'
  = button_to 'Publish', publish_note_path(@note), rel: 'publish' unless @note.published?
  = link_to 'Next note', note_path(@note.next), rel: 'next' if @note.next
  = link_to 'Prev note', note_path(@note.prev), rel: 'prev' if @note.prev
  = link_to 'Collection of Note', notes_path, rel: 'collection', itemprop: 'isPartOf'

notes_show.json

{
  "uber": {
    "version": "1.0",
    "data": [{
      "url": "http://www.example.com/notes/1",
      "name": "Article",
      "data": [
        { "name": "articleBody", "value": "First note's text" },
        { "name": "datePublished", "value": null },
        { "name": "dateCreated", "value": "2014-09-11T12:00:31+09:00" },
        { "name": "dateModified", "value": "2014-09-11T12:00:31+09:00" },
        { "name": "isPartOf", "rel": "collection", "url": "/notes" },
        { "rel": "update", "url": "/notes/1", "action": "replace",
          "model": "note%5Btext%5D={text}" },
        { "rel": "delete", "url": "/notes/1", "action": "remove" },
        { "rel": "publish", "url": "/notes/1/publish", "action": "append" },
        { "rel": "next", "url": "/notes/2" },
        { "rel": "profile", "url": "/assets/note.alps" }
      ]
    }]
  }
}

people_controller.rb

class PeopleController < ApplicationController
  before_action :set_message, only: %i(show edit update destroy)
  include Hypermicrodata::Rails::HtmlBasedJsonRenderer
  ...
end

people_index.html.haml

.person{itemscope: true, itemtype: 'http://schema.org/Person',
        itemid: person_url(@person), data: {main_item: true}}
  .media
    .media-image.pull-left
      = image_tag @person.picture_path, alt: '', itemprop: 'image'
    .media-body
      %h1.media-heading
        %span{itemprop: 'name'}= @person.name
  = link_to 'collection', people_path, rel: 'collection'

people_index.json

{
  "image": "/assets/bob.png",
  "name": "Bob Smith",
  "isPartOf": "/people",
  "_links": {
    "self": { "href": "http://www.example.com/people/1" },
    "type": { "href": "http://schema.org/Person" },
    "collection": { "href": "/people" },
    "profile": { "href": "/assets/person.alps" }
  }
}