What is the best way to learn JavaScript
Published: 2024-01-04 17:24:46

## What is the best way to learn JavaScript

I am a self-taught Web Developer and I say – **The Best way to learn JavaScript is to learn by yourself**.
All you need is Passion with some topping of Craziness and Hunger of Learning to implement things in your own way.
Stop mastering the syntax instead learn the basics. The same goes with any other programming language/web script, the learning process of JavaScript should be started from the beginner level to the Intermediate level and then finally the Advanced level.

> Mistake which Developers do:

many JavaScript beginners make mistakes that they keep on reading JavaScript tutorials one by one, and do not implement any of them. This way of learning is totally wrong.
beginners should read one tutorial and then implement what the tutorial has taught them, in their own code. This will make them understand the code correctly, otherwise I guarantee they will forget what they just read within the next 30 minutes or before.

> Your First JavaScript Tutorial

Suppose you started with your **First JavaScript Tutorial** which displays the current date.

The JavaScript Code for this is:

```
1. <button type="button" onclick="alert(Date())"> 
2.     Click me to display Date and Time 
3. </button>
```
After reading this tutorial **you should** implement it on your computer. Below are the **implementation steps** you should follow:

1. Create a new web page.
2. Add the button and the onclick event to it.
3. Add the alert to show the date.
4. Run the web page on your browser to test the feature you just created.
Now you know how to implement your code.

> Which Editor should I use for JavaScript
> 

As a beginner, you will also ask how to write JavaScript code. You can use your Windows Notepad, or you can download Notepad ++ which is a very good editor.
However, the best Editor according to me would be **[Visual Studio Code](https://code.visualstudio.com/)** which is very lightweight just **45 MB in size**, and very-very powerful too. It is totally free of cost and runs on **every operating system** – **windows, linux & mac**.

***What should be covered on the Beginners level of JavaScript***

*The topics which you should cover are –*

1. JavaScript Syntax - [JavaScript Syntax](https://www.w3schools.com/js/js_syntax.asp)

2. Variables - [JavaScript Variables](https://www.w3schools.com/js/js_variables.asp)

3. Data Types - [JavaScript Data Types](https://www.w3schools.com/js/js_datatypes.asp)

4. Operators - [JavaScript Operators](https://www.w3schools.com/js/js_operators.asp)

5. Arithmetic Operations - [JavaScript Arithmetic](https://www.w3schools.com/js/js_arithmetic.asp)

6. Assignment - [JavaScript Assignment](https://www.w3schools.com/js/js_assignment.asp)

7. JS Output - [JavaScript Output](https://www.w3schools.com/js/js_output.asp)

8. Objects - [JavaScript Objects](https://www.w3schools.com/js/js_objects.asp)

9. Break & Continue - [JavaScript Break and Continue](https://www.w3schools.com/js/js_break.asp)

***Examples of JavaScript Programmes for Beginners***

*I would also like to list some programmes which Beginners should implement.*

1. **Create a program** where user inputs 2 int values in 2 input boxes and you display the greatest of them on the alert box, when a button is clicked.

2. **Create a program** where user enters a number in a text box and you should display its table (upto 10) on a div. The table should be created on the button click event. Also prevent user to enter string on the text box (give appropriate error on alert box when input is string).

3. **Create a small form** for Job Application. It should have 5 fields – name, age, education, address and expected salary. These 5 fields should have HTML controls where user enter his/her information, there should be a button which on clicking shown the user information on a div control.

4. **Finding whether** a number is **prime number or not**.

5. **Create a calculator** with a common function – add, subtract, divide & multiply

***What should be covered on the Intermediate level of JavaScript***

**1. AJAX**

a. [AJAX Introduction](https://www.w3schools.com/xml/ajax_intro.asp)

b. [AJAX Database](https://www.w3schools.com/xml/ajax_database.asp)

c. [XML Applications](https://www.w3schools.com/xml/ajax_applications.asp)

**2. Functions**

a. [Arguments object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments)

b. [Arrow functions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)

c. [Default parameters](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Default_parameters)

d. [Method definitions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Method_definitions)

e. [Rest parameters](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters)

f. [getter](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/get)

g. [setter](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/set)

h. [async function](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function)

**3. Working with Classes**

a. [class](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/class)

b. [constructor](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/constructor)

c. [extends](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/extends)

d. [static](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/static)

4. J[avaScript Cookies](https://www.w3schools.com/js/js_cookies.asp)

***What should be covered on the Advanced level of JavaScript***

When you are on the Advanced level, this means you basically know how to work on JavaScript. In the Advanced level you have to deal with integration of JavaScript with applications created on Python, Ruby, PHP, ASP NET etc.

Here your job would be to make features on JavaScript that communicate efficiently with the Server technology like databases, Python, Ruby, PHP, [ASP.NET Core](https://www.yogihosting.com/category/aspnet-core/), etc

**Some examples of advanced features made with JavaScript are:**

1. **Partially updating parts of a web page from database** every few seconds using AJAX.

2. **Get and show real-time stock prices** on the page. You can get the stock price by implementing the API with your JavaScript code.

3. **Creating interactive feature** in your website so that conversion rates increases. Example can be an **[autocomplete](https://www.yogihosting.com/jquery-autocomplete/) [](http://www.yogihosting.com/jquery-autocomplete/)**feature which you can create with JavaSript.

4. **External API implementations** like **[TMDB API](https://www.yogihosting.com/implement-tmdb-api-with-jquery-ajax/)** in your JavaScript and helping users to get details of any movie, actor & series


**Conclusion**

My advice is that don't try to live in a hurry about programming. Learn enough to build a skeleton project and then Google and read for things that you need.
> You will need a good patience to learn JavaScript just like this guy:
> 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/szmfdmk9gsng9mpne55z.jpeg)

I hope you like my **answer**

Subscribe to our newsletter now and receive your free **JavaScript roadmap** directly in your inbox. Stay connected with the ever-evolving world of technology—one newsletter at a time! [Subscribe here](https://uccodejavascript.ck.page/e27a96062c)