Static websites usually come with a fixed number of pages that have a specific layout. When the page runs on a browser, the content is literally static and doesn’t change in response to user actions. A static website is usually created with HTML and CSS

Compared to static websites, which are purely informational, a dynamic website is more functional. It allows users to interact with the information that is listed on the page. Of course, that requires utilizing more than just HTML code.

Examples the two different kind of websites

- Static: https://www.atlassian.com/time-wasting-at-work-infographic

- Dynamic: https://www.facebook.com/

Discuss in class which claim belongs to which type of website:

HTML, CSS, Javascript is used for developing the website.

Same content is delivered everytime the page is loaded.

[In the link is an article with (dis)advantages of both static and dynamic websites.](https://www.spiderwriting.co.uk/static-dynamic.php)

_Show examples of static and dynamic websites_

- HTML defines what the content is.

- CSS defines the appearance of the page.

- JavaScript defines behavior of the page.

- An example about relationship between HTML, CSS and Javascript using a metaphor of building a city: https://blog.codeanalogies.com/2018/05/09/the-relationship-between-html-css-and-javascript-explained/

Let students create a classwork directory and create an index.html along with an app.js. Script tag should be added to the end of body tag(reason for doing so is part of JS2 Week1).

Up until now at HackYourFuture, we have been writing websites using HTML and CSS. Even though a website written with these two languages works just fine, it is only a static page.

1. sending requests over network to servers and fetching a response

1. and this is where JavaScript steps in.

In JavaScript, there are three ways of creating variables.

- Variable (Re)Assignment

- Variable assignment means throwing away the old value of a variable and replacing it with a new one. Initialization can be thought of as a special way of assignment.

console.log(lastName);

1. Create 2 variables using the `let` keyword

1. make 1 variable contain your first name

1. the first variable should contain the city you currently stay at

1. come up with a value for the second variable yourself

Any application written in any programming language requires data or information to work with. This information can be as simple as a string, number or complex types like a list of strings, a mix of strings and numbers etc.

For example, your name and age are simple pieces of information, a string and a number respectively. On the other hand, your house address could be considered as a complex set of information including house number, street name, city, postcode and country.

Variables are simply named storage/pointer for this information.

Primitive data types are typically types that are built-in or basic to a language implementation.

There are 5 different types of data. The compiler/computer interpretates all the variables we make as one of those datatypes.

Number — integers, floats, etc

String — an array of characters i.e words

?? Symbol — a unique value that's not equal to any other value ??

* `string`, e.g. "HackYourFuture"

* `number`, e.g. 5, or 10.6

* `boolean`, e.g. `true` or `false`

let x = 5;

let typeOfX = typeof x; // -> "number"

In this way we can store a lot of data in a compact way, while the computer/compiler knows how to interpretate the 1's and 0's/

* `array`\*, e.g. `[1, 2, 3]` or `['what', 'is', 'your', 'name']`

* `object`, e.g. `{name: 'John', age: 24}`, or the special object `null`