Course Assignment

cross-course project you designed and built in the first semester.

Brief

In this assignment, you’ll be using the WordPress REST API to manage the blogs for your website deployed on Netlify. Instead of having the blogs hardcoded into the HTML, you will use JavaScript to fetch the list of WordPress blogs and display them on your site.

It’s essential to note the two different aspects of the assignment: the WordPress REST API running on your web host, and your JavaScript in the cross-course project, making a call to that API. WordPress will generate a front-end, but that’s not what we’re using it for in this assignment; we’re using it as a Headless CMS.

You need to make a list of items, these can be blog posts or even product items in Wordpress.

Level 1 Process

  1. Create an installation of WordPress on your web host and ensure you set it to be headless so that the front-end generated by WordPress is hidden from the public.
  2. Using JavaScript, fetch the data from the WordPress REST API and add it to your website in the relevant sections of your cross-course project. If you have a ‘Featured’ section, find a way to flag ‘Featured items’ on WordPress and pull that onto your pages.
  3. Using query string parameters allow the user to click on an individual item in the product list and take them to see that product, with the specific data for that product on the page. If your site doesn’t currently have a product specific page, please add one.
  4. Submit a link to the website on Netlify. Submit a link to your PUBLIC github repo.

Level 2 Process (optional)

  1. If you have filters or sorts on your website, try sorting through the results you’re getting back from the API. For more information, you can watch and read the below:

WATCH

Video: Sort() method (13m 8s)

Video: Filter() method (10m 12s)

READ

Article: Array.prototype.sort()

Article: Array.prototype.filter()

Submission

By the end of the CA, you will:

  • have installed WordPress on a web host and created a list of blogs
  • be making an API call to fetch the blogs to your cross-course project
  • be using query strings to let the user click to view an individual product.

You need to complete all of the above to receive a passing grade.

Submit a link to your updated website.