# Deno Fresh — Zero-Build Web Framework with Islands Architecture

> A next-generation web framework for Deno that ships zero JavaScript by default and hydrates only interactive islands for maximum performance.

## Install

Save in your project root:

# Deno Fresh — Zero-Build Web Framework with Islands Architecture

## Quick Use
```bash
deno run -A https://fresh.deno.dev my-app
cd my-app
deno task start
```

## Introduction
Fresh is the official full-stack web framework for Deno. It renders pages on the server with zero JavaScript sent to the client by default, then selectively hydrates interactive components (islands) only where needed. The result is extremely fast page loads with no build step required during development.

## What Deno Fresh Does
- Renders pages server-side with Preact and delivers pure HTML by default
- Hydrates only marked island components, minimizing client-side JavaScript
- Eliminates the build step entirely during development via just-in-time compilation
- Provides file-system routing with dynamic parameters and route groups
- Deploys instantly to Deno Deploy with zero configuration

## Architecture Overview
Fresh uses a file-system router where files in `routes/` define pages and API endpoints. Pages are Preact components rendered on the server. Components in `islands/` are the exception: they ship JavaScript to the browser for interactivity. Middleware can intercept requests for auth, logging, or redirects. The framework runs on Deno's native HTTP server with no bundler in the loop.

## Self-Hosting & Configuration
- Requires Deno runtime (no Node.js or npm needed)
- Routes are defined by file path convention in `routes/` directory
- Static assets go in `static/` and are served with cache headers
- Configure via `deno.json` for import maps and task definitions
- Deploy to Deno Deploy, Docker, or any platform supporting Deno

## Key Features
- No build step: edit, save, reload with sub-millisecond refresh
- Islands architecture keeps client bundle at near-zero by default
- TypeScript-first with full type checking out of the box
- Built-in middleware system for auth, CORS, and request handling
- Form actions for progressive enhancement without client JS

## Comparison with Similar Tools
- **Next.js** — React-based, larger ecosystem but requires Node.js and a build step
- **Astro** — Also islands-based, supports multiple UI frameworks but needs a bundler
- **Remix** — Progressive enhancement focus, React-only, Node.js runtime
- **SvelteKit** — Svelte-based, similar philosophy but different component model
- **Hono** — Same Deno ecosystem, lower-level with no built-in rendering

## FAQ
**Q: Can I use React instead of Preact?**
A: Fresh is built on Preact for its small size. React components can be used via the compatibility layer but are not officially supported.

**Q: Does Fresh support SSG (static site generation)?**
A: Fresh is primarily SSR-focused. Static pre-rendering is possible for specific routes but is not the primary mode.

**Q: How do islands communicate with each other?**
A: Islands are independent Preact apps. Shared state can be managed via signals or by lifting state to a parent island.

**Q: Can I deploy Fresh outside Deno Deploy?**
A: Yes, any environment that runs Deno works. Docker images and standalone binaries via `deno compile` are both viable.

## Sources
- https://github.com/denoland/fresh
- https://fresh.deno.dev/

---
Source: https://tokrepo.com/en/workflows/asset-386ec1cb
Author: AI Open Source