More documentation on several files

Author: avillegasn

README.md

@@ -115,6 +115,7 @@ Note that if you plan to extend the block editor, the files should be placed in
 
 * `packages/blocks` is where custom block definitions reside. You will find a `demo` block that serves as an example of custom block that you can delete or modify. Remember to import your blocks in the file `packages/blocks/index.js` so that they are built properly.
 * `assets/src/js/admin` is for all admin-specific functionality. You will find an example of editor plugin in `plugin.js` that extends the block editor. You can delete it or modify such plugin.
+* `wp-beb.php` contains the function `enqueue_block_editor_assets` where you should enqueue the new files you create in `assets/src/js` and `assets/src/css` that compile into `assets/dist/js` and `assets/dist/css`, respectively.
 
 # Credits
 

assets/src/js/admin/plugin-component.js

@@ -10,18 +10,22 @@ const {
 } = wp.components;
 
 function addDemoBlock() {
+
 	const demoBlock = createBlock( 'wp-beb/demo', {
 		greeting: 'Hey there!',
 		className: 'is-style-awesome',
 	} );
 	dispatch( 'core/editor' ).insertBlock( demoBlock );
+
 }//end addDemoBlock()
 
 const PluginComponent = () => (
 
+	// Every component must have only one parent element.
+	// In this case, the parent element is a Fragment.
 	<Fragment>
 		<PluginSidebarMoreMenuItem target="sidebar-name">
-			My Sidebar
+			{ _x( 'My Sidebar', 'text', 'wp-beb' ) }
 		</PluginSidebarMoreMenuItem>
 		<PluginSidebar name="sidebar-name" title="My Sidebar">
 

assets/src/js/admin/plugin.js

@@ -5,6 +5,8 @@ import ElementIcon from '../../images/icon.svg';
 
 const { registerPlugin } = wp.plugins;
 
+// More info:
+// https://wordpress.org/gutenberg/handbook/designers-developers/developers/packages/packages-plugins/
 registerPlugin( 'plugin-name', {
 	icon: <ElementIcon />,
 	render: PluginComponent,

packages/blocks/demo/index.js

@@ -24,8 +24,8 @@ export const settings = {
 	title: BLOCK_TITLE,
 	description: BLOCK_DESCRIPTION,
 
-	// icon: <ElementIcon />, // Use a SVG for the icon.
-	icon: 'heart', // Use a Dashicon for the icon.
+	// icon: <ElementIcon />, // Use a SVG for the icon instead.
+	icon: 'heart', // Use a Dashicon for the icon instead of a SVG.
 
 	category: 'demo',
 	keywords: [

wp-beb.php

@@ -72,6 +72,7 @@ public function init_hooks() {
 			// Add Demo category.
 			add_filter( 'block_categories', [ $this, 'block_categories' ], 9 );
 
+			// Enqueue scripts and styles.
             add_action( 'enqueue_block_editor_assets', [ $this, 'enqueue_block_editor_assets' ], 9 );
 
 		}//end if