What is Javascript

What is JavaScript? JavaScript is the most popular programming language in the world and is often called a scripting language because it doesn't need a compiler. A compiler is a translator, a software that translates our English words that we use in programming languages to machine code, which are zeros and ones. JavaScript does not need that. JavaScript is actually interpreted right there in the browser. JavaScript controls the browser. It lives on the browser. Everything it does is in the browser. You cannot save JavaScript and take it with you like you do with other programming languages. Now, because we can take it with us, that means that JavaScript is not powerful. Wrong JavaScript is a full programming language that is very powerful. It is very high in demand right now for jobs and JavaScript. You can do anything with JavaScript. Don't let people tell you that you cannot. It's actually one of the most popular languages in the world, but it's actually one of the most powerful languages in the world. Programming languages, don't get me wrong, right? It's also used with servers to load information from your servers super fast. Right Now, let me just give you an example. If you go to Google and you start typing in a keyword, let's say for example, you type in JavaScript and all of a sudden you get some keyword suggestions from Google. What do you think Google is getting those keywords from? It's getting it from the database and what do you think is using is using JavaScript along with Ajax to get you that information and display it to the user. JavaScript is really powerful. The only thing that you need for JavaScript to run JavaScript is a browser. If you have a browser, you are good to go a browser in a simple code editor like just notepad. Even though I don't recommend Notepad, you can just grab your notepad right now if you are on a Windows machine and you can go ahead and save it as a dot HTML file, for example, example dot HTML and then you can just write a simple little function like alert, an alert function, and all of a sudden you have JavaScript running. You open that file in your browser and JavaScript starts running right there because JavaScript lives in the browser, it works in the browser and that is its home. All right. That's all you need. Now another misconception with Java script is that is often that is related to Java. It is not Java. It's actually really far away from Java in the sense that the syntax is very different. All right. JavaScript works in the browser. Java is a general purpose language. You can use it for many different things. All right? It's not more powerful or less powerful than Java. They work totally different. So anyways, that's another topic. I just wanted to introduce you to JavaScript and let me show you. Let me demonstrate you how you can use JavaScript right now in your computer. So let's go ahead to the code and let's start doing this. All right. So the first thing that we need is a code editor to run JavaScript. All right? And the reason why we need a code editor is because we need to save a file and we need to include JavaScript in that file. So let's go and open up a window for our code editor, if I can find one here. And. That's it, right? If you have a Windows machine, you can grab your notepad. And if you don't have a co-editor, that is. But if you do, just open it up. And if you don't, don't worry. I'm going to give you a video on how to get one. A lecture. So I'm going to save this file to my desktop and I'm going to name it example dot HTML, make sure that you put that extension. All right. So it's an HTML document and I'm going to put some I'm going to format it as an HTML five. I don't have to. I can run JavaScript with any format, even the old HTML code, it doesn't really matter. JavaScript is been around for a while. So the first thing that I need to do is include a script tag. Right. Just like an HTML tag. We open it and then we close it. Once we have the script tag, then we can run JavaScript. I'm just going to make. I'm going to call a simple function called alert. And this function is built in to the browser. So any browser that you use that is a normal browser. And I'm not talking about any, you know, custom made browser, any normal browser like Firefox, Chrome, Opera or Safari will display the same thing. Hello from the body if you run this function. All right. And if I go here, let's see if it opens up. I might have a browser right here. Okay. So I'm just going to. Opening the browser right here. All right. And this is actually right here on my other monitor for some reason. There we go. That's where it was. I'm sorry. So let's just refresh again. And as you can see here, hello from the body. We're going to get a pop up box like this in every browser that you execute this function. Why? Because JavaScript is built into the browser already. We don't need to run any special programs or anything, any software compiler, anything to run JavaScript. It does it right there on the browser. So this is one way of actually embedding JavaScript with a script tag and you can use it over here also on the head of the document. As you can tell right here, we were using it in the body, but you can use it in the head anywhere you want. And actually let's just say that this one is from the head right here. Just to give you an idea how this runs. And as you can see here, if I refresh, I get the first one. And until I click here, it doesn't give me the next one. So it goes from top to bottom. All right. Programming languages do that. They work from the top to the bottom. So this one is going to execute first and then this one is going to follow. Now, this is not the right way of actually including JavaScript. Sometimes you do need to include JavaScript in your HTML like this, but the right way of actually doing this is by making an external script. JavaScript file. I'm going to copy this and show you what I mean. I'm going to paste this. I'm going to rename it to script Dot JS and that is now officially a JavaScript file. As you can see here, my computer is already giving me a little JS icon there. Right, A little word. I'm going to drag this in here. I'm going to press command A on my Mac. You can press if you're using Windows control A and then delete it, Save it command or control S. All right. So we have the JavaScript, but we have no functions here. We have nothing here that we need, we can use. Another thing is that we need to link that file to our HTML file so that way it works. The way we do that is the same way we do with Stylesheets. We come here to the head or the bottom of the document. In this case, we're going to use the head. We're going to write a script, a normal script tag and see. And then the path of that document. Right now, that document is right here. This is where the file is right now. So it's in the same path as that example, the HTML. So I'm not going to write a path. I'm just going to write the name of it, Script.js. And let me just go ahead and write a function here that is the same function, but I'm just going to say something different so you can see it from the external. File. There we go. All right. So if I go to my browser now and I refresh, I'm going to get this Hello from the from the external file. Hello from the head. Hello from body. All right. And the reason why that is executing first is because it's right here. If I move this all the way down to here, you can guess what is going to happen. Refresh from the head, refresh from hello from body and from the external file. All right. It's going to execute last because we are placing it all the way in the bottom. Now, let me just give you a quick tip. Now, let's say, for example, if you have that document and let me just I'm going to comment this actually, I'm going to take this off. And if for some reason you have some text right here. You know, I'm just giving you an example. If you've got some some let's actually make some paragraph tag right here. I'm going to put some text here. All right. So, for example, you have some. Content there and you refresh, you won't be able to see your content. In your file unless this function is executed. So sometimes, as you can see there, when I click yes, it's available. Sometimes it's better to actually grab the script tag and put it all the way in the bottom of the document. If I refresh, then I can see the document. All right. So that's one way of actually being able to see your content before you execute the functions and the JavaScript functions, right? So make sure that you link this all the way in the bottom of your document. Most of the time that's what I do. I link all my files all the way in the bottom there, unless it's a Google Analytics or something that requires me to put it in the head or something that is not going to affect how my content is displayed or how long my page is going to take to load, because it really depends on that. If you put a lot of script tags and a lot of code here on the head of your document is going to take a long time for your page to load. So keep that in mind when you are linking files. All right. So anyway, thank you so much for taking the time to watch this lecture and I'll see you on the next lectures.