Hello in this HTML Crash Course video, we are going to briefly cover JavaScript and how to use it in your HTML file. JavaScript is a scripting language, which allows you to create dynamic websites. For example, let me show you some fins. So if I go on to this is a website of mine and education platform. If I click logout, I go back to login. Click Login, and I'm going to get rid of the password a second click Login.
This appears error has occurred, please enter your username and password and is highlighted in red. This has been done, or this has been achieved using JavaScript and jQuery as well, which is a JavaScript library but JavaScript because it allows me to do stuff without refreshing the page, which is what something like PHP gammon are covering in this video in this series, but just mentioned in something like PHP, which is a server side language, you will need to refresh. To do something in there, there are ways to get around it using a mixture of scripting or JavaScript to send or make a request to a back end file. Again, that's a bit more complex. So what we're going to do in this video is show you how to use JavaScript. To do that.
All you need to do is do a script tag, script, and in here, put your JavaScript code. And I'm just going to keep it simple, because again, this isn't a video to really teach you JavaScript. When I was separate crash course on JavaScript This video is just simply show you how to use JavaScript in your HTML file. So I'm alert with just open the pop up. This will occur once the page has loaded from 45 I go back to my website refresh. As you can see, this has now popped up, click OK. My website continues.
You might be thinking, Okay, JavaScript, will you use a large JavaScript? If you create a complex website? Yes, you will simply put, you will be using a large JavaScript. So just by CSS, you don't want to put it in a script tag with in your HTML file. And another problem with that is if you have several HTML files, or several files that the user will visit, which you most likely will, you don't want to be duplicating JavaScript code, if it's generic, and you need to use it for every page or multiple pages. And that's the reason you can use a Lincoln method which abstracts your code into a separate file like we did with CSS.
So to do that is create a folder called j s. This is a standard j s. If you would see j s in a web project or a coding project, in general, you will know that it's a JavaScript folder put inside here for index. No, save that index dot j s j. s is the JavaScript extension for it. And you don't have to call any index you can call it wherever you want. And in here, to include a JavaScript file, you simply put correct source equals j s, or whatever your folder name is, slash index dot j s, we do not have a folder and your index or your JavaScript file was where your HTML folder to see this but I do have a folder from left to there. And then you put the closing script tag. This isn't a void element, even though we haven't put anything in between simply because you Hi, post something in between, as you've seen right here, save that, go back to a web browser refresh, and then see 45 appeared, which is this alert right here, click enter, we might have thinking nothing else has appeared.
Simply put, we haven't put anything in there. So I'm gonna put console dot log. And in here, I'm actually not component number, you can put some text like so longer do a mass calculations, only four divided by five, which is 0.8. So save that, if I right click, go to inspect, and go to console. So this is where console logs will appear. And the con the console in your browser is your best friend when doing web development.
Keep your eye on. So refresh, as I said, 45 and 0.8, which is the result of this calculation right here. So that's it. There really isn't much more to use in Java. Script within your HTML file than this, generally speaking, you will want put your JavaScript at the end of your body tag. So you want everything to be here, you would want style sheets to be here.
And then styling simply because usually in dynamic functionality of the website is less important. When the website first loads, what is important is sort of tricking the user to think that the website is loaded by displaying as much as possible, which will be the visual side, then getting the JavaScript loaded afterwards, because let's say for word play takes two seconds to load. And one second of his visual one second abilities JavaScript, you rather have the user wait one second for you to let's say, visually fully load, then one second for the dynamic functionality to be triggered essentially or be available than them have to wait one second for the donor. functionality to be available, then one second, to actually see the website, that'd be two seconds of wait time, one to two seconds really doesn't sound like a lot. But when you're developing websites and you have a lot of code, you have a lot of stuff going on.
These efficiency techniques really, really do matter. And especially when you want users to your website over competitors website, and they are flicking between pages, they don't want to have to be waiting seconds. So that's it for this video on JavaScript. If you have any questions, feel free to post it on my education platform sonar learning co.uk. There will be a link in the description to the source code from this video and the source code from every other video in this series. If you liked the video, please let us know if he didn't let me know as well and I will try and improve it for the next one.
And as usual, thank you for watching. And oh you have a great day JavaScript in