Thanks! Your comment really explains why I make the videos the way I do!

I agree with you, in general, but with time I started to see the benefits of other approaches too. So for example - I watch videos that are more like showing-off rather than teaching lesson, because they cover a lot of info and provide little to no details. Barely scratch the surface, in a way. And then, if something gets my attention - I go to channel like this, where I gain the know-how and actually learn the stuff. Just sharing some thoughts :)

@@peterveliki7918 well, sounds like a good strategy. I think I will try it too :)

Exactly as simple as that.

Thanks dood

I was going to write exactly the same. I think Brad shoud put that somewhere in the video description.

😹 She's the star of the channel. Thank you so much for all the support! Wish you all the best too. One more video on JSX & Babel and then we'll be transitioning into the Servers chapter 🥳

@@LearnWebCode I can definitely see that, she is a superstar. 😻😻😻 I will be waiting for you upload. 👨‍💻

@Shariar I also Do the same things that you do😂

Thank you so much! This is one of the nicest comments I've ever received 🙂🥳

Thank you so much! The next Udemy course is going to be about "WordPress + React" and how to create single-page-apps and plugins, etc...

That is awesome! Thanks for sharing the great news 🥳

מה קורה

@@MaxTheFireCat טוב. מה הולך ?

Good luck!

Looking for the same thing actually, I can’t get this to work in the local Wordpress environment unfortunately

@@Vespavandenberg I've actually gave up and used his approach from this video: kzfaq.info/get/bejne/o5N_ecmls66yqZc.html&ab_channel=LearnWebCode and I was using this during my last project and all was working nice apart of a but slower response comparing to HRM from webpack. There is no response from Brad and this webpack thing is inconsistent across his other courses. Once he is using one approach and next time different one and the best and the easiest to setup is with React app because webpack and all bundling features are configured there automatically by default which is super convenient.

It's an old Leopold model with Cherry MX Brown switches 🤓

Thanks, and it's true haha, I said 10 - 30 minutes in the series intro 😂

i am the third but fourth who liked it

Do you need to log in to watch those animes?

@@jackwright7014 No thank you I fixed the problem.

This was just for setting up a local dev environment with super fast injection of our latest code each time we save; 100% just front-end client-side. It may not have been very practical, because in the real world when you use "create-react-app" it handles all of the webpack / node preview/ dev server setup for you behind the scenes, so it's not very vital to learn how to manually configure webpack and webpack-dev-server like this.

@@LearnWebCode thank you for being such great tutor. I have never done in manual way. Every time I use "create-react-app" to setup my project. Some of my friends told me that they are using CRA for real production application in their company. So I never thought of doing it in manual way. Recently I went through ejs (node package) tutorial to make SSR application. I thought this tutorial is to make SSR apps without ejs. So many stuffs to learn now and I am bit confused. All these day i am having a wrong understanding of how all these works. Thank you so much for explaining it to me now. I am having some picture how React application and node env works.

My bad. I was running a plug-in called hot module replacement plugin, and removed the if condition from the main. Now I replace it back with the hot module condition in man.js. I am still struggling to inject the same way for html files. If I use vscode live server extension then I have to run it in a different port. Lazy approach. There has to be a more dynamic way

this comment must be pinned

Do you see "[hash]" anywhere in your webpack config? That's what's generating the hash in the filename; you can try removing it. I'd recommend keeping it though if possible, it's great for having visitor's web browsers know they should download the newest/changed version of the file. In the next lesson in this series we're going to look at something called "html-webpack-plugin" and "webpack-manifest-plugin" that help you use the unpredictable file names in your projects.

@@LearnWebCode thanks mate

Laravel is great, and if you're already in that space or really experienced with PHP... I always say don't worry about industry trends *too* much, you can only work so much in a week and there's definitely enough Laravel / PHP work opportunities to last several lifetimes 🙂 Having said that, if someone wasn't already established in any tech stack / framework I do recommend JavaScript because it's one language that can be used *everywhere* and is very in demand. Ultimately though, a PHP or Python back-end with superb front-end JS skills is obviously going to be in demand too! I don't think you can really go wrong, but JavaScript is nice because as your understanding of the language itself grows it benefits you both on the front-end AND back-end.

@@LearnWebCode Thank you for the reply Brad, I am not very well versed in PHP, but the Laravel framework seems more intuitive than other backend frameworks in my novice opinion? However I think I will stick with the JS. I have put too much effort in already to turn back now. I have your React, Node, & Git a Web Developer courses, and they are great. Thanks for all your efforts. You help many people. 👍

Thank you!

Hey I stubbled upon same error, Webpack has been updated to v4 since the release of this video and contentBase option is deleted. Instead, use static: { directory: path.resolve(....) } that should work :)

@@tea42 yes, that's te way to do it

It's a good question that I don't have a profound answer for. From what I've seen outright malicious "on purpose" code doesn't make its way into popular mainstream NPM packages very often at all, and it's usually just potential security vulnerabilities and those can be fixed with the "npm audit fix" command as they're discovered. Similarly to PHP / WordPress, if you don't keep your WP Installation up to date you can guarantee with 100% certainty that your site will be hacked. I'm not a security expert but I know a lot of huge companies with near limitless budgets use Node, and I can't imagine they'd use it if it was inherently insecure.

@@LearnWebCode Your feedback is valuable intel. and I appreciate you taking the time to reply. Thank you Brad.

If you're referring to modern browsers supporting native JS modules / import / export, yes that's true. But beyond that browsers don't do any of the things webpack offers. It's not *just* bundling up our imports for files we ourselves created, it's also keeping track of our dependency tree and automatically pulling in packages from node_modules for us. And as we'll see in the next video webpack can automatically run different types of files through different transpilers/processors (Babel/JSX for JS files, Sass/PostCSS for CSS files). I think compiling CSS adds lots of benefits and haven't been on a dev team in the last decade that didn't use a pre or post processor.

The last time I tested, the browser will actually perform a full traditional refresh instead of loading the new version of the assets on-the-fly.

okay i got it @Jack Saat's comments

I mean npm i -DE

It will work perfectly either way, but yes, it's common to install it as a devDependency. However, I didn't want to introduce that topic (dep vs devDep) in this video/series yet. Once we get to server-side Node I feel like the difference between dep (e.g. express) and devDep (e.g. nodemon) is crystal clear; but when it comes to front-end tooling the difference feels super blurry. This thread on GitHub has interesting thoughts github.com/webpack/webpack/issues/520

Yep, the "Become a WordPress Developer" course was just updated a few months ago.

@@LearnWebCode udemy should have a buy all button. I have bought your js course, react course, now will buy the wordpress course.

Just change 'contentBase' to 'static'.

@@pedjastojiljkovic7717 Thanks a lot that works.

Hi, the updates that I made to my Udemy WordPress Dev course in 2020 have us now leveraging Hot Module Replacement in our local dev environment. I'd guess in the next week or two Udemy will run a big sale with low prices. Or if you'd like to try and set it up on your own I can point you in the right direction; really it's just a matter of setting up a conditional / if statement in your functions.php file where you enqueue your front-end JS file. If you're running on your local dev domain load the localhost:3000/bundle from the webpack dev server, otherwise/else load the "production optimized" static bundle file.

@@LearnWebCode I have done that. Condition thing but on console Im getting a msg of HMR waiting for response from WDM like this kind of message. Also the url localhost:8080 is redirecting to wordpress default url like localhost/ wordpress/

@@LearnWebCode I'm trying to figuring out how to work properly without reloading in WordPress