Same thing with brads-boilerplate-block-plugin. Works after activation, after npm install, but breaks after npm run start. Editor says "Your site doesn’t include support for the “makeupnamespace/make-up-name” block"

I just updated the GitHub repo so that both the theme and the plugin folders have updated package.json files. I believe the version of the official WordPress package was old enough that it was causing the build process to just fail altogether; when I tested the repo a few minutes ago mine wasn't working either. But with the updated files now it works perfectly.

I see that this command is deleting all the files from the build folder.

@@LearnWebCode yes, I downloaded it again and now it is working perfectly (with WP 5.9.3) so I can complete the tutorial. Thanks Brad!

I bought that course too and I assure you you won't regret. Brad is a great tutor and is a pretty good start to become a Wordpress developer

Have you done The Udemy Wordpress course (smth like Unlocking Power With Code")?

The approach in this video is still pretty "WordPressy" - if you really prefer to work with React more than WordPress I think the Frontity project looks perfect! The only downside is that you need Node.js web hosting instead of just the traditional super affordable PHP / LAMP hosting. EDIT: Apparently you can use the free Vercel service to host the Node.js endpoints; the official Frontity documentation has a deployment guide too.

😂 😂 Accurate

Thanks! A month or two ago I added an entirely new 10 hour chapter about "Plugin Development" to the existing Fictional University course.

Good point! For SEO / accessibility reasons I like to have most of the standard content (paragraphs, headings etc...) output server-side, and only use React for interactive parts of the page as necessary (for example the sky color /grass color toggle buttons and values). If you want to use React for the entirety of the page and have the benefits of SPA / client-side-routing etc... check out the "Frontity" project.

Just like how WordPress offers the PHP function called __() where you provide your text value and text_domain, WordPress also offers a __() function for JS. Then once those are in place, I'm a big fan of the "Loco Translate" plugin for generating the translation templates, etc... In my full WordPress Dev course on Udemy we make one of the plugins we develop fully translatable using that process.

Whether it's WordPress, or any platform, you can always technically do everything with plain JS and don't need React or Vue or any library. The "Day 1 of the 10 Days of React" video on my channel explains the problem React is solving and why I feel it's useful. Also, since React is the official / WordPress way of creating Gutenberg block types for the edit screen, I feel like it's nice to also use it elsewhere on a WP project, as it's just one less mental / contextual shift.

@@LearnWebCode Understood. Thank you very much for answer me, Brad.

I can see that it works well with other themes, but is not working the frontend part in twentytwentytwo.

@@panamatsu5958 I have the same issue as you! Were you able to find a solution?

Is there a reason you want to use shortcodes instead of inserting a Gutenberg block type like in this video / boilerplate? In my boilerplate PHP that outputs the HTML placeholder for the block types to render into, in that same callback you can load the JS / CSS files, so that way you're only loading them if the specific page actually needs them.

@@LearnWebCode I agree Brad that the custon block type is a very flexible solution as you describe it for Gutenberg. But I would like to use your solution in other editors also, like Elementor etc. That's why I turned to the shortcode solution just to be able to easily insert everywhere the HTML placeholder. But I am not sure about the hooks and the enqueue code I have to use, in order to avoid loading the app when no needed.

@@suhailxeaser Yeah 😂

Hey, did you manage to find the fix for this issue?

@@thomasleclech2917 thanks mate!

Hi, I think it depends on what you're the most interested in. Do you prefer UI / front-end / SPA / design work? Or do you prefer backend? I'd say unless you want to create plugins for WordPress there's not much of a need to deep dive into PHP.

@@LearnWebCode this is my skillset right now. Rate from 1 to 10. 1 lowest and 10 highest. Python (6), Django(6), Javascript(4), React(1),html(7),css(sass)(7).Wordpress(6),PHP(4). Please help. I'm so overwhelmed right now hahaha

Good question. WordPress doesn't have any standard solutions for that at the moment. If I wanted to have client-side routing on hydration and initial server-side rendering for SEO + accessibility I'd probably setup WordPress on a sub or separate domain, and then use Next.js as the React front-end site. You could definitely use React + React Router on a standard WordPress site but the question is server-side rendering for SEO + accessibility. You don't want to have to spell out your UI once in React and once in PHP HTML. There used to be a project named "Frontity" that integrated WordPress with React/JSX, but it was discontinued, but the good news is that now WordPress core is working on something new / related called "The Interactivity API." It will allow for server-side-rendering in a way that could play nicely with client-side rendering/routing as well. I'm looking forward to it developing over the next year or so: make.wordpress.org/core/2023/03/30/proposal-the-interactivity-api-a-better-developer-experience-in-building-interactive-blocks/

The @wordpress/scripts package can create the bundled files without a working WordPress environment, but if you want to actually be able to test / view the packages on the site then you'd need WAMP / LocalWP to preview things before deploying live somewhere.

@@LearnWebCode that's super cool.