|
via Udemy |
Go to Course: https://www.udemy.com/course/gutenberg/
Certainly! Here's a comprehensive review, detailing, and recommendation for the Coursera course on creating custom Gutenberg blocks in WordPress: --- **Course Review and Overview: Enhancing WordPress with Custom Gutenberg Blocks** **Introduction** This Coursera course offers an in-depth journey into the modern world of WordPress development, focusing specifically on creating custom Gutenberg blocks — the new ReactJS-based block editor replacing the traditional WYSIWYG editor. If you’re a WordPress developer eager to leverage ReactJS and JavaScript to build flexible, dynamic, and highly customized content blocks, this course is a valuable resource. **Content & Curriculum** The course is structured methodically, beginning with foundational design principles for creating effective blocks. You will learn how Gutenberg stores post content in the database and how to manipulate this data to create an intuitive editing experience. Following the theoretical groundwork, the course dives into hands-on development by guiding you through creating your first plugin, where you'll register your first block. You will use tools provided by WordPress such as `wp-scripts`, along with workflows incorporating ESLint, Prettier, Stylelint, and Husky to ensure a clean and efficient development process. Throughout the course, you will explore both simple and complex blocks—covering essential features like embedding blocks within other blocks, handling images, and creating dynamic and static blocks. You’ll learn how to fetch data from external sources, work with nested blocks, and generate content dynamically. Advanced topics include managing metadata via custom sidebars, creating your own data stores similar to Redux, and understanding the intricacies of state management within the editor environment. Additional modules introduce best practices involving context, patterns, templates, and internationalization, empowering developers to create scalable, reusable, and globally ready blocks. **Prerequisites & Suitability** This course is aimed at developers with a solid background in WordPress theme and plugin development, along with proficient JavaScript skills, especially ES6+ features. Familiarity with ReactJS concepts such as components, hooks, and state management is essential, as the course builds heavily on these topics. Knowledge of Redux enhances understanding but is not mandatory, as the course explains core ideas and implementation approaches. **Pros** - **Comprehensive Content:** Covers a broad spectrum from basic block creation to advanced state and data management techniques. - **Hands-On Approach:** Practical examples and projects ensure that learners develop real-world skills. - **Tools & Workflow Integration:** Teaches modern development practices using tools like ESLint, Prettier, and Husky. - **Future-Proof Skills:** Equips developers to work with the latest WordPress editor and JavaScript frameworks. - **Expert Guidance:** Led by instructors with deep expertise in WordPress and ReactJS development. **Cons** - **Advanced Prerequisites:** Requires prior knowledge in JS, React, and WordPress development; beginners may find it challenging. - **Pace:** The material is dense and technical, demanding dedication and background knowledge. **Recommendation** If you are a WordPress developer looking to elevate your skills by mastering the new Gutenberg block editor, this course is highly recommended. It provides a thorough, step-by-step guide suitable for intermediate to advanced developers who want to create custom, reusable blocks, and improve their development workflow. For those new to ReactJS or JavaScript ES6+, it is advisable to supplement this course with basic tutorials on those topics beforehand. Additionally, developers interested in building complex, dynamic, and high-performance blocks will find this course invaluable. **Conclusion** This Coursera course is an essential resource for developers committed to modern WordPress development. It combines practical exercises with in-depth theoretical insights, preparing you to create cutting-edge Gutenberg blocks that enhance user experience and streamline content management. --- Feel free to let me know if you'd like a shorter summary or specific details included!
Recently WordPress decided to change their old WYSIWYG editor into a new ReactJS based block editor known as 'Gutenberg'. Gutenberg also known as the block editor is based on blocks. So your post will be composed of some blocks and each block will have a purpose. You can have a block that displays a button or an image or some text and so on. In this course you will learn everything you need to know in order to create custom blocks for the block editor. We will start by a simple block and then we will create some more complex blocks.In order to gain the most out of this course you need to have WordPress theme/plugin development knowledge. Javascript knowledge is required for this course. You should be familiar with basic JavaScript concepts and preferably the recent ES6+ versions. ReactJS knowledge is also required for this course. So concepts like component state, hooks and basic react concepts should not be new to you. Also advanced concepts like higher order component knowledge would be ideal however it will be discussed briefly in the course. Redux knowledge is also ideal. Not all blocks will require using redux, however in some blocks we will use redux heavily. So it would be ideal if you are familiar with redux concepts like stores, actions, reducers and so on.The course content will go as follows:First and before any coding we will discuss some design guidelines that you should follow when designing a block.We will take a look on how your Gutenberg post is saved in your database and what happens behind the scenes in order to construct your ReactJS based UI from the content saved in the database.In Section 2, we will create a WordPress plugin. Inside this plugin we will register out first Gutenberg block. We will also use a tool provided by WordPress called wp-scripts in order to process JS and CSS files in this plugin. We will also integrate tools like ESLint, Prettier, Stylelint and Husky for an improved development workflow.In section 3, we will take a quick look on some stuff that you can do in your WordPress theme that will allow you to modify/add some features in the block editor.In section 4 we will create a simple block. However in this simple block we will learn a lot about what we can do in a block.In section 5 we will use our knowledge to create a more complex block with some advanced features. These features include how to add blocks inside of other blocks, how to handle images and many more.Section 6 will be about creating dynamic blocks. So blocks can be static or in other words only generate some static HTML. But also they can be dynamic for example they can fetch something from the database.Section 7 will discover more about the redux-like data stores in the block editor. We will see how to use the existing data stores and also create our own store.Section 8 we will see different ways that we can follow in order to manage metadata in Gutenberg. We will manage metadata using a block. And we will also learn how to create a custom sidebar plugin and manage metadata in this sidebar.In the final section we are going to discuss various topics like: context, patterns, templates, formatting API, filters and internationalization.