Javascript 101

the Basics to get you started with Javascript, the language of the browser

Javascript 101

JavaScript (JS) is a powerful and versatile programming language that adds interactivity and dynamism to web pages. It's one of the three core languages of web development, alongside HTML and CSS. This guide will walk you through the fundamentals of getting started with JavaScript.

Starters

While not essential, having a basic understanding of HTML and CSS will prove beneficial as you learn JS. Familiarity with these languages will help you grasp how JS interacts with web page structure and styling.

There are two approaches to running JavaScript code:

  1. The Browser Every modern web browser has a built-in JavasScript engine. This allows you to write and test simple JS code directly within the browser's developer console.
  2. Node.js Environment For more complex projects or running JS outside the browser, you can install Node.js on your computer. Node.js provides a runtime environment for executing JavaScript code outside of a web browser.

if this is your first time learning JavaScript, we reccomend you to use the Browser Approach

In-Browser Development:

  • Open your web browser and navigate to the developer console. This can usually be accessed by pressing F12 or right-clicking anywhere on the webpage and selecting "Inspect" or "Inspect Element."
  • Locate the developer console tab, which is typically where you can interact with the webpage's code.

devtools this is what a devtools console should look like

Your First JavaScript Program: Hello World!

Let's write our first JavaScript program to display the classic "Hello World!" message.

in your devtools console type the following

console.log("Hello World!");

the console.log function is used to print messages to the console

console.log

There you go! your first javascript code! to continue on, you can look up tutorials online or look at the Javascript documentations