Deno LandDeno

Deploy Docs

HTTP Frameworks

If you want to build something more complicated, or like the concept of a higher order framework to create your application, then there are frameworks that support Deno Deploy.

fresh

Preact, but super edgy.

Fresh is a web framework that lets you build projects very fast, highly dynamic, and without the need of a build step. Fresh embraces isomorphic JavaScript like never before. Write a JSX component, have it render on the edge just-in-time, and then enhance it with client side JS for great interactivity.

It has support for file-system routing à la Next.js and TypeScript out of the box.

An example pages/index.tsx would look like this:

import { h, IS_BROWSER, useState } from "../deps.ts";

export default function Home() {
  return (
    <div>
      <p>
        Welcome to `fresh`. Try update this message in the ./pages/index.tsx
        file, and refresh.
      </p>
      <Counter />
      <p>{IS_BROWSER ? "Viewing browser render." : "Viewing JIT render."}</p>
    </div>
  );
}

function Counter() {
  const [count, setCount] = useState(0);
  return (
    <div>
      <p>{count}</p>
      <button
        onClick={() => setCount(count - 1)}
        disabled={!IS_BROWSER}
      >
        -1
      </button>
      <button
        onClick={() => setCount(count + 1)}
        disabled={!IS_BROWSER}
      >
        +1
      </button>
    </div>
  );
}

Check out the full example in the project repository.

oak

oak is an expressive middleware framework including a router and is heavily influenced by koa. It provides support for Deno Deploy.

A simplistic example of a Deno Deploy "hello world" script would be:

import { Application, Router } from "https://deno.land/x/oak/mod.ts";

const router = new Router();
router.get("/", (ctx) => {
  ctx.response.body = "Hello world!";
});

const app = new Application();
app.use(router.routes());
app.use(router.allowedMethods());

app.listen({ port: 8080 });

More information can be found in the oak and Deno Deploy documentation.

sift

Sift is a routing and utility library for Deno Deploy. Its route handler signature is simple and easy to understand. Handlers accept a Request and return a Response.

A small example:

import { h, json, jsx, serve } from "https://deno.land/x/sift/mod.ts";

const App = () => (
  <div>
    <h1>Hello world!</h1>
  </div>
);

const NotFound = () => (
  <div>
    <h1>Page not found</h1>
  </div>
);

serve({
  "/": () => jsx(<App />),
  "/api": () => json({ message: "Hello world" }),
  404: () => jsx(<NotFound />, { status: 404 }),
});

More information can be found on deno.land/x.

router

Router by denosaurs is a tiny router framework for Deno Deploy. It can route based on method, route, and has customizable handlers for edge cases such as no match, errors, or unknown methods.

A small example using router to handle POST and GET requests separately:

import { router } from "https://crux.land/[email protected]";

const router = router({
  "[email protected]/": (_req) => new Response("Hello get!", { status: 200 }),
  "[email protected]/": (_req) => new Response("Hello post!", { status: 200 }),
});

addEventListener("fetch", (event: FetchEvent) => {
  event.respondWith(router(event.request));
});

More information can be found in the documentation.


Please file an issue in our feedback repository if you find any problem in Deploy service or documentation.