JavaScript for WordPress JavaScript for WordPress

Challenge 8: Listing Posts, Part 2

Check out a free preview of the full JavaScript for WordPress course:
The "Challenge 8: Listing Posts, Part 2" 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 discusses a few points about the structure in running WordPress decoupled including having WordPress and localhost needs to be on SSL.

Get Unlimited Access Now

Transcript from the "Challenge 8: Listing Posts, Part 2" Lesson

[00:00:00]
>> Zac: So I realize as folks are still working here that I just want to point out a few things about the structure of this app. So if you're still working go ahead but if you're following along you may have hit some of these problems as well. So I just wanna address them quickly.

[00:00:13] The first thing is that both your local host site and your WordPress site need to be running on SSL. So depending on whether you're using DesktopServer local by Flywheel or chassis, they all have different ways for configuring SSL. By far, locals is the easiest, you just go into your site, there's an SSL tab and click Trust, and then you could come back and load your site in https.

[00:00:39] I'm using a different environment, so my setup is slightly different. But whatever you're using, just Google search how to use SSL with DesktopServer or whatever. You'll also notice that it's not secure. And the reason for this is because your computer is telling the browser that it is secure.

[00:00:59] And your browser is saying, I don't believe you, I need extra documentation now. Local will handle all of this what's called signing the certificate and doing all of this on your behalf. So it won't show up there but I'm taking the lazy way. Now, you don't want this on a production site but for local development it's completely fine.

[00:01:17] And if you see a warning that says, are you sure you wanna proceed, click Proceed and then click on Save and you're fine for local development. But your request will fail if you're not on HTTPS. And the same is true although it will happen automatically when you run your localhost 3000.

[00:01:38]
>> Zac: You will need to have http up there. Now that should happen automatically. So in order for this all to work, that's one thing that needs to happen. If we come into our code, there's some stuff I didn't mention about the configuration of this sort of app, so let's talk about that briefly.

[00:01:55] The first is that in our config.js file is where we're gonna build out any dom elements that may potentially change from one app to another. So, let's say in every app we know we need like an app container and maybe a main page container. So we could just change this on the fly and everything will work.

[00:02:12] Or if our markup ever changes we only go to one place. When you code a lot of J query and you have these selectors all over the place it's easy to miss something. So this practice of having a configuration file is great for that. But you'll also need to change your rest URL to be whatever your site.dev is, or whatever it is.

[00:02:32] Mine's made green, .local. Yours is probably going to be something like yoursite.dev. So that's another thing that you'll have to change in order for this to work