Lecture on JavaScript

Jul 7, 2024

Lecture on JavaScript

Course Overview

  • This course will cover project-based JavaScript topics:
    • Digital clock
    • Stopwatch
    • Calculator
    • Rock paper scissors game
    • Image slider
    • Weather app using an API

Introduction to JavaScript

  • JavaScript is used for dynamic and interactive web pages.
  • Runs on web browsers (Chrome, Safari, Edge, etc.).
  • Transforms HTML and CSS elements into functioning components via dynamic behaviors.

Setting Up the Development Environment

Text Editor

  • Recommended: VS Code (code.visualstudio.com)
  • Create a project folder
    • HTML file: index.html for homepage
    • CSS file: style.css for styling
    • JavaScript file: index.js for interactivity

Initial HTML Setup

  • Use ! + tab in VS Code for boilerplate HTML.
  • Change <title> to desired page title.
  • Link CSS using <link rel="stylesheet" href="style.css">
  • Link JavaScript using <script src="index.js" defer></script>

Live Server

  • Install live server extension in VS Code.
  • Use it to auto-refresh the web page on file saves.