Skip to content

Commit

Permalink
chore: fix does issues (#657)
Browse files Browse the repository at this point in the history
  • Loading branch information
pi0 authored Feb 22, 2024
1 parent f5a89fc commit 80ed5b3
Show file tree
Hide file tree
Showing 10 changed files with 39 additions and 58 deletions.
4 changes: 1 addition & 3 deletions docs/1.guide/2.app.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ The core of a h3 server is an `app` instance. It is the core of the server that

## Initializing an app

You can create a new h3 app instance using [`createApp`](/utilities/create-app) utility:
You can create a new h3 app instance using [`createApp`](/guide/app) utility:

```js [app.mjs]
import { createApp } from "h3";
Expand Down Expand Up @@ -158,8 +158,6 @@ app.use("/big", () => import("./big-handler"), { lazy: true });

This reduce the startup time because the runtime have less code to load and parse when starting the server.

You can use a [syntax sugar](#lazy-event-handlers) over this option using [`defineLazyEventHandler`](/concepts/utilities) or [`lazyEventHandler`](/concepts/utilities) utilities.

## Internals

> [!IMPORTANT]
Expand Down
13 changes: 5 additions & 8 deletions docs/1.guide/2.event-handler.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,14 +4,14 @@
After creating an [app instance](/guide/app), you can start defining your application logic using event handlers.

An event handler is a function that receive an [`Event`](/concepts/event) instance and returns a response. You can compare it to controllers in other frameworks.
An event handler is a function that receive an `Event` instance and returns a response. You can compare it to controllers in other frameworks.

## Defining event handlers

You can define event handlers using [`defineEventHandler`](/concepts/event) or [`eventHandler`](/concepts/event) utilities:
You can define event handlers using `defineEventHandler` or [`eventHandler` utilities:

> [!NOTE]
> You can use [`eventHandler`](/concepts/event) and [`defineEventHandler`](/concepts/event) interchangeably. They are aliases. You can use the one you prefer but **stick to it** for consistency.
> You can use `eventHandler` and `defineEventHandler` interchangeably. They are aliases. You can use the one you prefer but **stick to it** for consistency.
```js
import { defineEventHandler } from "h3";
Expand All @@ -33,7 +33,7 @@ defineEventHandler(async (event) => {

### Object Syntax

You can use an object syntax in [`defineEventHandler`](/concepts/utilities) for more flexible options.
You can use an object syntax in `defineEventHandler` for more flexible options.

```js
defineEventHandler({
Expand All @@ -55,7 +55,7 @@ Values returned from event handlers are automatically converted to responses. It
- [Web `ReadableStream`](https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream) or [node `Readable`](https://nodejs.org/api/stream.html#readable-streams)
- [Web `ArrayBuffer`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer) or [node `Buffer`](https://nodejs.org/api/buffer.html#buffer)
- [Web Fetch Response](https://developer.mozilla.org/en-US/docs/Web/API/Response/Response)
- [`Error`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error) instance. It's supported but **recommended** to throw errors instead of returning them using [`createError`](/concepts/utilities) utility.
- [`Error`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error) instance. It's supported but **recommended** to throw errors instead of returning them using `createError` utility.

Any of above values could also be wrapped in a [`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise). This means that you can return a `Promise` from your event handler and h3 will wait for it to resolve before sending the response.

Expand Down Expand Up @@ -131,9 +131,6 @@ app.use(

## Lazy event handlers

> [!NOTE]
> This is a syntax sugar over the [`lazy`](#lazy-matcher) option.
You can define lazy event handlers using `defineLazyEventHandler` or `lazyEventHandler` utilities. This allow you to define some one-time logic that will be executed only once when the first request matching the route is received.

A lazy event handler must return an event handler:
Expand Down
8 changes: 2 additions & 6 deletions docs/4.guides/from-expressjs-to-h3.md
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ app.use(

Then, you can use `npx --yes listhen -w ./app.ts` to start the server and go to http://localhost:3000 to see the result.

:read-more{to="/concepts/app"}
:read-more{to="/guide/app"}

## Multi Router

Expand Down Expand Up @@ -150,7 +150,7 @@ app.use("/api/v2/**", useBase("/api/v2", apiv2.handler));

It's quite similar. The main difference is that we have to use `useBase` to define a base path for a router.

:read-more{to="/concepts/router"}
:read-more{to="/guide/router"}

## Params

Expand Down Expand Up @@ -288,8 +288,6 @@ app.use(router);

With h3, we do not have a `param` method. Instead, we use `getRouterParam` or `getValidatedRouterParams` to validate the params. It's more explicit and easier to use. In this example, we use `Zod` but you are free to use any other validation library.

:read-more{to="/guides/valide-data"}

## Cookies

The fourth example is the [Cookies](https://github.com/expressjs/express/blob/master/examples/cookies/index.js). In this example, we use cookies.
Expand Down Expand Up @@ -394,5 +392,3 @@ app.use(router);
```

With h3, we do not have a `cookieParser` middleware. Instead, we use `getCookie` and `setCookie` to get and set cookies. It's more explicit and easier to use.

:read-more{to="/guides/handle-cookies"}
20 changes: 8 additions & 12 deletions docs/4.guides/handle-cookie.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,13 @@
Handling cookies with h3 is straightforward. There is three utilities to handle cookies:

- [`setCookie`](/concepts/utilities) to attach a cookie to the response.
- [`getCookie`](/concepts/utilities) to get a cookie from the request.
- [`deleteCookie`](/concepts/utilities) to clear a cookie from the response.
- `setCookie` to attach a cookie to the response.
- `getCookie` to get a cookie from the request.
- `deleteCookie` to clear a cookie from the response.

## Set a Cookie

To set a cookie, you need to use [`setCookie`](/concepts/utilities) in an [event handler](/concepts/event-handler):
To set a cookie, you need to use `setCookie` in an event handler:

```ts
import { defineEventHandler, setCookie } from "h3";
Expand All @@ -34,11 +34,11 @@ In the options, you can configure the [cookie flags](https://developer.mozilla.o
- `httpOnly` to set the `HttpOnly` flag of the cookie.
- `sameSite` to set the `SameSite` flag of the cookie.

:read-more{to="/concepts/utilities"}
:read-more{to="/utils"}

## Get a Cookie

To get a cookie, you need to use [`getCookie`](/concepts/utilities) in an [event handler](/concepts/event-handler):
To get a cookie, you need to use `getCookie` in an event handler.

```ts
import { defineEventHandler, getCookie } from "h3";
Expand All @@ -54,11 +54,9 @@ app.use(

This will return the value of the cookie if it exists, or `undefined` otherwise.

:read-more{to="/concepts/utilities"}

## Delete a Cookie

To delete a cookie, you need to use [`deleteCookie`](/concepts/utilities) in an [event handler](/concepts/event-handler):
To delete a cookie, you need to use `deleteCookie` in an event handler:

```ts
import { defineEventHandler, deleteCookie } from "h3";
Expand All @@ -72,8 +70,6 @@ app.use(
);
```

The utility `deleteCookie` is a wrapper around [`setCookie`](/concepts/utilities) with the value set to `""` and the `maxAge` set to `0`.
The utility `deleteCookie` is a wrapper around `setCookie` with the value set to `""` and the `maxAge` set to `0`.

This will erase the cookie from the client.

:read-more{to="/concepts/utilities"}
24 changes: 11 additions & 13 deletions docs/4.guides/handle-session.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,18 +4,18 @@
A session is a way to remember users using cookies. It is a very common way to authenticate users or save data about them such as their language or their preferences on the web.

h3 provide many [utilities](/concepts/utilities) to handle sessions:
h3 provide many utilities to handle sessions:

- [`useSession`](/concepts/utilities) to initializes a session and returns a wrapper to control it.
- [`getSession`](/concepts/utilities) to initializes or gets the current user session.
- [`updateSession`](/concepts/utilities) to updates data of the current session.
- [`clearSession`](/concepts/utilities) to clears the current session.
- `useSession` to initializes a session and returns a wrapper to control it.
- `getSession` to initializes or gets the current user session.
- `updateSession` to updates data of the current session.
- `clearSession` to clears the current session.

Most of the time, you will use [`useSession`](/concepts/utilities) to manipulate the session.
Most of the time, you will use `useSession` to manipulate the session.

## Initialize a Session

To initialize a session, you need to use [`useSession`](/concepts/utilities) in an [event handler](/concepts/event-handler):
To initialize a session, you need to use `useSession` in an [event handler](/guide/event-handler):

```js
import { defineEventHandler, useSession } from "h3";
Expand Down Expand Up @@ -43,7 +43,7 @@ If the request contains a cookie named `h3` or a header named `x-h3-session`, th
## Get Data from a Session

To get data from a session, we will still use [`useSession`](/concepts/utilities). Under the hood, it will use [`getSession`](/concepts/utilities) to get the session.
To get data from a session, we will still use `useSession`. Under the hood, it will use [`getSession` to get the session.

```js
import { defineEventHandler, useSession } from "h3";
Expand All @@ -63,7 +63,7 @@ Data are stored in the `data` property of the session. If there is no data, it w

## Add Data to a Session

To add data to a session, we will still use [`useSession`](/concepts/utilities). Under the hood, it will use [`updateSession`](/concepts/utilities) to update the session.
To add data to a session, we will still use `useSession`. Under the hood, it will use `updateSession` to update the session.

```js
import { defineEventHandler, useSession } from "h3";
Expand Down Expand Up @@ -97,7 +97,7 @@ Try to visit the page multiple times and you will see the number of times you vi
## Clear a Session

To clear a session, we will still use [`useSession`](/concepts/utilities). Under the hood, it will use [`clearSession`](/concepts/utilities) to clear the session.
To clear a session, we will still use `useSession`. Under the hood, it will use `clearSession` to clear the session.

```js
import { defineEventHandler, useSession } from "h3";
Expand All @@ -120,7 +120,7 @@ h3 will send a header `Set-Cookie` with an empty cookie named `h3` to clear the

## Options

When to use [`useSession`](/concepts/utilities), you can pass an object with options as the second argument to configure the session:
When to use `useSession`, you can pass an object with options as the second argument to configure the session:

```js
import { defineEventHandler, useSession } from "h3";
Expand All @@ -142,5 +142,3 @@ app.use(
}),
);
```

:read-more{to="/concepts/utilities"}
6 changes: 1 addition & 5 deletions docs/4.guides/serve-static-assets.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ h3 can serve static assets such as HTML, images, CSS, JavaScript, etc.
## Usage

To serve a static directory, you can use the [`serveStatic`](/concepts/utilities) utility.
To serve a static directory, you can use the `serveStatic` utility.

```ts
import { createApp, serveStatic } from "h3";
Expand Down Expand Up @@ -41,8 +41,6 @@ This does not serve any files yet. You need to implement the `getContents` and `

They are separated to allow h3 to respond to `HEAD` requests without reading the contents of the file and to use the `Last-Modified` header.

:read-more{to="/concepts/utilities"}

## Read files

Now, create a `index.html` file in the `public` directory with a simple message and open your browser to http://localhost:3000. You should see the message.
Expand Down Expand Up @@ -89,8 +87,6 @@ The `getContents` read the file and returns its contents, pretty simple. The `ge

The file size and last modification time are used to create an etag to send a `304 Not Modified` response if the file has not been modified since the last request. This is useful to avoid sending the same file multiple times if it has not changed.

:read-more{to="/concepts/utilities"}

## Resolving Assets

If the path does not match a file, h3 will try to add `index.html` to the path and try again. If it still does not match, it will return a 404 error.
Expand Down
2 changes: 1 addition & 1 deletion docs/4.guides/stream-response.md
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ app.use(
);
```

Then, you can send the stream using the [`sendStream`](/concepts/utilities) utility:
Then, you can send the stream using the `sendStream` utility:

```ts
import {
Expand Down
18 changes: 9 additions & 9 deletions docs/4.guides/validate-data.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,20 +5,20 @@
When you receive data from user on your server, you must validate them. By validate, we mean that the shape of the received data must match the expected shape. It's important because you can't trust user input.

> [!WARNING]
> Do not use a generic as a validation. Providing an interface to a utility like [`readBody`](/concepts/utilities) is not a validation. You must validate the data before using them.
> Do not use a generic as a validation. Providing an interface to a utility like `readBody` is not a validation. You must validate the data before using them.
## Utilities for Validation

h3 provide some [utilities](/concepts/utilities) to help you to handle data validation. You will be able to validate:
h3 provide some utilities to help you to handle data validation. You will be able to validate:

- query with [`getValidatedQuery`](/concepts/utilities)
- params with [`getValidatedRouterParams`](/concepts/utilities).
- body with [`readValidatedBody`](/concepts/utilities)
- query with `getValidatedQuery`
- params with `getValidatedRouterParams`.
- body with `readValidatedBody`

To validate data, you can use any validation library you want. h3 doesn't provide any validation library like [Zod](https://zod.dev), [joi](https://joi.dev) or [myzod](https://github.com/davidmdm/myzod).

> [!WARNING]
> h3 is runtime agnostic. This means that you can use it in [any runtime](/runtimes). But some validation libraries are not compatible with all runtimes.
> h3 is runtime agnostic. This means that you can use it in [any runtime](/adapters). But some validation libraries are not compatible with all runtimes.
Let's see how to validate data with [Zod](https://zod.dev).

Expand All @@ -35,7 +35,7 @@ const userSchema = z.object({

## Validate Query

You can use [`getValidatedQuery`](/concepts/utilities) to validate query and get the result, as a replacement of [`getQuery`](/concepts/utilities):
You can use `getValidatedQuery` to validate query and get the result, as a replacement of `getQuery`:

```js
import { defineEventHandler, getValidatedQuery } from "h3";
Expand All @@ -62,7 +62,7 @@ If you send an invalid request and the validation fails, h3 will throw a `400 Va

## Validate Params

You can use [`getValidatedRouterParams`](/concepts/utilities) to validate params and get the result, as a replacement of [`getRouterParams`](/concepts/utilities):
You can use `getValidatedRouterParams` to validate params and get the result, as a replacement of `getRouterParams`:

```js
import { defineEventHandler, getValidatedRouterParams } from "h3";
Expand Down Expand Up @@ -91,7 +91,7 @@ If you send an invalid request and the validation fails, h3 will throw a `400 Va

## Validate Body

You can use [`readValidatedBody`](/concepts/utilities) to validate body and get the result, as a replacement of [`readBody`](/concepts/utilities):
You can use `readValidatedBody` to validate body and get the result, as a replacement of `readBody`:

```js
import { defineEventHandler, readValidatedBody } from "h3";
Expand Down
Binary file modified docs/bun.lockb
Binary file not shown.
2 changes: 1 addition & 1 deletion docs/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,6 @@
"dev": "undocs dev"
},
"devDependencies": {
"undocs": "^0.2.10"
"undocs": "^0.2.12"
}
}

0 comments on commit 80ed5b3

Please sign in to comment.