JavaScript Tutorial Web Development

Basic Introduction to JavaScript, What Really is !!

Introduction to JavaScript

JavaScript is a programming language that you must use to add interactive features to your website (for example, games, events that occur when we press buttons or enter data in forms, dynamic style effects, animation, and much more. Plus). 

This article will help you to start afresh, beginning with this exceptional language. JavaScript also gives you an idea of ​​possible to do something special with it. For all of those who are interested in the practical use of JavaScript, this article works as a kind of introduction to learning and using this programming language in practice, using its elementary rules.

What is JavaScript?

JavaScript is a powerful programming language and applies to an HTML document. Nowadays, developers or programmers are using to create dynamic interactivity on websites with it. Brendan Eich, the Mozilla project co-founder, Mozilla Foundation, and the Mozilla Corporation, invented JavaScript.

You can do almost anything with JavaScript. You can start with little things like carousels, image galleries, fluctuating layouts, and responses to button presses. With more practical experience, you can create games, 2D animations and 3D graphics, integrated database-based applications, and much more!

Uses of JavaScript

We use JavaScript in one form or another on all pages of this site and several of them specifically to power various web tools and utilities. Some such as QR code generators, symbol converters, compressors, excite visitors’ interest, so we freely share the code used in the Codes section.

This information is primarily designed for hobbyists of web publishing and others without advanced knowledge.  JavaScript, on its own, is fairly thick, but yet very flexible. So, developers have written a lot of tools on top of the heart of the JavaScript language.

JavaScript language aim to unlock a lot of additional functionality with minimal effort. It includes:

  • Browser Application Programming Interfaces ( APIs ) – APIs built within browsers that offer functionality such as dynamically creating HTML content and setting CSS styles to capturing and manipulating a video from the user’s webcam, or generating 3D graphics and samples of sound.
  • Third-party APIs with JavaScript allows developers to incorporate functionality into their websites. Also, incorporate with other web content providers such as Facebook or Twitter.
  • Third-party libraries and frameworks that you can apply to your HTML so you can quickly build and publish sites and applications.

Since this article is an Introduction to JavaScript, just a light introduction to JavaScript, the purpose is not to confuse you. We should not be discouraged at this stage by discussing the difference between JavaScript and the different tools listed above. You can learn all of that in detail later.

Below are some features of the core of the language. You will also play with a few features of the browser API. Have fun!

Example, ” Hello World! »

The section above sounds exciting, and it should be. JavaScript is one of the most interesting online and web technologies. When you start to get good at it, your websites will enter new energy and creative dimension.

However, getting comfortable with JavaScript is a bit more difficult than getting comfortable with HTML and CSS. You should start small and continue to work in small, consistent steps. To get started, we’ll show you how to add basic JavaScript to your page, creating a “Hello World!” as an Example »(the standard/approved examples in basic programming).

How does JavaScript work?

All modern browsers include a JavaScript interpreter or engine, which translates and interprets the instructions written in this language on the pages.

It allows for speed and immediacy that is impossible in other languages ​​such as PHP that run on the webserver.
The browser recognizes JavaScript instructions in two ways:
✔ Inserted inside <script> </script> tags
✔ As attributes of elements preceded by the instruction: “javascript:”
Some examples below:

Simple examples of using JavaScript

The alert () function opens a small alert box in the browser, displaying whatever information you specify.

If we insert it directly into a script element in the following way, it will be executed immediately when the page is loaded.


<script> alert('Message'); </script>

To use it only at the reader’s request, we must use it within another function, which we call in this example “in alert”, which we will call using a link in the following way.


<script> function inialert(){ alert('Hello') } </script> <a href="javascript:inialert();">Test</a>

Another even easier way to do it is to include the function directly in a link, as follows:


<a href="javascript:alert('Hello!');">Test</a>

More Simple examples of using JavaScript

The same function can also be inserted into different elements using the “onclick” event as a trigger.
Two examples, in a button and in a block or container.


<button onclick="javascript:alert('Message!');">Test</button> <div onclick="javascript:alert('Message!');">Block</div>

Try Both:
Block
This method is only useful for simple functions; however, it helps us experiment.
Then instead of a text message, we get the title of this page using the “document.title” object.


<a href="javascript:alert(''+document.title);"> View title </a>

Try: See title
Other JavaScript objects that can be used similarly are:
location.href – Displays the URL of this page.
navigator.appName – Displays the name of the browser.
document.cookie – Sample cookies saved by this site.
document.lastModified – Shows the exact date and time this document was last modified.

Practical uses of JavaScript

With JavaScript, it is possible to perform simple or complex mathematical calculations, all kinds of tasks related to dates, time and time, and other programming functions.
On web pages, it is used mainly for the following tasks:
1- Facilitate the reader to interact with the page’s content through events in buttons, links, blocks, and any other element.

Actions such as scrolling the page, hovering the mouse over any item, executing keystrokes, etc. can also be detected. And based on that, execute certain actions.

It adds dynamism and makes the internet pages more functional.
2- Send or transfer data from the server on the internet without reloading the page using AJAX.
For example, write updates on social networks and receive notifications in real-time, use chat, send and receive messages, upload content from other pages or RSS files, etc.
3- Manipulate the structure of the pages (DOM).
Its functions and methods allow you to modify blocks or isolated elements, delete them, move them, change their style, or add content to them, among other functionalities.
4- Convert the pages into web applications. It is possible to play games, listen to music or video, edit images and other actions, similarly as we do with programs on the computer.

All these functionalities are extended considerably using additional JavaScript Libraries such as JQuery.

Dear visitors and learners, please stay with us for our next series of articles about JavaScript. Please continue reading our Next Articles, where we will guide you in detail, step by step.

About the author

Admin

Admin

Hello World!
I am Mominul Islam, Lecturer in English, blogger, web developer, and entrepreneur. I have started blogging in 2010 and continue writing until 2012. Unfortunately, I left writing a blog for personal emergencies, establishing my web business. After a successful business is established, I can manage some time to write blog posts now. So I have started writing again to get to know the people interested in learning something about website-related issues.

For more details about me and my career, please visit About Mominul Islam

Add Comment

Click here to post a comment