Gist of JS
If you are a beginner in field of web development or a professional, you must know that any webpage requires three key languages…HTML, CSS & JavaScript.
Think of HTML as the skeleton, the basic structure of a webpage. CSS is the skin on top of the skeleton i.e., the formatting of webpage whereas JavaScript (known as JS in short) is how the skeleton moves meaning how the user interacts with webpage.
We can also co-relate this with the help of English sentence. Let’s take a sentence:
A green dinosaur is jumping.
Dinosaur == noun (HTML)
Green == adjective (CSS)
Jumping == verb (JavaScript)
So what really is JavaScript? Let’s dive in…
About JavaScript
JavaScript is a programming language that can be used on both the server side and the client side of applications. What’s that? Well…
The server side of an application is the backend logic that usually runs on computers in data centers and interacts with database.
The client side is what runs on the device of the user.
When you open a webpage, it may ask you to accept cookies. If you click ok or just deny it, the popup will disappear. That’s JavaScript in action.
How does the browser understand JavaScript?
JavaScript is sometimes referred as the scripting language. Scripting language is a programming language. But a program written in C programming language needs to be compiled before it can be run, while JavaScript does not have to be compiled.
JavaScript code contains a series of commands that are interpreted one by one at runtime (instead of running after compiling). The 'engine’ that understands JavaScript is called interpreter.
Since JavaScript has been introduced, there have been many specification or standardization for it.
Adding JavaScript to a webpage
There are two ways to link JavaScript to a webpage:
- Directly in HTML
Here, I have added JavaScript code in the <script> tags. This is how you can mention the code directly in HTML.
- Linking an external file to our web page
This is considered as a better practice as it organizes the code better and avoids lengthy HTML pages.
Make sure that you put the files in the same location or specify the path to your JavaScript file precisely. The names are case-sensitive and should match exactly.