Learn VIP Course: Enterprise Block Editor (Gutenberg)

This repository contains examples used in the Learn VIP Course: Enterprise Block Editor (Gutenberg)

What does it provide?

1. A PHP CodeSniffer configuration that will check your code against the coding standards that are recommended by the Newspack team.
2. A Prettier configuration for WordPress.
3. A Husky configuration to lint local files changes before they are committed.

How to install the coding standards tools

By running npm run setup from the root of the project you'll:

• Install package.json dependencies
• Install composer.json dependencies
• Initialize and configure husky pre-commit

Examples

• Module 4: Advanced Block Development

  • Lesson 4.1: Bindings
    • block-bindings-custom-source (live demo)
    • block-bindings-post-meta (live demo)
    • editor-bindings (live demo)
  • Lesson 4.2: Inner Blocks
    • inner-blocks (live demo)
  • Lesson 4.3: Context
    • context (live demo)
  • Lesson 4.4: Deprecation
    • deprecation (live demo)
  • Lesson 4.5: Transforms
    • transforms-filter (live demo)
  • Lesson 4.6: Block Variations
    • block-variations (live demo)
    • block-variations-quote (live demo)
    • unregister-block-variations (live demo)
    • modify-block-variation (live demo)

• Module 6: Customizing the Editor Experience

  • Lesson 6.1: Custom Block Panels and Inspectors
    • block-filters-inspector-controls (live demo)
  • Lesson 6.2: Slot & Fill System
    • slot-fills (live demo)
  • Lesson 6.3: Block Styles
    • block-styles (live demo)
  • Lesson 6.4: Editor Filters and Actions
    • block-filters-block-edit (live demo)
    • block-filters-inspector-controls (live demo)

• Module 7: WordPress Data Layer and wp.data

  • Lesson 7.5: Creating Custom Data Stores
    • review-system (live demo)

• Module 8: Interactivity API

  • Lesson 8.2: Implementing the Interactivity API
    • iapi-global-local-derived-state-block (live demo)
    • iapi-global-local-derived-state-3-blocks (live demo)