From 6a8143471e1be3830216ed09aceb3fed041a9ea5 Mon Sep 17 00:00:00 2001 From: Josh Pollock Date: Wed, 7 Mar 2018 12:16:50 -0500 Subject: [PATCH 1/4] Start list of example code --- README.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/README.md b/README.md index e69de29..d5b3035 100644 --- a/README.md +++ b/README.md @@ -0,0 +1,4 @@ + + +# Plugins +*[Basic block, with one form control, using vanilla JavaScript](https://github.com/wordpress/gutenberg-tutorial/tree/plainjs) From e0951306577670cdf36e091202f34c5f464fbd70 Mon Sep 17 00:00:00 2001 From: Josh Pollock Date: Wed, 7 Mar 2018 15:26:30 -0500 Subject: [PATCH 2/4] Rough in readme --- README.md | 38 ++++++++++++++++++++++++++++++++++++-- 1 file changed, 36 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index d5b3035..27b8d0c 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,38 @@ +# Example Code From The Gutenberg Backpack Course +[The Gutenberg Backpack](https://learn.wordpress.org) is a deep dive into WordPress development with Gutenberg. This is the example code for that course, presented as functional plugins and a theme. +You can use this code to inspire your next Gutenberg block or even use it as the beginning of your own creation. Not sure how to create a block or what a block or a Gutenberg is yet? No worries, we have detailed tutorials for all of these concepts and code. -# Plugins -*[Basic block, with one form control, using vanilla JavaScript](https://github.com/wordpress/gutenberg-tutorial/tree/plainjs) +## Are You New New to WordPress or Gutenberg? +>[What Is Gutenberg?](https://wordpress.org/gutenberg) + +* For a quick start guide to WordPress development with Gutenberg: [The Gutenberg Handbook](https://wordpress.org/gutenberg/handbook/) + + +## What's Included? +### Basic Blocks Plugins With Simple Controls +> This is example code for [Introduction To Block Basics](https://learn.wordpress.org) +* [Using plain, vanilla JavaScript. Uses no build tooling or ESNext syntax](https://github.com/wordpress/gutenberg-tutorial/tree/plainjs) +* [Using VueJS. Uses no build tooling, or ESNext syntax](https://github.com/wordpress/gutenberg-tutorial/tree/vue) +* [Using separate components from React or WordPress. Uses webpack and ESNext syntax](https://github.com/wordpress/gutenberg-tutorial/tree/react) +* [A practical example of a block with meta data storage for block attributes](https://github.com/wordpress/gutenberg-tutorial/tree/static-events) + +### Example Theme +> This is example code for [Gutenberg For Themers](https://learn.wordpress.org) +* [Twenty Seventeen child theme showing CSS for full-width blocks, loading assets for customizing block display and more](https://github.com/WordPress/gutenberg-tutorial/tree/theme) + +### From Shortcodes and Meta-boxes To Blocks +> This is example code for [From Shortcodes And Metaboxes To Blocks With Backwards-Compatibility](https://learn.wordpress.org) +* [Replacing what would have otherwise been an enclosing shortcode with a block](https://github.com/WordPress/gutenberg-tutorial/tree/enclosing-shortcode) +* [Replacing what would have otherwise been a non-enclosing shortcode, with a block](https://github.com/WordPress/gutenberg-tutorial/tree/non-enclosing-shortcode) +* [Using a Gutenberg Block to to provide a new UI for a pre-existing shortcode](https://github.com/WordPress/gutenberg-tutorial/tree/prexisting-shortcode) +* [Working with meta boxes along with Gutenberg blocks](https://github.com/WordPress/gutenberg-tutorial/tree/metabox) + +### Advanced Block Development +> This is example code for [Advanced Topics In Block Development](https://learn.wordpress.org) +* [A basic "counter" plugin showing communicating between two blocks using WordPress' Redux abstraction](https://github.com/WordPress/gutenberg-tutorial/tree/counter) +* __Coming Soon__ Complex example of re-using components between Gutenberg, other admin screens and the front-end as well as nested and multi-column blocks created programmatically + + +## License +Like WordPress, this code is licensed under the terms of the GNU General Public License Version 2 or greater. __Please__ feel [free](https://wordpress.org/about/philosophy#gpl) to modify, reuse, or redistribute this code. That's what is here for. From 040c3b5167698ab5ffd5be5234c589f9db09852d Mon Sep 17 00:00:00 2001 From: Josh Pollock Date: Sat, 28 Apr 2018 12:17:46 -0400 Subject: [PATCH 3/4] Changed course name --- README.md | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 27b8d0c..baa1dd0 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,5 @@ -# Example Code From The Gutenberg Backpack Course -[The Gutenberg Backpack](https://learn.wordpress.org) is a deep dive into WordPress development with Gutenberg. This is the example code for that course, presented as functional plugins and a theme. +# Example Code From The Developer’s Guide to the Block Editor Course +The [Developer’s Guide to the Block Editor](https://learn.wordpress.org) course is a deep dive into WordPress development with Gutenberg. This is the example code for that course, presented as functional plugins and a theme. You can use this code to inspire your next Gutenberg block or even use it as the beginning of your own creation. Not sure how to create a block or what a block or a Gutenberg is yet? No worries, we have detailed tutorials for all of these concepts and code. @@ -8,7 +8,6 @@ You can use this code to inspire your next Gutenberg block or even use it as the * For a quick start guide to WordPress development with Gutenberg: [The Gutenberg Handbook](https://wordpress.org/gutenberg/handbook/) - ## What's Included? ### Basic Blocks Plugins With Simple Controls > This is example code for [Introduction To Block Basics](https://learn.wordpress.org) @@ -33,6 +32,5 @@ You can use this code to inspire your next Gutenberg block or even use it as the * [A basic "counter" plugin showing communicating between two blocks using WordPress' Redux abstraction](https://github.com/WordPress/gutenberg-tutorial/tree/counter) * __Coming Soon__ Complex example of re-using components between Gutenberg, other admin screens and the front-end as well as nested and multi-column blocks created programmatically - ## License Like WordPress, this code is licensed under the terms of the GNU General Public License Version 2 or greater. __Please__ feel [free](https://wordpress.org/about/philosophy#gpl) to modify, reuse, or redistribute this code. That's what is here for. From 13a5a9f92dc62bad22be4df507ecdf0223a9ce34 Mon Sep 17 00:00:00 2001 From: Josh Pollock Date: Sat, 28 Apr 2018 12:21:45 -0400 Subject: [PATCH 4/4] Add clone or download info --- README.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/README.md b/README.md index baa1dd0..f6318a1 100644 --- a/README.md +++ b/README.md @@ -9,6 +9,10 @@ You can use this code to inspire your next Gutenberg block or even use it as the * For a quick start guide to WordPress development with Gutenberg: [The Gutenberg Handbook](https://wordpress.org/gutenberg/handbook/) ## What's Included? +Each example plugin or theme has a branch in this repo. Here you will find a list of all of the examples, with links to their branch. You can download the plugin or theme using the green "Clone or Download" button and then selecting download ZIP. + +Alternatively, you may use git to clone the linked branch. + ### Basic Blocks Plugins With Simple Controls > This is example code for [Introduction To Block Basics](https://learn.wordpress.org) * [Using plain, vanilla JavaScript. Uses no build tooling or ESNext syntax](https://github.com/wordpress/gutenberg-tutorial/tree/plainjs)