Видео курса

  • Урок 1. 00:05:35
    Installing a Theme & Cloning the Gutenberg Repository
  • Урок 2. 00:03:03
    The Editor Interface
  • Урок 3. 00:06:38
    The Block Interface
  • Урок 4. 00:06:45
    Block Design - Best Practices & Guidelines
  • Урок 5. 00:05:15
    How Our Gutenberg Post is Saved in the Database
  • Урок 6. 00:03:52
    How the Visual Editor is Reconstructed From Plain HTML
  • Урок 7. 00:06:28
    A Brief Introduction to Redux in Gutenberg
  • Урок 8. 00:07:07
    The Post State Array in Action
  • Урок 9. 00:06:28
    Writing a React Component Without JSX
  • Урок 10. 00:04:15
    Preparing Our Files for Webpack & NPM
  • Урок 11. 00:07:48
    Using Webpack to Bundle Our JS Files
  • Урок 12. 00:09:30
    Using Webpack Loaders to Transpile ES6 into ES5
  • Урок 13. 00:04:09
    Transpiling JSX with Webpack
  • Урок 14. 00:04:06
    React Babel Preset Development Mode
  • Урок 15. 00:05:03
    Exploring Source-mapping Options in Webpack
  • Урок 16. 00:06:38
    Compiling & Loading SASS Files with Webpack
  • Урок 17. 00:04:22
    Adding Autoprefixer to Our CSS
  • Урок 18. 00:05:45
    Moving the CSS Bundle into a Separate File Using Webpack Plugins
  • Урок 19. 00:05:54
    Minifying the CSS Bundle with Webpack
  • Урок 20. 00:06:43
    Creating a Plugin & Registering a Block with ES5
  • Урок 21. 00:05:19
    Block Server Side Registration
  • Урок 22. 00:04:00
    Using React Properly in Gutenberg Blocks
  • Урок 23. 00:03:17
    Changing the Block Icons and Filtering Keywords
  • Урок 24. 00:04:30
    Applying Webpack to our WordPress Plugin
  • Урок 25. 00:05:47
    Enqueuing Our New Bundle & Refactoring PHP Registration
  • Урок 26. 00:05:35
    Registering a Block With ES6 & JSX
  • Урок 27. 00:06:37
    Styling Our Block in the Editor Page
  • Урок 28. 00:10:57
    Creating a New Webpack Bundle for Editor+Frontend Styles & Scripts
  • Урок 29. 00:10:35
    Understanding & Using the Webpack Externals Feature
  • Урок 30. 00:09:24
    Adding Gulp to the Workflow to Produce a Zipped version of the plugin
  • Урок 31. 00:06:47
    [Optional] Integrating ESLint in Our Project
  • Урок 32. 00:04:07
    [Optional] Running ESLint Before Creating a production Bundle
  • Урок 33. 00:06:45
    [Optional] Adding Prettier to Our Project
  • Урок 34. 00:03:23
    [Optional] Disabling ESLint Rules that Prettier Will Fix
  • Урок 35. 00:08:08
    [Optional] Running Prettier Before Committing to Repository Using Husky Hooks
  • Урок 36. 00:04:11
    Adding align-wide & align-full support
  • Урок 37. 00:04:08
    Creating a Custom Colour Palette
  • Урок 38. 00:01:27
    Making Gutenberg's Embedded Content Responsive
  • Урок 39. 00:06:22
    Adding Editor Styles to Resemble Front-end
  • Урок 40. 00:07:04
    The "wp.editor" & "wp.components" Modules
  • Урок 41. 00:05:44
    Using the RichText Component in the Editor
  • Урок 42. 00:03:29
    Using the RichText Component in the save() Function
  • Урок 43. 00:02:02
    Avoiding Saving Attributes in Block Delimiters and Parsing them from the HTML
  • Урок 44. 00:08:53
    An Overview of the BlockControls Component
  • Урок 45. 00:05:19
    Using the AlignmentToolbar Component
  • Урок 46. 00:04:47
    An Overview of the InspectorControls Component
  • Урок 47. 00:05:20
    Using the PanelColorSettings Component
  • Урок 48. 00:03:44
    Adding Multiple Styles to our Block
  • Урок 49. 00:02:50
    Adding a Custom Category to the Block Library
  • Урок 50. 00:04:04
    Moving the Edit Component into a Separate File
  • Урок 51. 00:06:21
    Porting the Edit Function from a Functional to a Class Component
  • Урок 52. 00:04:24
    Introducing the withColors Higher Order Component
  • Урок 53. 00:09:09
    Using withColors HOC in the Editor
  • Урок 54. 00:08:01
    Using withColors HOC in the Front-end
  • Урок 55. 00:04:43
    Adding a Toggle Shadow Option in the Block Toolbar
  • Урок 56. 00:06:30
    Adding a Shadow Opacity Option Using RangeControl
  • Урок 57. 00:05:30
    Adding Deprecated Versions to your Block to Avoid Validation Errors
  • Урок 58. 00:11:17
    Migrating Old Attributes in Deprecations
  • Урок 59. 00:06:23
    Transforming Other Block Types into Our Block
  • Урок 60. 00:02:35
    Transforming Our Block Type into Other Block Types
  • Урок 61. 00:01:56
    Block Overview
  • Урок 62. 00:04:15
    Setting Up Our Block
  • Урок 63. 00:06:26
    Implementing the Edit Function for Editing the Title & the Bio
  • Урок 64. 00:02:55
    Adding the Save Function for the Team Member Block
  • Урок 65. 00:08:59
    Creating the Team Members Block Using InnerBlocks
  • Урок 66. 00:05:19
    Adding a Columns Attribute for the Parent Team Members Block
  • Урок 67. 00:07:04
    Styling the Columns in the Front-end
  • Урок 68. 00:07:34
    Styling the Columns in the Editor Page
  • Урок 69. 00:01:44
    Removing Unneeded Block Features
  • Урок 70. 00:06:27
    Introducing the MediaPlaceholder Component
  • Урок 71. 00:08:26
    Handling the Image Upload & Media Library Buttons
  • Урок 72. 00:01:47
    Handling Inserting an Image from a URL
  • Урок 73. 00:03:55
    Handling Image Upload Errors
  • Урок 74. 00:02:12
    Displaying a Responsive Image in the Front-end
  • Урок 75. 00:04:44
    Handling Blocks with Unfinished Image Uploads
  • Урок 76. 00:09:38
    Adding Edit Image & Remove Image Buttons and Functionality
  • Урок 77. 00:04:36
    Adding a Textarea in the Sidebar to Edit the Alt Text for the Image
  • Урок 78. 00:06:40
    Adding the Option to Change the Image Size
  • Урок 79. 00:10:29
    Populating the Image Sizes Dropdown from Redux Stores
  • Урок 80. 00:01:11
    Enabling "Align Wide" & "Align Full" in Our Team Members Block
  • Урок 81. 00:07:28
    Adding an Array Type Attribute for the Social Links and Icons
  • Урок 82. 00:08:05
    Adding a Selected Icon State Using React's Component State
  • Урок 83. 00:05:49
    Implementing the Save Function for the Team Member
  • Урок 84. 00:04:29
    Avoiding Saving the Social Array Attribute in the Block Delimiter
  • Урок 85. 00:04:03
    Adding the Markup for the Edit Social Link Form
  • Урок 86. 00:07:05
    Populating the Form and Updating the Social Attribute
  • Урок 87. 00:03:40
    Removing Items from the Social Attribute
  • Урок 88. 00:12:25
    Making the Social Icons Sortable Using react-sortable-hoc
  • Урок 89. 00:08:49
    Transforming Galleries and Images into Team Members
  • Урок 90. 00:04:49
    Setting Up Our Dynamic Block
  • Урок 91. 00:04:28
    Adding Attributes in a Dynamic Block
  • Урок 92. 00:06:06
    Fetching the Latest Posts Dynamically in the Render Callback Function
  • Урок 93. 00:04:24
    Fetching the Latest Posts in the JS Side using Redux
  • Урок 94. 00:06:32
    Mimicking the PHP Posts Loop Using JS in the Edit Function
  • Урок 95. 00:03:31
    Adding a Sidebar Option for the Number of Posts
  • Урок 96. 00:10:30
    Filtering the Latest Posts by Categories
  • Урок 97. 00:07:33
    Accessing redux data & dispatching actions to redux the WRONG Way!
  • Урок 98. 00:07:29
    Using withSelect & widthDispatch together using "wp.compose"
  • Урок 99. 00:03:13
    Let's Create a Redux Store and Use it in Multiple Components!
  • Урок 100. 00:07:26
    Setting Up Our Block and Redux Store Files
  • Урок 101. 00:09:49
    Registering our Own Redux Store
  • Урок 102. 00:06:27
    Populating Our Redux Store using an External API
  • Урок 103. 00:05:14
    Improving our Resolver using Controls and Generator Functions
  • Урок 104. 00:07:27
    Displaying our To Dos from the Redux Store in the To Do List Component
  • Урок 105. 00:06:12
    Adding a new Control to Toggle the To Do Item
  • Урок 106. 00:06:07
    Updating the To Do Items After Getting a Response from the API
  • Урок 107. 00:05:55
    Creating a Second Block that Shares the Same Redux Data
  • Урок 108. 00:06:35
    How is Metadata Managed by Default in Gutenberg?
  • Урок 109. 00:08:03
    How to Get and Set Metadata using Redux Selectors and Actions
  • Урок 110. 00:06:41
    Updating Metadata Using a Block
  • Урок 111. 00:07:15
    Using Templates to Pre-define blocks in the Editor Page
  • Урок 112. 00:07:09
    Registering a Gutenberg Plugin to Add a Sidebar
  • Урок 113. 00:04:25
    Using Our Plugin to Modify the Existing Gutenberg Sidebar
  • Урок 114. 00:07:29
    Managing Metadata in the New Sidebar
  • Урок 115. 00:02:14
    Conclusion & Next Steps
Этот курс находится в платной подписке. Оформи премиум подписку и смотри Gutenberg Blocks for WordPress and React Developers, а также все другие курсы, прямо сейчас!
Премиум FAQ