Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
REST APIs for Absolute Beginners
Search
Tom J Nowell
July 23, 2017
Technology
0
970
REST APIs for Absolute Beginners
How to make a basic endpoint, use it on the frontend, and convert existing code
Tom J Nowell
July 23, 2017
Tweet
Share
More Decks by Tom J Nowell
See All by Tom J Nowell
Using Blocks Outside The Editor
tarendai
0
970
Composer_and_WordPress__1_.pdf
tarendai
0
79
VVV 2
tarendai
0
760
WordCamp Europe 2016 - Handling Anxiety
tarendai
1
470
Escape From New York
tarendai
0
720
WP The Right Way
tarendai
0
1k
Code Deodorant 2014
tarendai
1
720
Adv WP CLI
tarendai
0
690
WP CLI
tarendai
0
650
Other Decks in Technology
See All in Technology
Pythonによる契約プログラミング入門 / PyCon JP 2025
7pairs
5
2.5k
AI時代だからこそ考える、僕らが本当につくりたいスクラムチーム / A Scrum Team we really want to create in this AI era
takaking22
6
3.3k
業務自動化プラットフォーム Google Agentspace に入門してみる #devio2025
maroon1st
0
190
多様な事業ドメインのクリエイターへ 価値を届けるための営みについて
massyuu
0
100
KMP の Swift export
kokihirokawa
0
330
Green Tea Garbage Collector の今
zchee
PRO
2
390
Escaping_the_Kraken_-_October_2025.pdf
mdalmijn
0
120
FastAPIの魔法をgRPC/Connect RPCへ
monotaro
PRO
1
720
Findy Team+のSOC2取得までの道のり
rvirus0817
0
320
"複雑なデータ処理 × 静的サイト" を両立させる、楽をするRails運用 / A low-effort Rails workflow that combines “Complex Data Processing × Static Sites”
hogelog
3
1.9k
KAGのLT会 #8 - 東京リージョンでGAしたAmazon Q in QuickSightを使って、報告用の資料を作ってみた
0air
0
200
実装で解き明かす並行処理の歴史
zozotech
PRO
1
310
Featured
See All Featured
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.6k
Thoughts on Productivity
jonyablonski
70
4.9k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.7k
YesSQL, Process and Tooling at Scale
rocio
173
14k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
23
1.5k
Art, The Web, and Tiny UX
lynnandtonic
303
21k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.1k
GraphQLの誤解/rethinking-graphql
sonatard
73
11k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Site-Speed That Sticks
csswizardry
11
880
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.2k
Transcript
REST APIs for Absolute Beginners How to make a basic
endpoint, use it on the frontend, and convert existing code
What are my options?
Admin AJAX? add_action("wp_ajax_fruit", "fruit"); add_action("wp_ajax_nopriv_fruit", "fruit"); function fruit() { echo
"bananas"; exit; } jQuery.ajax({ type : "get", url : "https://example.com/wp-admin/admin-ajax.php", data : { action: "fruit" }, success: function(response) { // } });
A file in your theme/plugin you call?
REST API Endpoints
Where is the API? /wp-json
The rest API is a is a set of pages
that return JSON instead of HTML that have no state
REST actions GET - viewing POST - adding/updating DELETE -
deleting
Adding an Endpoint add_action( 'rest_api_init', function () { register_rest_route( 'tomjn/v1',
'/test/', array( 'methods' => 'GET', 'callback' => 'tomjn_rest_test' ) ); } ); function tomjn_rest_test() { return "moomins"; }
/wp-json/tomjn/v1/test
None
Viewing an endpoint jQuery.get( "https://tomjn.com/wp-json/tom/v1/test", function ( data ) {
console.log( data ); } );
How Do I Accept Parameters? function tomjn_rest_test( \WP_REST_Request $request )
{ return "moomins ".$request["val"]; } /wp-json/tomjn/v1/test?val=1 "moomins 1"
Converting AJAX calls • Register an endpoint • Use the
function WP Admin AJAX uses • Return what you want instead of printing it • Use the request parameter instead of $_GET $_POST etc • Update the URLs in your javascript
A Useful Helper wp_enqueue_script( 'wp-api' );
Creating Content $.ajax( { url: wpApiSettings.root + 'wp/v2/posts', method: 'POST',
beforeSend: function ( xhr ) { xhr.setRequestHeader( 'X-WP-Nonce', wpApiSettings.nonce ); }, data:{ 'title' : 'Hello Moon', 'content': 'Test post' } } ).done( function ( response ) { console.log( response ); } );
Updating Content $.ajax( { url: wpApiSettings.root + 'wp/v2/posts/1', method: 'POST',
beforeSend: function ( xhr ) { xhr.setRequestHeader( 'X-WP-Nonce', wpApiSettings.nonce ); }, data:{ 'title' : 'Updated Moon', 'content': 'even better post' } } ).done( function ( response ) { console.log( response ); } );
Deleting Content $.ajax( { url: wpApiSettings.root + 'wp/v2/posts/1', method: 'DELETE',
beforeSend: function ( xhr ) { xhr.setRequestHeader( 'X-WP-Nonce', wpApiSettings.nonce ); } } ).done( function ( response ) { console.log( response ); } );
Built in Endpoints Posts /wp/v2/posts Post Revisions /wp/v2/revisions Categories /wp/v2/categories
Tags /wp/v2/tags Pages /wp/v2/pages Comments /wp/v2/comments Taxonomies /wp/v2/taxonomies Media /wp/v2/media Users /wp/v2/users Post Types /wp/v2/types Post Statuses /wp/v2/statuses Settings /wp/v2/settings
Useful Things
Adding REST support to CPT 'show_in_rest' => true,
WP.org REST API Handbook https://developer.wordpress.org/rest-api
Rest API Console
None
None
Questions? Tom J Nowell @tarendai https://tomjn.com Wordpress.com VIP* * we’re
hiring