Javascript is too vast, You can write the same thing multiple ways using JavaScript. That makes it hard to learn for new people.

Now Javascript is used everywhere, In front-end, back-end, mobile app development, desktop app development, and machine learning. I feel JavaScript Developers have a good future.

If you have taken the decision to learn javascript, You are on the right path. If you are confused about what to learn first, where to start and how to start you are at the right place.

Here is the best way to learn JavaScript without confusion and limited time (Step by step guide).

1. First Learn the basics of HTML and CSS

JavaScipt was invented to use in the front end to make the website dynamic without reloading the page and performing DOM Operations.

HTML and CSS are the base of every website. At the front end, javascript is used with HTML and CSS.

So to start with JavaScript First learn basics of the HTML so you will know the real use of javascript, and why developers use javascript.

2. Learn the Basics of JavaScript

After knowing how to design a web page, Learn the following basics things:

1. Variables
2. Data Types
3. Functions
4. Events
5. Method chaining
6. Loops
7. Conditions

3. Perform simple DOM Operations

DOM(Document Object Model) is a programming interface for web documents. It represents the structure of web pages. If you don't know about DOM you can learn it here.

JavaScript was mainly invented to perform DOM operations. So to start with JavaScript first learn how to perform basic DOM operations using JavaScript.

Here are a few operations you can try:

• Select the div
• Change the content of the div
• Perform events on the button
• Change the style of elements
• Add events logic like mouse move, button click, scrolling events, etc.

After learning this you have completed the first phase of learning JavaScript. Now its time to go for advanced JavaScript

4. Intermediate Phase

Now you know how to manipulate the document using JavaScipt. Now it's time to power the website using JavaScript.

Learn the following things:

• Learn about APIs
• Fetch data from the backend without reading the web page using Fetch or Axios
• Add and remove elements from the document
• Learn to use third-party libraries like Charts or animation libraries
• Fetch data from APIs and load it dynamically from the document

5. Advance Phase

Now you have learned 80% of JavaScript, But the next 20% will take the same time to learn that took to learn the first 80%.

And these last 20% of topics make top developers and many people stop learning because of this.

Here are the topics to learn to become a complete JavaScript Developer:

• Async/Await
• Callbacks
• Promise
• Closure
• Arrow functions
• Objects

That's it. You are ready to build mini projects. In the journey, you will find many ideas and new topics to learn.

JavaScript is not difficult as people think, If we learn it step by step with well planning it is easy to learn.

To make your work easier I have created a Front-End Developer Roadmap there you will learn Front-End Development in 3 phases.

I have mentioned important topics in sequence with the best resources to learn those topics.

Here is the link to Complete Roadmap: Link