JavaScript

Why learn JavaScript ❓ #

  • JavaScript powers the majority of the web applications we see today. The scope of JavaScript has evolved from web applications to mobile and desktop applications and even game development.
  • The basic understanding of JavaScript will help you build web applications using frameworks like Vue, Next JS, mobile applications using React Native and desktop applications using Electron JS.

🎓 Take Away Skills #

After completing this learning path you will be knowledgeable in:

  • Operators and Data Types
  • Loops and Conditional Statements
  • Functions in JavaScript (Arrow Functions)
  • DOM Manipulation
  • ES6
  • Asynchronous JS
    • Promises
  • Event Loop
  • Use of APIs

🛠️ Prerequisites #

🧑🏻‍💻 Programming Knowledge #

You don’t need any pre-requisite knowledge for the first half of this learning path. However, a basic knowledge of HTML and CSS is required for the second half of the learning path.

You can check out the Web 101 to learn about HTML and CSS.

📲 Installation and Setup #

You need a code editor,browser and Node.js to follow along this learning path. You can choose the code editor and browser of your choice. The preferred ones are listed below:

  • VS Code

    Light-weight code editor by Microsoft with a large ecosystem of plugins to help your workflow

    Install VS Code

  • Google Chrome

    A browser based on V8 JavaScript engine with developer tools.

    Install Google Chrome

  • Node.js

    JavaScript runtime which helps you run JavaScript programs in your system.

    Install Node

    Note: Install the stable version

💡 Learning Session #

Basics of JS #

🎓 Topics to Learn

- Variables, Data Types and Operators
- Strings and Template Literals
- Math and Boolean Logic
- Loops and Functions
    - Arrow Functions
- ES6

🧑🏻‍💻 Learn from

Video Tutorials

Articles/Blogs

🛠️ Get into action

  • Both of the above mentioned resources include a lot of activities. Try those activities to get a better understanding of JavaScript

JavaScript in the Web #

🎓 Topics to Learn

- DOM
- Browser Events and Event Listeners
- Callback and Event Loops
- DOM Manipulation
- JSON
- How to use APIs

🧑🏻‍💻 Learn from

📽️ Videos

Note: You can refer the JavaScript for beginners to learn about promises.

📄 Articles/Blogs

🛠️ Get into action

A few projects you can build to implement the concepts you have learned above:

  • A simple counter with two buttons(+,-) where the user can increase or decrease the value when the respective buttons are clicked.
    • You will get an understanding of DOM Manipulation, Event Listeners
  • Build a project using any APIs:
    • Create a web app to translate English to any other language. You can check out Fun Translations API for some interesting languages.
    • Create a web app to to display the current weather using Weather API.
      • You can checkout Public APIs for a list APIs and try to build some cool projects with it.
    • You will get an understanding about Fetch, Promises, Async/Await

🔖 Resource Pool #

You can checkout these additional resources to learn more about JavaScript

📄 Articles/Blogs #

📽️ Videos #

📚 Books #

🚀 Project Pool #

Here are few project ideas you can try out, these are just an inspiration to get started. Try to learn and build ideas that come to your mind.

  • Create a color palette generator
  • Build a countdown timer for your next birthday
  • Create a web app to display the details of your GitHub profile using GitHub API

Try out multiple JavaScript packages and libraries available and create interesting projects

Created with 💙 by Advaith U & TinkerHub