DEV Community

Alex Spinov
Alex Spinov

Posted on

Fresh Has a Free Deno Web Framework — Zero JavaScript by Default with Island Architecture

#deno #fresh #webdev #typescript

Why Fresh?

Deno's official framework. Ships ZERO JS by default. Only islands get hydrated.

deno run -A https://fresh.deno.dev my-app
cd my-app && deno task start
Enter fullscreen mode Exit fullscreen mode

Pages (0 bytes JS) 

export const handler = {
  async GET(_req, ctx) {
    const posts = await db.query("SELECT * FROM posts")
    return ctx.render({ posts })
  },
}

export default function Home({ data }) {
  return <main>{data.posts.map(p => <a href={`/blog/${p.slug}`}>{p.title}</a>)}</main>
}
Enter fullscreen mode Exit fullscreen mode

Islands (Selective Hydration) 

import { useSignal } from "@preact/signals"

export default function Counter() {
  const count = useSignal(0)
  return <button onClick={() => count.value++}>Count: {count}</button>
}
Enter fullscreen mode Exit fullscreen mode
Feature Fresh Next.js
Default JS 0 bytes Bundle
Build step None Required
Runtime Deno Node.js

Need to extract data from any website at scale? I build custom web scrapers — 77 production scrapers running on Apify Store. Email me at spinov001@gmail.com for a tailored solution.

Top comments (0)