Using JavaScript to Manipulate Lecture Posts

To update and delete the lecture notes, we need to connect the frontend developed in the last lesson with the WordPress REST API through JavaScript. This will enable us to make changes to a lecture note from the frontend and save those changes to the database. Using JavaScript, we will also delete the note from the frontend and the database at the same time.

With the Excellence folder open in VS Code, access the terminal by clicking the "View" option and choosing "Terminal." Run the start script using the npm run start command. The start script will watch for any changes in the code and recompile it.

Lecture class

We will create a new JavaScript file in the modules folder inside the src folder. We can name the file Lecture.js. In this file, we will create a class named Lecture. Every class has a constructor which initializes an object of the class. To check if the code is working, an alert popup with a test message is displayed when an object is created. The class has an events method to handles different events like mouse clicks, keypresses and page loads etc. Finally, we have methods with actions that take place when events occur. The last line exports the module. The code below shows the skeleton of the class.

Get hands-on with 1200+ tech skills courses.