chore: migrate examples to v2

examples/body.ts

@@ -1,15 +1,13 @@
-import { createApp, createRouter, readJSONBody } from "h3";
+import { createH3, readBody } from "h3";
 
-export const app = createApp();
+export const app = createH3();
 
-const router = createRouter()
+app
   .get("/", () => "use POST method to try!")
   .post("/", async (event) => {
-    const body = await readJSONBody(event);
+    const body = await readBody(event);
     // Use can also use `readFormDataBody` to get a FormData object, `readMultiPartFormData` to get an array of MultiPartData or `readRawBody` to get a Buffer.
     return {
       body,
     };
   });
-
-app.use(router);

examples/cookies.ts

@@ -1,8 +1,8 @@
-import { createApp, createRouter, getCookie, setCookie } from "h3";
+import { createH3, getCookie, setCookie } from "h3";
 
-export const app = createApp();
+export const app = createH3();
 
-const router = createRouter()
+app
   .get("/", (event) => {
     const testCookie = getCookie(event, "testCookie");
     return `testCookie is ${JSON.stringify(testCookie)} (go to /set to set it)`;
@@ -13,5 +13,3 @@ const router = createRouter()
     setCookie(event, "testCookie", "bar", { httpOnly: true });
     return "testCookie is set";
   });
-
-app.use(router);

examples/cors.ts

@@ -1,6 +1,6 @@
-import { createApp, createRouter, handleCors } from "h3";
+import { createH3, handleCors } from "h3";
 
-export const app = createApp();
+export const app = createH3();
 
 app.use((event) => {
   if (
@@ -12,6 +12,4 @@ app.use((event) => {
   }
 });
 
-const router = createRouter().get("/hello", () => "world");
-
-app.use(router);
+app.get("/hello", () => "world");

examples/errors.ts

@@ -1,13 +1,14 @@
-import { createApp, createError, createRouter } from "h3";
+import { createError, createH3 } from "h3";
 
-export const app = createApp({ debug: true });
+export const app = createH3({ debug: true });
 
-const router = createRouter()
+app
   .get("/", () => {
     // Always "throw" errors to propgate them to the error handler
     throw createError({ statusMessage: "Simple error!", statusCode: 301 });
   })
   .get("/complexe-error", () => {
+    console.log("complexe-error");
     // You can fully customize errors by adding data, cause and if it's a fatal error or not
     throw createError({
       status: 400,
@@ -24,5 +25,3 @@ const router = createRouter()
       data: { foo: "bar" },
     });
   });
-
-app.use(router);

examples/first-server.ts

@@ -1,6 +1,6 @@
-import { createApp } from "h3";
+import { createH3 } from "h3";
 
-export const app = createApp();
+export const app = createH3();
 
 app
   // `/` is the root path and will response to every request.

examples/handler-middleware.ts

@@ -1,14 +1,13 @@
 import {
-  createApp,
-  createRouter,
+  createH3,
   defineEventHandler,
   defineRequestMiddleware,
   defineResponseMiddleware,
 } from "h3";
 
-export const app = createApp();
+export const app = createH3();
 
-const router = createRouter().get(
+app.get(
   "/",
   defineEventHandler({
     onRequest: defineRequestMiddleware(() => {
@@ -24,5 +23,3 @@ const router = createRouter().get(
     handler: () => "GET: hello world",
   }),
 );
-
-app.use(router);

examples/headers.ts

@@ -1,31 +1,17 @@
-import {
-  createApp,
-  createRouter,
-  getRequestHeader,
-  getResponseHeaders,
-  setResponseHeader,
-} from "h3";
+import { createH3 } from "h3";
 
-export const app = createApp();
+export const app = createH3();
 
-const router = createRouter().get("/user-agent", (event) => {
-  const userAgent = getRequestHeader(event, "user-agent");
-  // You can also use `getRequestHeaders` to get all headers at once.
-  // const headers = getRequestHeaders(event)
+app.get("/user-agent", (event) => {
+  const userAgent = event.request.headers.get("user-agent");
 
-  setResponseHeader(event, "content-type", "text/plain");
-  setResponseHeader(event, "x-server", "nitro");
-  // You can also use `setResponseHeaders` to set multiple headers at once.
-  // setResponseHeaders(event, { 'x-server': 'nitro', 'content-type': 'text/plain' })
+  event.response.headers.set("content-type", "text/plain");
+  event.response.headers.set("x-server", "nitro");
 
-  const responseHeaders = getResponseHeaders(event);
-  // You can also use `getResponseHeader` to get a single header.
-  // const contentType = getResponseHeader(event, 'content-type')
+  const responseHeaders = Object.fromEntries(event.response.headers.entries());
 
   return {
     userAgent,
     responseHeaders,
   };
 });
-
-app.use(router);

examples/nested-router.ts

@@ -1,14 +1,12 @@
-import { createApp, createRouter, useBase, redirect } from "h3";
+import { createH3, redirect, withBase } from "h3";
 
 // Init App
-export const app = createApp({ debug: true });
+export const app = createH3({ debug: true });
 
 // Main Router
-const router = createRouter();
-router.use("/", (event) => redirect(event, "/api/test"));
-app.use(router);
+app.use("/", (event) => redirect(event, "/api/test"));
 
+const apiRouter = createH3();
 // Nested API Router
-const apiRouter = createRouter();
-router.use("/api/**", useBase("/api", apiRouter.handler));
+app.use("/api/**", withBase("/api", apiRouter.handler));
 apiRouter.use("/test", () => "API /test");

examples/query-params.ts

@@ -1,10 +1,8 @@
-import { createApp, createRouter, getQuery } from "h3";
+import { createH3, getQuery } from "h3";
 
-export const app = createApp();
+export const app = createH3();
 
-const router = createRouter().get("/", (event) => {
+app.get("/", (event) => {
   const query = getQuery(event);
   return `Hello ${query.name}`;
 });
-
-app.use(router);

examples/redirect.ts

@@ -1,14 +1,12 @@
-import { createApp, createRouter, redirect } from "h3";
+import { createH3, redirect } from "h3";
 
-export const app = createApp();
+export const app = createH3();
 
-const router = createRouter()
+app
   .get("/unjs", (event) => {
     return redirect(event, "https://unjs.io/packages/h3"); // 302 Found by default
   })
   .get("/permanent", (event) => {
     // You can use any 3xx status code you want
     return redirect(event, "https://unjs.io/packages/h3", 301);
   });
-
-app.use(router);

examples/router.ts

@@ -1,13 +1,11 @@
-import { createApp, createRouter } from "h3";
+import { createH3 } from "h3";
 
-export const app = createApp();
+export const app = createH3();
 
-const router = createRouter()
+app
   .get("/", () => "GET: hello world")
   .post("/", () => "POST: hello world")
   .put("/", () => "PUT: hello world")
   .delete("/", () => "DELETE: hello world")
   .patch("/", () => "PATCH: hello world")
   .head("/", () => "HEAD: hello world");
-
-app.use(router);

examples/server-sent-events.ts

@@ -1,13 +1,10 @@
-import { createApp, createRouter, eventHandler, createEventStream } from "h3";
+import { createH3, createEventStream, defineEventHandler } from "h3";
 
-export const app = createApp();
+export const app = createH3();
 
-const router = createRouter();
-app.use(router);
-
-router.get(
+app.get(
   "/",
-  eventHandler((event) => {
+  defineEventHandler((event) => {
     const eventStream = createEventStream(event);
 
     // Send a message every second

examples/status.ts

@@ -1,34 +1,25 @@
-import {
-  createApp,
-  createRouter,
-  getResponseStatus,
-  getResponseStatusText,
-  noContent,
-  setResponseStatus,
-} from "h3";
+import { createH3, noContent } from "h3";
 
-export const app = createApp();
+export const app = createH3();
 
-const router = createRouter()
+app
   .get("/not-found", (event) => {
-    setResponseStatus(event, 404);
+    event.response.status = 404;
 
     return "Not found"; // You need to explicitly return something to avoid a 404 'Cannot find any path matching "/not-found"' response.
   })
   .get("/bad-request", (event) => {
-    setResponseStatus(event, 400, "Bad request message"); // You can customize the status message.
+    const status = 400;
+    const text = "Bad request message";
 
-    const status = getResponseStatus(event); // You can get the status message.
-    const text = getResponseStatusText(event); // You can get the status message.
+    event.response.status = status;
+    event.response.statusText = text; // You can customize the status message.
 
     return {
       status,
       text,
     };
   })
   .get("/no-content", (event) => {
-    // Do not need to explicitly return because `noContent` will cut the connection.
     return noContent(event);
   });
-
-app.use(router);

examples/url-params.ts

@@ -1,8 +1,8 @@
-import { createApp, createRouter, getRouterParam, getRouterParams } from "h3";
+import { createH3, getRouterParam, getRouterParams } from "h3";
 
-export const app = createApp();
+export const app = createH3();
 
-const router = createRouter()
+app
   .get("/:name", (event) => {
     const name = getRouterParam(event, "name");
     return `Hello ${name}`;
@@ -12,5 +12,3 @@ const router = createRouter()
 
     return `Hello ${params.name}, you are ${params.age} years old`;
   });
-
-app.use(router);

examples/websocket.ts

@@ -1,6 +1,6 @@
-import { createApp, defineWebSocketHandler } from "h3";
+import { createH3, defineWebSocketHandler } from "h3";
 
-export const app = createApp();
+export const app = createH3();
 
 app.use(() =>
   fetch(