Learn How to Use JavaScript and WordPress Together!
There are a number of possible pitfalls when using JavaScript and WordPress together, such as:
- Conflicts with JavaScript files loaded by other plugins and the theme on a site
- Security when passing data between JavaScript and the WordPress database
- Site performance
This course will show you how to help avoid these pitfalls and introduce you to the new WP REST API available starting in WordPress 4.4!
Course Outline
Module 1: Introduction
This short module introduces the core concepts we’ll cover in the later modules.
- Introduction
- Basic Concepts
- Summary
Module 2: Using JavaScript in Plugins and Themes
This module goes in depth on how to add JavaScript to your site, add any dependencies in the correct order, ensure messages are translatable, and cleanly pass any data your scripts need from PHP to JavaScript.
- Overview
- When to call wp_enqueue_script
- Localizing your script and passing data
- Notes on using jQuery in WordPress
- Demo: Prevent adding posts with no featured image
- Demo: Using jQuery UI on the front end
- Adding Within a Theme
- Using PHP Classes
- Registering multiple scripts
- Summary
Module 3: Using AJAX to Send and Save Data
The basics of setting up an endpoint in WordPress to use in JavaScript to send and receive data, through the WP REST API.
- Introduction
- Adding an Endpoint
- Using the Endpoint
- Validation and Sanitization
- Authentication
- Calling our Endpoint
- Demo: Cupcake Voting
- More Complex Endpoints
- Best Practices
- Summary
Module 4: Minifying and Combining Your JavaScript with Grunt
How to use Grunt to reduce the size of your JavaScript files, along with the network requests made – both increasing site performance.
- Introduction
- Creating the Tasks in Gruntfile.js
- Adding Development vs. Production Versions
- Summary
Sample Project
We’ll use a cupcake site as the base site in the course, for adding our JavaScript and functionality to. Why? Because cupcakes are delicious.
About the Author
Brian Hogg is a WordPress developer, trainer, WordCamp organizer, and creator of the Event Calendar Newsletter plugin.
Brian’s also a former instructor at McMaster University, along with volunteering to lead sessions on WordPress, jQuery and CSS for Ladies Learning Code.