Fundamentals of Web Applications

The browser-to-server request path

A web application combines a browser interface, an HTTP service, and usually persistent data. A user action may update local state, send a request, trigger server validation, change a database, and return a representation. Trace that entire path when debugging. HTML supplies document structure, CSS controls presentation, and JavaScript supplies behavior. A rendered button does not establish that its API works. Inspect the actual request method, URL, headers, body, status, and response content before assuming a visual error originates in the browser.

References: COMP 2406 A/B — Fall 2026 course outline · MDN — Overview of HTTP

HTTP, resources, and API contracts

HTTP requests identify a target and an intended operation. Responses contain a status, headers, and optionally a body. Define API contracts around resources and state transitions. A GET should be safe in the protocol sense: it should not be used to request a purchase or deletion. Idempotence means repeating an operation has the same intended effect as performing it once, not that responses must be byte-identical. Choose status codes that describe the outcome, and document request validation and error shapes. JSON is a data format, not automatic validation or authorization.

References: COMP 2406 A/B — Fall 2026 course outline · MDN — Overview of HTTP

JavaScript execution and asynchronous work

JavaScript functions can return before asynchronous work completes. A promise represents an eventual result; await pauses the surrounding async function while other eligible work can proceed. It does not make CPU-heavy synchronous code stop blocking the event loop. Handle rejected promises deliberately and avoid sending a response before required work has completed. Independent I/O operations may run concurrently, but operations with data dependencies must preserve order. Middleware forms a request-processing chain, so a handler must either respond, pass control appropriately, or terminate with a defined error path.

References: COMP 2406 A/B — Fall 2026 course outline · Node.js — The event loop

DOM updates, forms, and validation boundaries

The DOM represents the document that scripts inspect and update. Prefer explicit state and event handlers to scattered mutations that make interface behavior difficult to trace. Client-side validation gives timely feedback, but server-side validation is still required because clients can be altered or bypassed. Treat text from users and remote systems as data when inserting it into the page. Labels, focus behavior, keyboard operation, and error associations matter for usable forms. A successful HTTP response should update the interface from the confirmed result rather than assuming the submitted object was stored unchanged.

References: COMP 2406 A/B — Fall 2026 course outline · MDN — Overview of HTTP

Persistence, sessions, and access control

A data model expresses entities, relationships, and constraints. Validate fields at the API boundary and enforce important invariants in the persistent store when supported. Authentication identifies an actor; authorization checks whether that actor may perform the specific operation on the specific resource. A session identifier links browser requests to server-side state or a validated claim. Protect the session lifecycle, including creation, expiry, and logout, rather than merely showing a login form. Never rely on hiding an interface control to prevent unauthorized database access.

References: COMP 2406 A/B — Fall 2026 course outline · MDN — Overview of HTTP

Worked flow: creating and editing a reading list

Suppose a signed-in user creates a reading list. The server validates the title, obtains the user identity from the trusted session, stores ownership using that identity, and returns the new record’s identifier. On a later update, it checks both the list identifier and ownership before writing. It does not trust an ownerId supplied in the request body. If persistence fails, return an error and preserve the user’s draft. If a request is retried after a timeout, consider a request identifier or another duplicate-prevention design when repeated creation would be harmful.

References: COMP 2406 A/B — Fall 2026 course outline · MDN — Overview of HTTP

Practice & worked answers

Original exercises for this guide.

Public notes & references

Course sources establish the scope above. Reference materials support the explanations; linked lecture notes and books remain with their authors.

• COMP 2406 A/B — Fall 2026 course outline ↗Course scope · Fall 2026
• MDN — Overview of HTTP ↗Primary reference · Public reference; checked 2026-11-05
• Node.js — The event loop ↗Primary reference · Public reference; checked 2026-11-05
• Somayaji — Fundamentals of Web Applications public lectures ↗Public course reading · Fall 2024