Lessons

Course Introduction

Lessons

What you'll learn in this section Technical Foundations (Classic) Technical Foundations (Block Editor) Database Interactions Data Storage Customization Options (Classic) Customization Options (Block Editor)

Lessons

What you'll learn in this section WordPress Set Up Browser Set Up Installing Node JS Discovering NPM Code Editor and Terminal

Lessons

What you'll learn in this section Installing the WP Scripts package Overview of the files created by WP Scripts Preview What WP Scripts files to track in Git Using WP Scripts to build blocks – A Using WP Scripts to build blocks – B Registering the block in JavaScript Adding the main plugin file Registering the block in PHP Testing the block in the browser Adding a second block to our plugin Creating a production build Necessary files to run blocks in production Do you need to track build files in Git?

Lessons

Block Development Foundations How to Create Builds Overview of the Development Helpers Introduction to Debugging Blocks Debugging Block Not Supported Errors Debugging JavaScript Errors Debugging Invalid Content Errors

Lessons

What you'll learn in this section What are block categories and how to use them? Registering a custom block category – A Registering a custom block category – B Registering a custom block category – C What is the SVG format? Adding the SVG icon to our block – A Adding the SVG icon to our block – B Adding the SVG icon to our block – C Changing the colors of the SVG icon

Lessons

Adding v3 and making the block compatible

Lessons

What you'll learn in this section What is a static block What is a dynamic block Advantages and disadvantages of static blocks Advantages and disadvantages of dynamic blocks

Lessons

What you'll learn in this section Understanding component-based building Finding the components you need for building Introducing the RichText component Implementing the RichText component

Lessons

What you'll learn in this section What are attributes? Attributes and editor data flows Registering an attribute Storing attributes in the Database Using attributes in the edit function

Lessons

What you'll learn in this section What is the iframed editor? How themes use theme.json to style blocks How themes enqueue CSS to style blocks How to use block assets for styling and scripts – A How to use block assets for styling and scripts – B How to use block assets for styling and scripts – C Tips for writing efficient CSS for blocks

Lessons

Overview of Block Supports Controlling Block Supports Adding Experimental Layout Support Adding Wide Alignment Support Adding Color Support With Default Controls Adding Spacing and Border Support

Lessons

React is not a Framework Introduction to Redux Introduction to Data Module Introduction to Select Introduction to Dispatch

Lessons

Getting Data from the Store Getting Data from the Database – A Getting Data from the Database – B Store-only Data vs. Data from the Database Changing Data in the Store Combining Getting and Updating Data

Lessons

Getting Post Meta in a Block Understanding Meta Handling in the Block Editor Making Post Meta Accessible the Block Editor Updating Post Meta in a Block Meta in the Store vs. Meta in the Database Displaying Meta on the Frontend

Lessons

Creating a Dynamic Block – A Creating a Dynamic Block – B Block Supports in Dynamic Blocks Using the Frontend Render in the Edit Function Adding Controls in the Sidebar – A Adding Controls in the Sidebar – B