Why Deno's HTTP server uses web standards - Visual Breakdown

Concept Flow - Why Deno's HTTP server uses web standards

Start HTTP Server

↓

Receive HTTP Request

↓

Parse Request using Web Standard Request

↓

Process Request

↓

Create Response using Web Standard Response

↓

Send Response

↓

Wait for Next Request

The server starts, waits for requests, uses web standard Request and Response objects to handle them, then sends responses and repeats.

Execution Sample

Deno

import { serve } from "https://deno.land/std/http/server.ts";
serve(req => new Response("Hello World"));

Starts a simple HTTP server that replies with 'Hello World' using web standard Request and Response.

Execution Table

Step	Action	Input	Output	Notes
1	Server starts	None	Listening on port	Server is ready to accept requests
2	Receive request	HTTP GET /	Request object	Request is parsed as web standard Request
3	Process request	Request object	Response object	Handler creates Response using web standard Response
4	Send response	Response object	HTTP 200 OK with body 'Hello World'	Response sent to client
5	Wait for next request	None	Listening	Server loops to accept next request

💡 Server runs continuously until stopped manually

Variable Tracker

Variable	Start	After Step 2	After Step 3	After Step 4	Final
Request	undefined	Request object with method GET	Request object	Request object	Request object
Response	undefined	undefined	Response object with body 'Hello World'	Response sent	Response object

Key Moments - 2 Insights

Why does Deno use web standard Request and Response objects instead of custom ones?

Using web standards means code is familiar to web developers and compatible with browser APIs, as shown in execution_table step 3 where the Response is created using the standard Response object.

How does using web standards improve code reuse?

Because the Request and Response objects follow web standards, you can reuse code and libraries designed for browsers or other environments, as seen in the variable_tracker where the Request and Response objects behave like browser objects.

Visual Quiz - 3 Questions

Look at the execution_table step 3, what type of object is created to respond to the request?

A A web standard Response object

B A custom Deno-specific Response object

C A plain string

D An HTTP status code only

💡 Hint

Refer to execution_table row 3 under Output and Notes columns

At which step does the server parse the incoming HTTP request into a web standard Request object?

A Step 1

B Step 2

C Step 3

D Step 4

💡 Hint

Check execution_table row 2 under Action and Output columns

If Deno did not use web standards, what would be a likely downside?

A It would automatically support all browsers

B Server would run faster

C Code would be less familiar and harder to reuse across environments

D It would not need to parse HTTP requests

💡 Hint

See key_moments about benefits of web standards

Concept Snapshot

Deno's HTTP server uses web standard Request and Response objects.
This makes server code familiar and reusable.
Server listens, parses requests as standard Request,
creates standard Response, sends it back.
This aligns server code with browser APIs.

Full Transcript

Deno's HTTP server works by starting a server that listens for HTTP requests. When a request comes in, it is parsed into a web standard Request object. The server code processes this request and creates a web standard Response object to send back. This approach uses the same Request and Response objects that browsers use, making the code easier to understand and reuse. The server then sends the response and waits for the next request. This cycle continues until the server is stopped. Using web standards helps developers write code that works well across different environments and is familiar to those who know web APIs.

Practice

1. Why does Deno's HTTP server use web standards like the Fetch API?

easy

A. To make server code familiar and easier to share with client code

B. To force developers to learn a new, unique API only for Deno

C. To improve server speed by using non-standard protocols

D. To prevent compatibility with browsers and other runtimes

Solution

1. Step 1: Understand the use of web standards in Deno

   Deno uses web standards like the Fetch API so developers can write code that feels familiar from the browser environment.

2. Step 2: Recognize the benefit of sharing code

   Using the same APIs on server and client makes sharing code easier and reduces bugs caused by different APIs.

3. Final Answer:

   To make server code familiar and easier to share with client code -> Option A

4. Quick Check:

   Web standards = Familiarity + Sharing [OK]

Hint: Web standards mean same code works client and server [OK]

Common Mistakes:

• Thinking Deno uses unique APIs only
• Believing web standards slow down the server
• Assuming web standards prevent browser compatibility

2. Which of the following is the correct way to create a basic HTTP server in Deno using web standards?

easy

A. import { createServer } from "deno_http";
createServer((req, res) => res.end("Hello"));

B. import http from "deno_http";
http.createServer((req, res) => res.send("Hello"));

C. import { serve } from "https://deno.land/std/http/server.ts";
serve(() => new Response("Hello"));

D. import { listenAndServe } from "deno_std";
listenAndServe((req) => "Hello");

Solution

1. Step 1: Identify the official Deno HTTP server import

   Deno's standard library provides the 'serve' function from "https://deno.land/std/http/server.ts" which uses web standards.

2. Step 2: Check the server creation syntax

   The correct syntax is calling serve with a handler function returning a Response object, matching web standards.

3. Final Answer:

   import { serve } from "https://deno.land/std/http/server.ts"; serve(() => new Response("Hello")); -> Option C

4. Quick Check:

   Use 'serve' + Response for Deno HTTP server [OK]

Hint: Use 'serve' from Deno std with Response object [OK]

Common Mistakes:

• Using Node.js style imports or APIs
• Calling res.end or res.send which are not web standard
• Importing from incorrect or non-existent modules

3. What will the following Deno HTTP server code output when accessed?

import { serve } from "https://deno.land/std/http/server.ts";
serve(req => {
  if (req.method === "POST") {
    return new Response("Posted!");
  }
  return new Response("Hello World");
});

medium

A. Always responds with "Posted!"

B. Responds with "Hello World" for GET and "Posted!" for POST

C. Throws an error because method check is invalid

D. Responds with "Hello World" for POST and "Posted!" for GET

Solution

1. Step 1: Analyze the request method check

   The code checks if the request method is "POST" and returns "Posted!" in that case.

2. Step 2: Understand the default response

   If the method is not "POST", it returns "Hello World". So GET requests get "Hello World".

3. Final Answer:

   Responds with "Hello World" for GET and "Posted!" for POST -> Option B

4. Quick Check:

   POST = "Posted!", others = "Hello World" [OK]

Hint: Check req.method to decide response text [OK]

Common Mistakes:

• Assuming all requests respond with "Posted!"
• Thinking method property is invalid or missing
• Mixing up POST and GET responses

4. Identify the error in this Deno HTTP server code snippet:

import { serve } from "https://deno.land/std/http/server.ts";
serve(req => {
  req.respond({ body: "Hello" });
});

medium

A. Using req.respond is incorrect; should return a Response object

B. Missing await keyword before req.respond

C. serve function is not imported correctly

D. Response body must be a Uint8Array, not a string

Solution

1. Step 1: Check the method used to send response

   The code calls req.respond, which is from older Deno APIs and not compatible with the web standard serve function.

2. Step 2: Understand the correct response pattern

   In the current Deno HTTP server, the handler must return a Response object instead of calling req.respond.

3. Final Answer:

   Using req.respond is incorrect; should return a Response object -> Option A

4. Quick Check:

   Return Response, don't call req.respond [OK]

Hint: Return Response object, don't call req.respond [OK]

Common Mistakes:

• Using old Deno APIs with new serve function
• Forgetting to return a Response
• Confusing async handling with req.respond

5. How does using web standards in Deno's HTTP server help reduce bugs when sharing code between client and server?

hard

A. Because web standards prevent any runtime errors

B. Because Deno automatically converts server code to client code

C. Because web standards force all code to be synchronous

D. Because both environments use the same APIs, reducing differences and surprises

Solution

1. Step 1: Understand the role of shared APIs

   Using the same web standard APIs on client and server means developers write similar code for both sides.

2. Step 2: Recognize how this reduces bugs

   When APIs match, fewer surprises happen due to different behaviors or missing features, reducing bugs.

3. Final Answer:

   Because both environments use the same APIs, reducing differences and surprises -> Option D

4. Quick Check:

   Same APIs = fewer bugs [OK]

Hint: Same APIs client/server means fewer bugs [OK]

Common Mistakes:

• Thinking Deno converts code automatically
• Believing web standards force sync code
• Assuming web standards eliminate all runtime errors