JavaScript Day 1: Start Your 10-Day Challenge

#javascript #webdev #programming #learning

📅 Day 1: JavaScript Basics & Setup
Welcome to Day 1 of your JavaScript Learning Challenge! Today, we’re laying the foundation by understanding what JavaScript is, how to add it to your webpage, and how to use basic syntax to interact with the browser console.

🚀 What is JavaScript?
JavaScript (JS) is a programming language used to add interactivity and dynamic behavior to websites. It allows you to build responsive web applications, handle user actions, and manipulate content without reloading the page.

🔗 How to Add JavaScript to HTML
There are 3 main ways to include JavaScript in your HTML file:

✅ Inline JavaScript

<button onclick="alert('Hello!')">Click Me</button>

✅ Internal JavaScript
Use a script tag inside your HTML file:

<!DOCTYPE html>
<html>
  <head>
    <title>My First JS</title>
    <script>
      console.log("This is internal JS");
    </script>
  </head>
  <body></body>
</html>

✅ External JavaScript
Recommended for cleaner code and reusability:

<!-- index.html -->
<script src="script.js"></script>

// script.js
console.log("Hello from external JS file!");

🧾 Basic Syntax to Know
✅ console.log()
Outputs information to the browser console.

console.log("Hello, JavaScript!");

✅ Comments


// This is a single-line comment

/*
This is a 
multi-line comment
*/

✅ Variables

let name = "Dev.to";
const age = 24;
var color = "Blue";
console.log(name, age, color);

Use let and const over var in modern JavaScript.

✅ Mini Task: Console Identity Card
Create a script that prints the following info to the browser console:

Your name

Your age

Your favorite color

Example:

let name = "Smriti";
let age = 24;
let favoriteColor = "Teal";
console.log("Name:", name);
console.log("Age:", age);
console.log("Favorite Color:", favoriteColor);

👉 Open your browser’s DevTools > Console to see the output.

❓ Interview Questions (Day 1 Topics)
Here are 5 commonly asked questions related to JavaScript basics:

What is the difference between let, const, and var?
How do you include JavaScript in an HTML file? Name all three methods.
What is the purpose of console.log() in JavaScript?
What are the main data types supported by JavaScript? (Hint: string, number, boolean, null, undefined...)
What is the difference between single-line and multi-line comments in JavaScript?

🎉 You’ve completed Day 1!
Tomorrow we’ll explore JavaScript Data Types & Operators.

🧠10-Day JavaScript Learning Challenge - Day1

Subscribe to my newsletter

Smriti Singh

Smriti Singh