From c349fb55c76528bc16d856c102008fe6340119ea Mon Sep 17 00:00:00 2001 From: fry69 <142489379+fry69@users.noreply.github.com> Date: Mon, 22 Sep 2025 06:04:16 +0200 Subject: [PATCH 1/3] docs: fix misleading main.tsx filenames --- docs/latest/advanced/app-wrapper.md | 2 +- docs/latest/advanced/error-handling.md | 8 +++++--- docs/latest/advanced/layouts.md | 6 +++--- docs/latest/concepts/app.md | 4 ++-- docs/latest/concepts/islands.md | 2 +- docs/latest/concepts/routing.md | 2 ++ docs/latest/concepts/static-files.md | 4 ++-- docs/latest/introduction/index.md | 2 +- 8 files changed, 17 insertions(+), 13 deletions(-) diff --git a/docs/latest/advanced/app-wrapper.md b/docs/latest/advanced/app-wrapper.md index 54baa325b21..96e63563ecc 100644 --- a/docs/latest/advanced/app-wrapper.md +++ b/docs/latest/advanced/app-wrapper.md @@ -8,7 +8,7 @@ structure of the HTML document, typically up until the ``-tag. It is only rendered on the server and never on the client. The passed `Component` value represents the children of this component. -```tsx main.tsx +```tsx routes/_app.tsx function AppWrapper({ Component }) { return ( diff --git a/docs/latest/advanced/error-handling.md b/docs/latest/advanced/error-handling.md index c9af64f62c0..c2c74a21683 100644 --- a/docs/latest/advanced/error-handling.md +++ b/docs/latest/advanced/error-handling.md @@ -21,6 +21,8 @@ Fresh supports two kind of error pages: To add an error page use [`app.onError()`](/docs/concepts/app#onerror). ```ts main.ts +import { App } from "fresh"; + const app = new App() .onError("*", (ctx) => { console.log(`Error: ${ctx.error}`); @@ -36,7 +38,7 @@ will be invoked. You can also nest error pages: -```ts main.ts +```ts const app = new App() // Top level error page .onError("*", (ctx) => { @@ -56,7 +58,7 @@ Not found errors are often treated differently than generic errors. You can both treat them with the `.onError()` way, but by adding a specific `.notFound()` handler, Fresh ensures that every 404 error will invoke this callback. -```ts main.ts +```ts const app = new App() // Top level error page .notFound((ctx) => { @@ -90,7 +92,7 @@ async function authMiddleware(ctx) { You can check the status code of the thrown `HttpError` in your error handler: -```ts main.ts +```ts app.onError((ctx) => { if (ctx.error instanceof HttpError) { const status = ctx.error.status; diff --git a/docs/latest/advanced/layouts.md b/docs/latest/advanced/layouts.md index 67e3050ebef..c0b0c347d38 100644 --- a/docs/latest/advanced/layouts.md +++ b/docs/latest/advanced/layouts.md @@ -8,7 +8,7 @@ HTML structure and only the content changes, a layout is a neat way to abstract this. Layouts only ever render on the server. The passed `Component` value represents the children of this component. -```tsx main.tsx +```tsx function PageLayout({ Component }) { return (
@@ -36,12 +36,12 @@ If you browse to the `/` route, Fresh will render the following HTML Add a layout and ignore all previously inherited ones. -```ts main.ts +```ts app.layout("/foo/bar", MyComponent, { skipInheritedLayouts: true }); ``` Ignore the app wrapper component: -```ts main.ts +```ts app.layout("/foo/bar", MyComponent, { skipAppWrapper: true }); ``` diff --git a/docs/latest/concepts/app.md b/docs/latest/concepts/app.md index 5c9c405e661..c3669f96a3c 100644 --- a/docs/latest/concepts/app.md +++ b/docs/latest/concepts/app.md @@ -7,7 +7,7 @@ The `App` class is the heart of Fresh and routes incoming requests to the correct middlewares. This is where routes, middlewares, layouts and more are defined. -```tsx main.ts +```ts const app = new App() .use(staticFiles()) .get("/", () => new Response("hello")) @@ -20,7 +20,7 @@ app.listen(); All items are applied from top to bottom. This means that when you defined a middleware _after_ a `.get()` handler, it won't be included. -```tsx main.tsx +```ts const app = new App() .use((ctx) => { // Will be called for all middlewares diff --git a/docs/latest/concepts/islands.md b/docs/latest/concepts/islands.md index 2b787453820..e3226ff6286 100644 --- a/docs/latest/concepts/islands.md +++ b/docs/latest/concepts/islands.md @@ -28,7 +28,7 @@ export default function MyIsland() { An island can be used anywhere like a regular Preact component. Fresh will take care of making it interactive on the client. -```tsx main.tsx +```tsx main.ts import { App, staticFiles } from "fresh"; import MyIsland from "./islands/my-island.tsx"; diff --git a/docs/latest/concepts/routing.md b/docs/latest/concepts/routing.md index da5f1850114..f236d09e916 100644 --- a/docs/latest/concepts/routing.md +++ b/docs/latest/concepts/routing.md @@ -7,6 +7,8 @@ Routing defines which middlewares and routes should respond to a particular request. ```ts main.ts +import { App } from "fresh"; + const app = new App() .get("/", () => new Response("hello")) // Responds to: GET / .get("/other", () => new Response("other")) // Responds to: GET /other diff --git a/docs/latest/concepts/static-files.md b/docs/latest/concepts/static-files.md index 45791833835..6e307d59b91 100644 --- a/docs/latest/concepts/static-files.md +++ b/docs/latest/concepts/static-files.md @@ -21,7 +21,7 @@ const app = new App() By default, Fresh adds caching headers for the `src` and `srcset` attributes on `` and `` tags. -```tsx main.tsx +```ts // Caching headers will be automatically added app.get("/user", (ctx) => ctx.render()); ``` @@ -29,7 +29,7 @@ app.get("/user", (ctx) => ctx.render()); You can always opt out of this behaviour per tag, by adding the `data-fresh-disable-lock` attribute. -```tsx main.tsx +```ts // Opt-out of automatic caching headers app.get( "/user", diff --git a/docs/latest/introduction/index.md b/docs/latest/introduction/index.md index fd5f512bc05..c3eb7023f72 100644 --- a/docs/latest/introduction/index.md +++ b/docs/latest/introduction/index.md @@ -9,7 +9,7 @@ Fresh is a small, fast and extensible full stack web framework built on Web Standards. It's designed for building high-quality, performant, and personalized web applications. -```tsx main.tsx +```tsx main.ts import { App } from "fresh"; const app = new App() From a3dccf068c29faeda8b93c43c1cfd293f71f7c60 Mon Sep 17 00:00:00 2001 From: fry69 <142489379+fry69@users.noreply.github.com> Date: Mon, 22 Sep 2025 06:09:55 +0200 Subject: [PATCH 2/3] docs: fix AppWrapper filename --- docs/latest/advanced/app-wrapper.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/latest/advanced/app-wrapper.md b/docs/latest/advanced/app-wrapper.md index 96e63563ecc..64c3d42263f 100644 --- a/docs/latest/advanced/app-wrapper.md +++ b/docs/latest/advanced/app-wrapper.md @@ -8,7 +8,7 @@ structure of the HTML document, typically up until the ``-tag. It is only rendered on the server and never on the client. The passed `Component` value represents the children of this component. -```tsx routes/_app.tsx +```tsx function AppWrapper({ Component }) { return ( From a22ec2530d2ed994d5a75f7b5e91501d300b7d45 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bartek=20Iwa=C5=84czuk?= Date: Sun, 29 Mar 2026 20:33:13 +0200 Subject: [PATCH 3/3] fix: keep main.tsx for JSX-containing code block in islands.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Addresses review comment — the snippet contains JSX () so the filename must be .tsx, not .ts. Co-Authored-By: Claude Opus 4.6 (1M context) --- docs/latest/concepts/islands.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/latest/concepts/islands.md b/docs/latest/concepts/islands.md index 990fd891d03..b2f88a7efbc 100644 --- a/docs/latest/concepts/islands.md +++ b/docs/latest/concepts/islands.md @@ -28,7 +28,7 @@ export default function MyIsland() { An island can be used anywhere like a regular Preact component. Fresh will take care of making it interactive on the client. -```tsx main.ts +```tsx main.tsx import { App, staticFiles } from "fresh"; import MyIsland from "./islands/my-island.tsx";