Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m

Next lesson playing in 5 seconds

Cancel

Free Preview: Get Started With the WPCOM.js WordPress API

Introduction

01:52
  • Overview
  • Transcript

WordPress is a battle-tested and reliable CMS. Now, with the new WPCOM.js library, you can harness this power to build a free and easy-to-update back-end for your web or mobile apps.

In this course you will learn how to use WPCOM with a WordPress.com site. You'll see how to retrieve public content from your site, how to set up authentication tokens, and how to create and edit posts with the easy-to-use WPCOM JavaScript API.

Do you want to learn WordPress development from start to finish? Check out our learning guide: Learn WordPress Development.

1. Introduction

1.1 Introduction

Hello, everyone. I am Reggie Dawson. Welcome to the Get Started with WPCOM.js course for Tuts+. If you're involved with web development, you have no doubt heard of WordPress. Originally conceived as a blog system, it has evolved into a platform capable of hosting a variety of sites. WordPress is built on top of a SQL database, and as a result it can be useful as the backend of a web project. WordPress has added a REST API that allows web developers to manipulate the data in the WordPress installation. Wordpress.com is a place where you can host your WordPress projects. There are for free and paid plans with varying levels of features. Of course, there's access to the WordPress API here, but along with that there's a JavaScript library available for us to use. WPCOM.js is the library designed for use with wordpress.com and the REST API. Now you may be wondering why we need a JavaScript library when we have the REST API. A JavaScript library is useful because we don't have to write the methods to handle the data returned, as well as traversing all of the end points that are available to us with REST API. The library makes extracting the data easier since we don't have to deal with AJAX requests and responses, and instead we will just worry about the WordPress data. WPCOM.js doesn't have a lot of documentation, but between this and the documentation for the WordPress REST API, we can figure out how to find the data that we are looking for. Understanding how to use WPCOM.js will allow you to leverage wordpress.com as the backend of your apps. Configuration of wordpress.com sites is simple. We can then use WPCOM as a library inside of our mobile and web apps. With that we can pull in blog posts, media, and other information stored in our wordpress.com site. Now that you know why you need WPCOM.js, in the next video we will get started with authentication.

2. Using WPCOM.js

2.1 Authentication

Hello everyone, I am Reggie Dawson. Welcome to the Get Started with wpcom.js course for Tuts+. Now before we can get started using wpcom.js, we first must sign up for a WordPress.com account. There are many different options, but the free plan will work for our purposes. Go to WordPress.com and sign up for an account. Once you have set up your site, we then need to generate our token. This token is how we will gain access to use the API. In order to do this, we need to go to the developer area for WordPress.com. If you aren't already logged in, all you need to do is login with your WordPress.com credentials. Once there, click on the My Apps link. And then after that, click on Create New Application. Once there, give your application a name and a description. Then in the website URL, we will add this address. We're going to use the node-wpcom-oauth to generate our token. This is a Node app that launches a small web server. And this is the address that will be used for it. Then in the redirect URLs we will use this address. Here, we are using another address that will be provided by the node app. This is where we will complete obtaining our token. Now in the JavaScript origins we will add this is the address that we will run our app from. Without this, any request will not work. Then add the answer to the math problem. Then in the type select Native and click Create. Once you have that, click on the title of your app so that you can see the OAuth information. Make sure to copy your client ID and client secret. After that, we will go to the node-wpcom-oauth project. Download the project and extract the contents of the zip file. Navigate to this folder in the command line. You will need to have Node.js installed for this to work. Then inside the node-wpcom-oauth master folder, run npm install. After that, navigate into the example folder. In this folder, we will also run npm install. After the packages are installed, open up the project in your editor. Inside the example folder there's a file named settingsexample.json. Rename this file the settings.json, and then open it so that we can make some changes. First add your client ID, then add your client secret. The redirection match will be used when we created our app in the developer area of WordPress.com. Save the project and then go back to the command-line. You should still be in the example folder. Then run nodeindex.js. Once you run that command, navigate to the address you used as the site address when you set up your app. Localhost:3001. Once you do that, you should see the information in the settings.json file. Click on Let's get the code. This will take you to the WordPress.com authorization screen. Click Approve here. Then finally it will be ready to request the access token. Click on let's get it. Once you have that, save the access token and the blog ID. Now that we have our access token, that's all we will need to use all of the methods from wpcom.js. Not all of the operations we can use will require authentication, but making changes such as adding a blog post requires it. Now that we are authenticated, in the next video we will learn about the wpcom, and sight methods.