Introduction to JavaScript

We introduce JavaScript and compare it with Java. The focus is on syntax, functions, and basic data structures like arrays and objects. If time permits, we will also briefly introduce DOM manipulation and events, so we can start changing the content of a webpage and make it interactive.

Before class

Practical requirements

• Download VS Code: https://code.visualstudio.com/Download
• Install plugins for VS Code:
  • ESLint: https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
  • Live Server: https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer
  • Prettier: https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode

Recommended reading and videos

• Syntax, datatypes and functions:
  • https://javascript.info/hello-world
  • https://javascript.info/types
  • https://javascript.info/variables
  • https://javascript.info/while-for
  • https://javascript.info/function-basics
  • https://javascript.info/object
  • https://javascript.info/object-methods
  • https://javascript.info/array
• DOM:
  • DOM search: https://javascript.info/searching-elements-dom
  • DOM manipulation: https://javascript.info/styles-and-classes
  • Eventlistener: https://javascript.info/introduction-browser-events#addeventlistener

Extra resources

• MDN web docs: https://developer.mozilla.org/en-US/docs/Web/JavaScript
• JavaScript overview: https://javascript.info
• JavaScript quickstart: https://learnxinyminutes.com/javascript/

During class

We will use these 📄 JavaScript introduction (PDF) and you will have time to do the exercises.

Demos used in class:

• TBD

After class

Finish the exercises.