際際滷

際際滷Share a Scribd company logo
WP REST API
intro / terms / logic / useage
tomhermans.com
Hi, Im Tom
You might know me of 
Sony
Telenet
freelance WP development
get in touch : tomhermans.com
Question Time
term : API : Application Program Interface
agreed set of standardized ways
that a particular piece of software can be used;
the rules defined for its interaction with the wider world,
which govern how other pieces of software can talk to a
program
and how it will respond.
term : JSON: JavaScript Object Notation
a way to store information in an organized, easy-to-access manner.
In a nutshell, it gives us a human-readable collection of data that we can access in
a really logical manner.
var jason = {
"age" : "24",
"gender" : "male"
};
term : SPA : Single Page Application
is a web application or web site that fits on a single web page with the goal of
providing a more fluent user experience
The page does not reload at any point in the process.
WP REST API : A bit of history
WP APIs
XML-RPC & friends (atom..)
XML remote procedure call
mobile app
admin-ajax
lightweight routing layer
responds w/ JSON
more dev tool - see previous presentation
RSS
open standard syndication format
RESTful APIs
Twitter
Facebook
WordPress.com
Stripe
.. many more
Intro the WordPress REST API by tomhermans
Intro the WordPress REST API by tomhermans
What is REST ?
REST = representational state transfer
RESTful systems :
 communicate via HTTP
 same HTTP verbs (GET, POST, PUT, DELETE, etc.)
like web browsers use
 to retrieve web pages and to send data to remote servers.
REST Examples
Pretty much everyone who claims to have a REST API, in fact, does not.
Exception:
WWW - the World Wide Web
https://www.ics.uci.edu/~fielding/pubs/dissertation/rest_arch_style.htm
How is WWW restful ?
Does your browser (the client)
know whether its displaying a banking website or a casual game?
Nope.
It just utilizes standard media types (HTML, CSS, JS .. )
The web doesnt know whether it is serving you a website for a bank or a game.
How does a HTTP request look like ?
so, REST uses HTTP to CRUD
HTTP to CREATE data : POST
HTTP to READ data : GET
HTTP to UPDATE data : PUT (with an existing URI)
HTTP to DELETE data : DELETE
Example sites
https://feelingrestful.com/
http://quotesondesign.com/
http://www.michaelbromley.co.uk/
http://qz.com
Calypso / WordPress.com
What is Calypso
Calypso = frontend admin for WP, written in JS with REST API
to be used to read/write for WP.com and jetpack sites
1. better user experience
- faster & being able to manage multiple sites
2. better dev experience
- better tooling + how they deal with JS
Calypso how
How does Calypso work ?
> in a nutshell:
Connects to WP.com via node.js,
loads rest of JS, loaded async
controllers render React components
Why is Calypso interesting ?
interesting if you want to build a SPA based on WP REST API
Do You:
1. have a lot of user interaction ?
2. need quick transitions between interactions ?
3. have multiple front ends ? web/mobile/desktop, powered by same data
different mindset, user controls page content with interactions
DEMO time
So ...
this is a start, obviously
Different paradigm,
different mindset,
different useage,
different tooling
Can I already use it ?
Yes, but ..
think about
SEO,
server-side rendering,
JS dependencies, etc ..
Question Time
More questions ?
@tomhermans
tomhermans.com/contact

More Related Content

Intro the WordPress REST API by tomhermans

  • 1. WP REST API intro / terms / logic / useage tomhermans.com
  • 2. Hi, Im Tom You might know me of Sony Telenet freelance WP development get in touch : tomhermans.com
  • 4. term : API : Application Program Interface agreed set of standardized ways that a particular piece of software can be used; the rules defined for its interaction with the wider world, which govern how other pieces of software can talk to a program and how it will respond.
  • 5. term : JSON: JavaScript Object Notation a way to store information in an organized, easy-to-access manner. In a nutshell, it gives us a human-readable collection of data that we can access in a really logical manner. var jason = { "age" : "24", "gender" : "male" };
  • 6. term : SPA : Single Page Application is a web application or web site that fits on a single web page with the goal of providing a more fluent user experience The page does not reload at any point in the process.
  • 7. WP REST API : A bit of history
  • 8. WP APIs XML-RPC & friends (atom..) XML remote procedure call mobile app admin-ajax lightweight routing layer responds w/ JSON more dev tool - see previous presentation RSS open standard syndication format
  • 12. What is REST ? REST = representational state transfer RESTful systems : communicate via HTTP same HTTP verbs (GET, POST, PUT, DELETE, etc.) like web browsers use to retrieve web pages and to send data to remote servers.
  • 13. REST Examples Pretty much everyone who claims to have a REST API, in fact, does not. Exception: WWW - the World Wide Web https://www.ics.uci.edu/~fielding/pubs/dissertation/rest_arch_style.htm
  • 14. How is WWW restful ? Does your browser (the client) know whether its displaying a banking website or a casual game? Nope. It just utilizes standard media types (HTML, CSS, JS .. ) The web doesnt know whether it is serving you a website for a bank or a game.
  • 15. How does a HTTP request look like ?
  • 16. so, REST uses HTTP to CRUD HTTP to CREATE data : POST HTTP to READ data : GET HTTP to UPDATE data : PUT (with an existing URI) HTTP to DELETE data : DELETE
  • 19. What is Calypso Calypso = frontend admin for WP, written in JS with REST API to be used to read/write for WP.com and jetpack sites 1. better user experience - faster & being able to manage multiple sites 2. better dev experience - better tooling + how they deal with JS
  • 20. Calypso how How does Calypso work ? > in a nutshell: Connects to WP.com via node.js, loads rest of JS, loaded async controllers render React components
  • 21. Why is Calypso interesting ? interesting if you want to build a SPA based on WP REST API Do You: 1. have a lot of user interaction ? 2. need quick transitions between interactions ? 3. have multiple front ends ? web/mobile/desktop, powered by same data different mindset, user controls page content with interactions
  • 23. So ... this is a start, obviously Different paradigm, different mindset, different useage, different tooling
  • 24. Can I already use it ? Yes, but .. think about SEO, server-side rendering, JS dependencies, etc ..
  • 25. Question Time More questions ? @tomhermans tomhermans.com/contact