Written by students who passed Immediately available after payment Read online or as PDF Wrong document? Swap it for free 4.6 TrustPilot
logo-home
Class notes

Webtechnology reader

Rating
-
Sold
10
Pages
52
Uploaded on
20-02-2023
Written in
2021/2022

Reader based on lecture notes and PowerPoints over the entire course.

Institution
Course

Content preview

Webtechnologie
Marlinde Drent


Contents
1 Brief history of the web 5
1.1 DARPA (1958) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
1.2 ARPANET (1969) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
1.3 More history . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
1.4 CERN . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
1.5 The three phases of web development . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6

2 Hypertext markup language 7
2.1 Links . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7

3 Newer features of HTML5 8
3.1 New semantic elements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8

4 Standards 10
4.1 Web standards . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
4.2 Device compatibility . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
4.3 Examples of good practice . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
4.4 Web accessibility . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
4.4.1 Perceivable . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
4.4.2 Operable . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
4.4.3 Understandable . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
4.4.4 Robust . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
4.5 Search engine optimization (SEO) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11

5 Cascading Style Sheets: CSS 3.0 12
5.1 Identifiers for id’s and classes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
5.2 Units of measurement . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
5.3 Color declarations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
5.4 CSS selector syntax . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
5.5 Shorthand notation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
5.6 Implementation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
5.7 The standard CSS box model . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
5.8 BEM naming conventions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16

6 Responsive Web Design 17
6.1 RWD step 1: the viewport . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
6.2 RWD step 2: media queries . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
6.3 RWD step 3: images . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17




1

,7 JavaScript 18
7.1 Adding JavaScript to your web page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
7.2 Statements and comments . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
7.3 Variables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
7.4 Functions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
7.5 Hoisting . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
7.6 Data-types . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
7.7 Operators . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
7.8 Loops, if else and switch . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
7.9 Error handling . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22

8 undefined, undeclared, null and NaN 23
8.1 Undefined . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
8.2 Undeclared . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
8.3 Null . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
8.4 NaN . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23

9 DOM 23
9.1 Document object . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23

10 JavaScript Events 24
10.1 Event propagation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24
10.2 Event object . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24

11 Programming Objects in JavaScript 25
11.1 An empty object . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25
11.2 An object literal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25
11.3 Factory function . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25
11.4 Constructor function . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
11.5 Prototypes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26

12 Callback functions 27

13 JavaScript Event Loop 28
13.1 The call stack . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28
13.2 Asynchronous callbacks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28

14 Arrow functions 29

15 eXtensible Markup Language 30
15.1 Name conflicts and namespaces . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
15.2 XML schema . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
15.3 XML on the web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30

16 JSON - JavaScript Object Notation 31
16.1 JSON vs XML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31
16.2 JSON syntax rules . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31

17 URL 32
17.1 URI/URL components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32

18 Unicode 32

19 How the Internet works 33




2

,20 TCP/IP+ 34
20.1 Internet protocol and internet addresses . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
20.2 Transmission control protocol . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
20.3 User datagram protocol . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35

21 Hypertext Transfer Protocol 36

22 Client-Server Architecture 37
22.1 Models of computing . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37
22.2 Rich internet applications . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37

23 The Server-side JavaScripting 37
23.1 Node.JS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37

24 Creating a simple Web-server with Node.JS 38
24.1 Creating a "Hello World!" server . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38

25 Node.js web server workflow 38
25.1 GET method . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38
25.2 POST method . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39
25.3 Response object . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39
25.4 Handling errors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39
25.5 Putting it all together . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40

26 Programming Web-server with Express 41
26.1 Middleware . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41
26.2 Setting up a basic Express.JS app . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42

27 Logging 43

28 Routing 43

29 Serving static files 44

30 Handling errors 44

31 Server-side DB 44
31.1 SQLite . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44

32 Stateful Web 44

33 Cookies 45
33.1 Creating, reading and deleting cookies . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45
33.2 Cookie-based communication through HTTP headers . . . . . . . . . . . . . . . . . . . . . . . 46
33.3 Problems with cookies . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46

34 Session 47
34.1 Sessions in Node/Express.JS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 47

35 AJAX 48
35.1 XMLHttpRequest object . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 48




3

, 36 WebApp Security 50
36.1 A1-2021: Broken Access Control . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50
36.2 A2-2021: Cryprographic Failures . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50
36.3 A3-2021: Injection . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50
36.3.1 Cross-Site Scripting (XSS) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50
36.4 A04:2021 Insecure Design . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50
36.5 A05:2021 Security Misconfiguration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51
36.5.1 Information Leakage through Improper Error Handling . . . . . . . . . . . . . . . . . 51
36.5.2 XML External Entities (XXE) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51
36.6 A06:2021 Vulnerable and Outdated Components . . . . . . . . . . . . . . . . . . . . . . . . . 51
36.7 A07:2021 Identification and Authentication Failures . . . . . . . . . . . . . . . . . . . . . . . 51
36.8 A08:2021 Software and Data Integrity Failures . . . . . . . . . . . . . . . . . . . . . . . . . . 51
36.9 A09:2021 Security Logging and Monitoring Failures . . . . . . . . . . . . . . . . . . . . . . . . 52
36.10A10:2021 Server-Side Request Forgery (SSRF) . . . . . . . . . . . . . . . . . . . . . . . . . . 52




4

Written for

Institution
Study
Course

Document information

Uploaded on
February 20, 2023
Number of pages
52
Written in
2021/2022
Type
Class notes
Professor(s)
Dr. s.a. sosnovsky
Contains
All classes

Subjects

$12.29
Get access to the full document:

Wrong document? Swap it for free Within 14 days of purchase and before downloading, you can choose a different document. You can simply spend the amount again.
Written by students who passed
Immediately available after payment
Read online or as PDF

Get to know the seller

Seller avatar
Reputation scores are based on the amount of documents a seller has sold for a fee and the reviews they have received for those documents. There are three levels: Bronze, Silver and Gold. The better the reputation, the more your can rely on the quality of the sellers work.
MarlindeD Universiteit Utrecht
Follow You need to be logged in order to follow users or courses
Sold
49
Member since
3 year
Number of followers
25
Documents
10
Last sold
1 week ago

4.8

6 reviews

5
5
4
1
3
0
2
0
1
0

Why students choose Stuvia

Created by fellow students, verified by reviews

Quality you can trust: written by students who passed their tests and reviewed by others who've used these notes.

Didn't get what you expected? Choose another document

No worries! You can instantly pick a different document that better fits what you're looking for.

Pay as you like, start learning right away

No subscription, no commitments. Pay the way you're used to via credit card and download your PDF document instantly.

Student with book image

“Bought, downloaded, and aced it. It really can be that simple.”

Alisha Student

Working on your references?

Create accurate citations in APA, MLA and Harvard with our free citation generator.

Working on your references?

Frequently asked questions