Check out a free preview of the full JavaScript for WordPress course:
The "Deleting Posts with Rest API" Lesson is part of the full, JavaScript for WordPress course featured in this preview video. Here's what you'd learn in this lesson:

Zac demonstrates how to work with the REST API outside of WordPress to delete posts.

Get Unlimited Access Now

Transcript from the "Deleting Posts with Rest API" Lesson

[00:00:00]
>> Zac: What I'm gonna do is, because were outside of WordPress, these examples are not themes and they're not plugins so we don't have to copy them into WordPress. We could run them wherever we want. And they're all leveraging Webpak behind the scenes so that we could just launch up a server directly.

[00:00:16] So I'm gonna copy this, I'm sorry, I'm gonna drag this down into my editor. Man, it's really hard to use your computer when drag and drop doesn't work, things we take for granted, okay.
>> Zac: Okay, so let me come down to the final example, deleting-posts-completed. I'm gonna open up my command line and I'm gonna cd into 6.6, okay?

[00:00:59]
>> Zac: And once I'm in here, because I don't, notice there's no known modules folder. So the first thing you'll have to do is run npm install. That's not gonna work, hold on. Okay, and that's gonna pull down all your files. So, you'll have to do this for every one, so it may take a few seconds.

[00:01:20] It may just be faster to copy and paste, but you'll notice that the requirements in the first file are very small. And then by the time we get to the end,
>> Zac: Not the destore package.
>> Zac: Notice now not only do we have access but we have a form url encoder or whatever that is and a JS cookie and some more stuff in our thing.

[00:01:50] So you can't copy all the files directly. The other thing that I'll mention especially for those that are watching and saw that I changed some of the repo. Is that, when we get into saving posts, because you can't take the entire WordPress editor and pass it via a JSON string and have all that code work, I look forward to the days when Internet pipes work that way.

[00:02:15] But we can't, so when we get into our savings posts,
>> Zac: Notice that in my distribution folder, I have tinymce here and in my Index.html,
>> Zac: Scroll with me now. I'm just doing a hard link to it. So maybe not the best approach ever. And you could definitely get the slimmed down version, although this is the minified version.

[00:02:52] So again, not the best approach ever, but this is how we're doing it. If you downloaded the code and you come into one of the later examples, like let's say you come into editing posts and you don't see inside your distribution folder, the tinymce folder. You have to copy and paste it from one of the previous examples, okay?

[00:03:14] So, if you come in the distribution for editing posts, or deleting posts, and you don't see this tinymce folder. You've gotta copy it but I removed it just to save on speed, okay? So, now everything should be pulled in at this point. Cool, let's run npm start, I'll just show you again the package

[00:03:40]
>> Zac: Okay so our scripts in our JSON file, our packet JSON. We have start which is gonna run webpack server on https. We need https. Yes, you should never be doing authentication with your site not on SSL and your app on SSL. So our WordPress site has gotta be SSL.

[00:03:59] And [COUGH] whatever app we're building is SSL. Otherwise the data that we're sending is completely insecure and we do not wanna be sending user name and passwords over the wild wild web, right? So that's something to point out. And then finally when your ready to build for production, that option is there as well.

[00:04:18] So I could run NPM start.
>> Zac: This will boot up my server and it's going to tell me that this is going to be running on https. Just give it a second here.
>> Zac: Okay. So it's compiled and running now. I could come into my browser and local host.

[00:04:44] I think it's at 3000. Check it out. Looks familiar right? This is not running on WordPress, necessarily the server. So this could go straight up on any server. It doesn't have to be connected to the WordPress site. We click on something. We see the full post. Notice that this is just an excerpt.

[00:05:05] And then, there will be more when you go into the page, so containing that single-page view. And then, we also have the ability to log in to our site.
>> Zac: And now we see, I didn't copy over Teenymce, so it broke. Let me do that real quick.
>> Zac: And I'm just gonna check, like I said, that that, in my index file it's all linked up properly.

[00:05:37] That link should still be there. Okay, yeah, so that's there. Let's see, is it copied over? Almost done.
>> Zac: I will say when I was playing around with this, there are a number of different editors. So this is one of the problems when you move decoupled and you wanna let people edit.

[00:05:55] There's a few major ones out there. Some of them work better with some framework. Some of them work better than others. But because WordPress is already using teenymce, it's kind of tricky sometimes to set up and work with. That was part of the reason I did that here, but it has taken a really long time to copy over.

[00:06:18]
>> Zac: Okay, I come up and demo this again, I'm gonna let you get started. But basically, what you should see is the exact same thing we had before where you'll see the ability to edit posts and delete them. Here we go, okay.
>> Zac: Let's log out and start this over.

[00:06:38]
>> Zac: Okay, so we've got our posts, we can go ahead and log in.
>> Zac: And now we could see, we have this action, New Posty.
>> Zac: Heyo more, more, more. Save it, and we get the same message as before. The form clears. This time we don't have a toggle one.

[00:07:00] It was just one more thing to add. And I figured if you know the JavaScript to toggle something, that's not too bad. But now we could click on edit, it'll pop it up into the edit field, we could edit it, we could also delete it. And unlike our last app, not only can we edit and add stuff, but we can actually click into a specific page as well and view that extra data.

[00:07:22] So that wasn't in our standalone one, it looks like something went wrong here with that content being cleared, it should be, okay. So this is what we're after, and the benefits of being able to do this, is that you can now basically do whatever you need and work through the authentication.

[00:07:38] You could have them editing posts, deleting it, and we're not tied to WordPress at all, except via the API.