Using the WordPress REST API

[jonathanbossenger]

Details

• Content type (Online Workshop, Lesson, Course, Tutorial, or Lesson Plan): Lesson
• Content title: Using the WordPress REST API
• Topic description: Now that the learner knows what the WP REST API is, it's time to learn how to use it. This lesson will cover 2 options, the Backbone.js client and the api-fetch package. Also introduce the core-data package for block development.
• Audience (User, Developer, Designer, Contributor, etc.): Developer
• Experience Level (Beginner, Intermediate, Advanced, Any): Beginner

Learning Objectives

• Identify ways to access WP REST API data, including the Backbone client, api-fetch, and core-data.
• Develop a WordPress REST API request, using the two options that ship with WordPress

Related Resources and Other Notes

• https://learn.wordpress.org/tutorial/using-the-wordpress-rest-api/
• https://developer.wordpress.org/rest-api/

Automation Code

//lesson

[jonathanbossenger]

//lesson

[github-actions[bot]]

Lesson Development Checklist

• [ ] Gather any relevant links to Support, Docs, or related material
• [ ] Description and Objectives finalized
• [ ] Lesson created and announced to the team for review
• [ ] Lesson reviewed
• [ ] Lesson video submitted and published to WPTV
• [ ] Lesson created on Learn.WordPress.org
• [ ] Lesson video published to YouTube
• [ ] Lesson on Learn.WordPress.org updated with YouTube video
• [ ] Lesson published to Learn.WordPress.org

[github-actions[bot]]

Lesson Development Checklist

• [x] Gather any relevant links to Support, Docs, or related material
• [x] Description and Objectives finalized
• [x] Lesson created and announced to the team for review
• [x] Lesson reviewed
• [x] Lesson video submitted and published to WPTV
• [x] Lesson created on Learn.WordPress.org
• [x] Lesson video published to YouTube
• [x] Lesson on Learn.WordPress.org updated with YouTube video
• [x] Lesson published to Learn.WordPress.org

[jonathanbossenger]

Script: https://github.com/jonathanbossenger/wp-content/blob/main/developer-learning-pathway/08-wordpress-rest-api/02-using-the-wp-rest-api.md

[jonathanbossenger]

https://github.com/WordPress/Learn/assets/180629/599eb442-ff32-4b80-a550-c2768382ac55

Video ready for review

Please follow the Guidelines for reviewing content to review this lesson.

[ironnysh]

Tutorial/Lessons Review Checklist

• [x] Learning outcomes/objectives are clear.
• [x] Technical concepts introduced in the content are accurate.
• [x] The speed of demonstrations are easy to follow.
• [x] The narration audio matches what is shown visually.
• [x] Spelling and grammar are correct.
• [x] Sound quality is consistent throughout the video.
• [ ] Brand Usage Guidelines and Promotional Guidelines are being followed.
• [ ] Media assets are all in the public domain (CC0).

@jonathanbossenger, great tutorial!

I have one suggestion: at 10:52, you mention people can leave the wp-api dependency but don't explain why. After watching, I wonder why not switch the order and spend more time demonstrating how to use the two newer options instead of focusing on the Backbone.js client and only mentioning the api-fetch package as an alternative.

In this context, I would have liked to know the differences between these three options at the beginning of the hands-on demo rather than closing with it (at ~16:20). Especially since the next lesson (#2267) only uses the api-fetch package.

[jonathanbossenger]

I have one suggestion: at 10:52, you mention people can leave the wp-api dependency but don't explain why.

There's no real reason as to why or why not, it largely depends on the use case. This specific example code isn't something one would use in the real world (building a form that has more than one way to fetch the data), so I was just pointing it out.

What I'm trying to avoid is someone thinking you have to include wp-api to be able to use wp-api-fetch, which you don't.

After watching, I wonder why not switch the order and spend more time demonstrating how to use the two newer options instead of focusing on the Backbone.js client and only mentioning the api-fetch package as an alternative.

So this one is a tricky one.

First off, I don't think I'm focusing on the Backbone.js client, it's just the first option being presented.

The reason for this is that, at the moment, the section on using the WP REST API only lists the Backbone.js client. With the advent of the block editor, the api-fetch package was added, but it's not referenced in the WP REST API docs, only in the block editor docs. So someone reading the WP REST API docs might wonder why this lesson doesn't reference it.

Additionally, the core-data package only works in a React app, so if you're building something outside of React, you'd have to use one of the other options.

This means that for this lesson, I have to cover at least the two current options that are available for a React context.

That's another reason I include the wrap-up at the end, instead of upfront. The lesson is not prescribing which option should be the default, they're all available, and all have their uses.

The other reason that I'm only presenting the three options here, and future lessons only use api-fetch as examples is that including the same 3 options for each of the next lessons makes those lessons that much longer, and I'm also fighting for time.

[jonathanbossenger]

I would also add that I would like to do a more in-depth series of lessons around using the WP REST API to build applications in a later learning pathway, but these initial lessons are very much introductory.

[ironnysh]

Thanks for the explanation, @jonathanbossenger! It's always interesting to understand the “why”, so I appreciate you taking the time 🤓

[jonathanbossenger]

https://wordpress.tv/2024/04/07/using-the-wordpress-rest-api-lesson/

[jonathanbossenger]

https://learn.wordpress.org/lesson/using-the-wordpress-rest-api/

[jonathanbossenger]

//publish