$30 off During Our Annual Pro Sale. View Details »

WCMKE2014

 WCMKE2014

"The WordPress JSON REST API", co-presented at WCMKE2014 by @rachelbaker and @rmccue.

Ryan McCue

July 26, 2014
Tweet

More Decks by Ryan McCue

Other Decks in Programming

Transcript

  1. The WordPress

    JSON REST API
    Rachel Baker
    @rachelbaker
    WC Milwaukee 2014
    Ryan McCue
    @rmccue

    View Slide

  2. wp-api.org

    View Slide

  3. Meet the Team

    View Slide

  4. What is the REST API?

    View Slide

  5. Three Parts:

    “JSON REST API”

    View Slide

  6. JSON
    {
    "ID": 4,
    "title": "My Awesome Post",
    "content": "This is my awesome content!"
    }
    JavaScript Object Notation
    • Supported by basically everything
    • Human readable
    • Standard

    View Slide

  7. REST
    Actions applied to Resources
    Create POST
    Read GET
    Update PUT
    Delete DELETE
    Uses HTTP actions:
    Representational State Transfer

    View Slide

  8. REST
    Representational State Transfer
    /posts
    /posts/4
    /posts
    /posts/4
    /posts/4
    GET
    GET
    POST
    PUT
    DELETE
    Action

    (Verb)
    Resource

    (Object)

    View Slide

  9. API
    Application Programming Interface
    A way to access and manipulate your data

    View Slide

  10. API
    Or extend as needed!
    GET POST PUT DELETE
    Posts ✔ ✔ ✔ ✔
    Pages ✔ ✔ ✔ ✔
    Custom Post Types ✔ ✔ ✔ ✔
    Post Meta ✔ ✔ ✔ ✔
    Media ✔ ✔ ✔ ✔
    Comments ✔ ✔
    Taxonomies/Terms ✔ ✔ ✔ ✔
    Users ✔ ✔ ✔ ✔

    View Slide

  11. Why do we need it?

    View Slide

  12. XML-RPC
    Hugely complicated:
    (WordPress for iPhone Trac)

    View Slide

  13. Jetpack API
    Easy for developers
    Works with Javascript easily (JSON-based)

    Requires Jetpack active
    Depends on WordPress.com
    Does not work for local development
    Cannot control access to certain apps

    View Slide

  14. How do we use it?

    View Slide

  15. {
    "name": "WP API Dev",
    "description": "Just another WordPress site",
    "URL": "http://local.wpapi.dev",
    "routes": {},
    "authentication": [],
    "meta": {}
    }
    /wp-json/
    GET

    View Slide

  16. [{
    "ID": 110,
    "title": "Testing sticky",
    "status": "publish",
    "type": "post",
    "author": {},
    "content": "this should be stuck as a post. Stuck on you.\n",
    "link": "http://local.wpapi.dev/testing-sticky/",
    "date": "2014-06-02T10:47:39-05:00",
    "modified": "2014-06-02T10:47:39-05:00",
    "format": "standard",
    "slug": "testing-sticky-2",
    "guid": "http://local.wpapi.dev/testing-sticky-2/",
    "excerpt": "this should be stuck as a post. Stuck on you.\n”,
    "comment_status": "open",
    "sticky": true,
    "meta": {},
    "featured_image": null,
    "terms": {}
    }]
    /wp-json/posts
    GET

    View Slide

  17. [{
    "name": "Categories",
    "slug": "category",
    "labels": {},
    "types": {},
    "show_cloud": true,
    "hierarchical": true,
    "meta": {}
    },{
    "name": "Tags",
    "slug": "post_tag",
    "labels": {},
    "types": {},
    "show_cloud": true,
    "hierarchical": false,
    "meta": {}
    },]
    /wp-json/taxonomies
    GET

    View Slide

  18. [{
    "ID": 121,
    "title": "puppies",
    "type": "attachment",
    "author": {},
    "content": "src=\"http://local.wpapi.dev/wp-content/uploads/2014/07/
    puppies-300x225.jpeg\" class=\"attachment-medium\" alt=\"puppies\" />
    a>\n",
    "link": "http://local.wpapi.dev/?attachment_id=121",
    "date": "2014-07-25T17:07:02-05:00",
    "modified": "2014-07-25T17:07:02-05:00",
    "slug": "puppies",
    "guid": "http://local.wpapi.dev/wp-content/uploads/2014/07/puppies.jpeg",
    "meta": {},
    "terms": [],
    "attachment_meta": {
    "width": 1600,
    "height": 1200,
    "file": "2014/07/puppies.jpeg",
    "sizes": {},
    "image_meta": {}
    }]
    /wp-json/media
    GET

    View Slide

  19. {
    "ID": 1,
    "title": "Hello World!",
    "status": "publish",
    "type": "post",
    "author": {},
    "content": "Welcome to WordPress. This is your first post. Edit
    or delete it, then start blogging!\n",
    "link": "http://local.wpapi.dev/hello-world/",
    "date": "2014-04-18T15:14:46-05:00",
    "modified": "2014-05-02T01:26:30-05:00",
    "format": "standard",
    "slug": "hello-world",
    "guid": "http://local.wpapi.dev/?p=1",
    "excerpt": "Welcome to WordPress. This is your first post. Edit
    or delete it, then start blogging!\n",
    "comment_status": "open",
    "meta": {},
    "featured_image": null,
    "terms": {}
    }
    /wp-json/posts/1
    GET

    View Slide

  20. [{
    "ID": 1,
    "post": 1,
    "content": "Hi, this is a comment.
    \nTo delete a comment,
    just log in and view the post's comments. There you will have
    the option to edit or delete them.\n",
    "status": "approved",
    "type": "comment",
    "author": {
    "ID": 0,
    "name": "Mr WordPress",
    "URL": "https://wordpress.org/",
    "avatar": "http://0.gravatar.com/avatar/
    ad516503a11cd5ca435acc9bb6523536?s=96"
    },
    "date": "2014-04-18T15:14:46-05:00",
    "meta": {
    "links": {
    "up": "http://local.wpapi.dev/wp-json/posts/1",
    "self": "http://local.wpapi.dev/wp-json/posts/1/comments/1"
    }}}]
    /wp-json/posts/1/comments
    GET

    View Slide

  21. [{
    "code": "json_user_cannot_list",
    "message": "Sorry, you are not allowed to list users."
    }]
    /wp-json/users
    GET
    GET /wp-json/posts/1/meta
    [{
    "code": "json_cannot_edit",
    "message": "Sorry, you cannot edit this post”
    }]

    View Slide

  22. curl -X POST -H "Content-Type: application/json" -d '
    {
    "title":"Bears Beat the Packers ",
    "content_raw":"In the coldest game in recorded Bears history, the Packers traveled to Soldier
    Field, where a victory against the Bears would have ended their playoff hopes. The Bears had to rally
    from a 14–3 score at the half. The Bears were able to score after a turnover on a Packers punt return.
    The Packers were on the verge of finishing a game-winning drive when Mason Crosby\u2019s field goal
    attempt was blocked by Alex Brown, pushing the game to overtime. The Bears took the first possession
    in overtime and won the game on a 38-yard field goal by Robbie Gould.<\/p>",
    "status": "publish"
    "sticky": true,
    "post_meta" : [
    {
    "key" : "game_score",
    "value" : "20-17"
    },
    {
    "key" : "game_victor",
    "value" : "Chicago Bears"
    }
    ]
    }
    ' -u admin:password http://local.wpapi.dev/wp-json/posts/
    /wp-json/posts
    GET
    POST
    Request
    Basic
    Auth

    View Slide

  23. curl -X PUT -H "Content-Type: application/json" -d '
    {
    "name":"Rachel Baker",
    "first_name":"Rachel",
    "last_name": “Baker",
    "nickname": “rachelbaker",
    "email": “rachel\u0040rachelbaker.me"
    }
    ' -u admin:password http://local.wpapi.dev/wp-json/users/1/
    /wp-json/users/1
    GET
    POST
    Request
    Basic
    Auth
    PUT

    View Slide

  24. Where could we use it?

    View Slide

  25. Use Cases:
    Perform CRUD operations 

    on the client-side
    Backbone.js themes or plugins
    !
    Receiving and populating content for
    “infinite scrolling”

    Form validation and submissions


    Front-end content editing

    View Slide

  26. Use Cases:
    Perform CRUD operations 

    on another WordPress site
    Display content from a separate WordPress site
    !
    Display content from another site within a
    multisite network
    !
    Manage (create, update, delete) content on a
    separate WordPress site or another site 

    within a multisite network

    View Slide

  27. Use Cases:
    Break your content free 

    from WordPress
    Display and manage your content in a
    mobile application
    !
    Integrate your content with other 

    application platforms
    !
    Integrate other application platforms with
    your WordPress site

    View Slide

  28. Where can we learn
    more?

    View Slide

  29. Resources
    JSON REST API Plugin:

    https://github.com/WP-API/WP-API
    !
    OAuth1 Authentication Plugin: 

    https://github.com/WP-API/OAuth1

    Basic Authentication Plugin: 

    https://github.com/WP-API/Basic-Auth
    !
    API Console:

    https://github.com/WP-API/api-console
    JSON REST API

    View Slide

  30. Resources
    JS Client:

    https://github.com/WP-API/client-js
    !
    PHP Client: 

    https://github.com/WP-API/client-php 

    WP-CLI Client: 

    https://github.com/WP-API/client-cli
    JSON REST API Clients

    View Slide

  31. Resources
    More about REST:

    http://www.restapitutorial.com/lessons/
    whatisrest.html
    !
    Postman HTTP Chrome Plugin:

    http://www.getpostman.com/
    !
    Paw HTTP App for OSX:

    http://luckymarmot.com/paw
    REST Information and Tools

    View Slide

  32. Have questions?
    Rachel Baker
    @rachelbaker
    Ryan McCue
    @rmccue
    wp-api.org
    github.com/WP-API/WP-API
    speakerdeck.com/rmccue/wcmke2014
    speakerdeck.com/rachelbaker/the-wordpress-json-rest-api

    View Slide