Why Deno Deploy enables edge computing - See It in Action

Why Deno Deploy Enables Edge Computing

📖 Scenario: You are building a simple Deno Deploy project to understand how edge computing works by running code close to users worldwide.

🎯 Goal: Create a Deno Deploy script that responds with a message showing the user's location and demonstrates how edge computing runs code near users.

📋 What You'll Learn

Create a basic HTTP server using Deno Deploy

Add a configuration variable for a welcome message

Use the request object to get the user's country from request.cf.country

Respond with a message including the welcome message and user location

💡 Why This Matters

🌍 Real World

Edge computing runs code close to users to reduce delay and improve speed. Deno Deploy lets developers write simple scripts that run worldwide near users automatically.

💼 Career

Understanding edge computing and serverless platforms like Deno Deploy is valuable for modern web developers building fast, scalable applications.

1

Set up a basic HTTP server

Write a Deno Deploy script that listens for HTTP requests using serve from "https://deno.land/std/http/server.ts" and responds with a simple text message "Hello from Deno Deploy!".

Deno

import { serve } from "https://deno.land/std/http/server.ts";

// Your code here

Hint

Use the serve function to create a server that returns a new Response with your message.

2

Add a welcome message configuration

Add a constant variable called welcomeMessage and set it to the string "Welcome to edge computing with Deno Deploy!".

Deno

import { serve } from "https://deno.land/std/http/server.ts";

const welcomeMessage = "Welcome to edge computing with Deno Deploy!";

// Your code here

Hint

Declare a constant string variable before the serve call.

3

Get user location from request.cf.country

Modify the serve callback to accept a request parameter. Extract the user's country from request.cf.country and store it in a variable called userCountry. If it is null or undefined, set userCountry to "Unknown".

Deno

import { serve } from "https://deno.land/std/http/server.ts";

const welcomeMessage = "Welcome to edge computing with Deno Deploy!";

serve((request) => {
  // Your code here
});

Hint

Use request.cf?.country to read the country code and the nullish coalescing operator ?? to provide a default.

4

Respond with welcome message and user location

Update the response to include the welcomeMessage and the userCountry in the text. Return a new Response with the body: `${welcomeMessage} Your location is: ${userCountry}`.

Deno

import { serve } from "https://deno.land/std/http/server.ts";

const welcomeMessage = "Welcome to edge computing with Deno Deploy!";

serve((request) => {
  const userCountry = request.cf?.country ?? "Unknown";
  // Your code here
});

Hint

Use a template string to combine the welcome message and user location in the response.

Practice

1. What is the main benefit of Deno Deploy running code near users in edge computing?

easy

A. It increases the size of the app's codebase.

B. It reduces the delay or latency for users accessing the app.

C. It requires users to install special software.

D. It makes the app run only on one central server.

Solution

1. Step 1: Understand edge computing basics

   Edge computing means running code close to users to reduce the time data travels.

2. Step 2: Connect Deno Deploy's role

   Deno Deploy runs code on many servers worldwide, so users get faster responses.

3. Final Answer:

   It reduces the delay or latency for users accessing the app. -> Option B

4. Quick Check:

   Edge computing = less delay = B [OK]

Hint: Edge computing means less delay by running code near users [OK]

Common Mistakes:

• Thinking edge computing increases app size
• Believing users need special software
• Assuming code runs only on one server

2. Which of the following is the correct way to deploy a simple Deno script to Deno Deploy?

easy

A. deno install main.ts

B. deno run main.ts

C. deno deploy --project=myapp main.ts

D. deno build main.ts

Solution

1. Step 1: Identify Deno Deploy command

   The command to deploy code to Deno Deploy is 'deno deploy' with project and file.

2. Step 2: Check other commands

   'deno run' runs locally, 'deno install' installs scripts, 'deno build' is not a Deno command.

3. Final Answer:

   deno deploy --project=myapp main.ts -> Option C

4. Quick Check:

   Deploy command starts with 'deno deploy' [OK]

Hint: Use 'deno deploy' to send code to Deno Deploy service [OK]

Common Mistakes:

• Using 'deno run' to deploy code
• Confusing install with deploy
• Trying 'deno build' which doesn't exist

3. Consider this Deno Deploy code snippet:

addEventListener('fetch', event => {
  event.respondWith(new Response('Hello from edge!'))
})

What will a user see when accessing this deployed script?

medium

A. The text 'Hello from edge!' displayed in the browser.

B. An error message about missing fetch handler.

C. A blank page with no content.

D. A JSON object with server details.

Solution

1. Step 1: Understand the fetch event listener

   The code listens for fetch requests and responds with 'Hello from edge!'.

2. Step 2: Determine the response content

   The response is a simple text string sent back to the user.

3. Final Answer:

   The text 'Hello from edge!' displayed in the browser. -> Option A

4. Quick Check:

   fetch event returns 'Hello from edge!' [OK]

Hint: fetch event responds with given text string [OK]

Common Mistakes:

• Expecting JSON instead of plain text
• Thinking no response is sent
• Confusing event listener with error

4. This Deno Deploy code throws an error when deployed:

addEventListener('fetch', event => {
  event.respondWith('Hello from edge!')
})

What is the error and how to fix it?

medium

A. Error: respondWith expects a Response object, fix by wrapping string in Response().

B. Error: fetch event missing, fix by adding fetch event listener.

C. Error: Syntax error, fix by adding semicolon after respondWith.

D. No error, code works fine as is.

Solution

1. Step 1: Identify respondWith argument type

   respondWith requires a Response object, not a plain string.

2. Step 2: Fix by wrapping string in Response()

   Use event.respondWith(new Response('Hello from edge!')) to fix error.

3. Final Answer:

   Error: respondWith expects a Response object, fix by wrapping string in Response(). -> Option A

4. Quick Check:

   respondWith needs Response object [OK]

Hint: respondWith must get Response object, not plain string [OK]

Common Mistakes:

• Passing string directly to respondWith
• Missing fetch event listener
• Assuming semicolon fixes error

5. You want to build a fast app using Deno Deploy that serves personalized greetings based on user location. Which feature of Deno Deploy best supports this edge computing use case?

hard

A. Requiring users to download the entire app before use.

B. Using global caching only without running code near users.

C. Running code on a single central server to simplify logic.

D. Running code on many servers worldwide close to users to reduce latency.

Solution

1. Step 1: Understand personalized greetings need low delay

   Personalized greetings require quick response based on user location.

2. Step 2: Identify Deno Deploy's edge computing feature

   Deno Deploy runs code on many servers worldwide near users to reduce delay.

3. Step 3: Compare options

   Only running code near users (Running code on many servers worldwide close to users to reduce latency.) supports fast personalized responses.

4. Final Answer:

   Running code on many servers worldwide close to users to reduce latency. -> Option D

5. Quick Check:

   Edge computing = code near users = A [OK]

Hint: Edge computing means code runs near users for speed [OK]

Common Mistakes:

• Thinking central server is faster
• Confusing caching with code execution
• Believing users must download app fully