Course: Ideas - Developer's Guide to Block Themes - Part 3

[jonathanbossenger]

This ticket exists to gather ideas around what topics should be covered in part 3 of the guide to block themes course.

Please comment on this ticket with any topics/ideas you have for part 3

For the topics that have already been covered in parts 1 and 2, see the links to the course issues below

• Course: A Developers Guide To Block Theme Development - Part 1 #821
• Course: A Developers Guide To Block Theme Development - Part 2 #1041

[tomdevisser]

These are some questions on the top of my head I'm still left with after the first two parts. Some are undoubtedly more useful than others, and some might even be better to have their own course:

• How do we really lock down a block so the client can just edit content? Even after using the templateLock, I can still click "Modify" in de backend and make edits. The Locking API was mentioned, maybe go more in depth in a part 3
• How do I add custom blocks to a theme in a structured way? I know best practice is using the plugins folder, but we currently only store our themes in version control and it's nice to have everything bundled for some clients.
• Are there still styling aspects that are better to put in a stylesheet (Sass or CSS) instead of through theme.json? Maybe go through some pros and cons of using "old" styles.
• How do all styles from theme.json get compiled? Do they all go in one big stylesheet or are stylesheets loaded only if a block is on a page? How do we optimize e.g. caching these assets?
• How do you debug block themes? A few times I bumped into a "Attempt Block Recovery" notice after formatting some code with e.g. Prettier, which got me thinking, maybe add a part on debugging. How do you debug/validate templates and such.

Some extra thoughts:

• Maybe list and talk about some recommended extensions for Chrome/VS Code with snippets, Intellephense, code beautifying, etc.
• I would love to see a more fleshed out dev environment (but this might be a course in and of itself) where you explain the entire recommended process of developing local, migrating to staging, en pulling production back to local to synchronize. I feel like almost all tutorials rush over the dev environment part (install Local, run wp env, etc) but never give a fully implementable solution for real site development and getting the same local server settings as your remote server.

[tomdevisser]

Another addition, during these first courses and while playing with the Block Editor it feels like the three mentioned layout blocks Group, Row and Columns are indeed very important. It might be nice to go a bit more in depth on them and make some complex layouts to really get the hang of them and learn how to use them well.

[tomdevisser]

Another thing that I think would be very helpful, is how to make responsive designs with FSE. For example, you add a Spacer block but you want it to be smaller on mobile devices than on desktops. How do you do this?

[jonathanbossenger]

Thanks for these ideas @thomasdevisser I'll definitely keep them in mind for a future course.

[jonathanbossenger]

https://developer.wordpress.org/news/2023/02/intrinsic-design-theming-and-rethinking-how-to-design-with-wordpress/

[jonathanbossenger]

Creating specific templates per the template hierarchy (use case embeds)

[kaitohm]

@jonathanbossenger As this isn't the usual topic waiting to be vetted, I've moved it into the team's Admin project instead.

Could you share a timeline as to when this issue will remain open, or what the next steps are? Thanks.

[jonathanbossenger]

@bsanevans that's a good question.

I'd like to get this course out by the end of 2023. Part of the reason for this is that I'm still figuring out some of the course content in my weekly Sendig live streams.

I would say by the end of September I should have a good idea of what will go into this course, and then I will start planning and creating the content.

[kaitohm]

Perfect. Thanks for the update. This sounds exciting 🌟

[jonathanbossenger]

Some initial thoughts about the modules to be included in this course:

• A deeper dive into theme.json, how it works, and how the styles are compiled and rendered.
• The new WP Development mode and how it can be used during theme development
• Block themes, functions.php and style.css
• Adding and using custom Block Styles
• Adding and using custom Block Variations
• Curating the editor experience
• Block themes and child themes
• Block theme revision control
• Debugging errors during block theme development

[ndiego]

This looks great @jonathanbossenger. I do think a section dedicated to child theming would be useful. While there is some debate on whether child themes are needed or should be used with block themes, this is a very common workflow, and there are some considerations developers need to be aware of.

[jonathanbossenger]

That's a great point, thanks @ndiego