[autofix.ci] apply automated fixes

Author: autofix-ci[bot]

content/4.resources/1.learn/2.h3-101-first-hand.md

@@ -6,7 +6,6 @@ resources:
   - # add a link to the documentation
 ---
 
-
 H3 is a minimal http framework for high performance and portability.
 
 During this tutorial, we will create a simple app to get a wide overview of H3 capabilities. This app will serve an HTML file populated with data. There will be some forms to add and remove data. At the end, we will see how to add an API endpoint to get the data in JSON format.
@@ -44,9 +43,9 @@ And that's it! We are ready to start coding.
 To create our first H3 app, we need to create an `app.ts` file at the root of our project. Inside, we will create a new app by importing the `createApp` function from H3 and calling it:
 
 ```ts [app.ts]
-import { createApp } from 'h3';
+import { createApp } from 'h3'
 
-export const app = createApp();
+export const app = createApp()
 ```
 
 :read-more{to="https://h3.unjs.io/concepts/app" title="App"}
@@ -80,13 +79,13 @@ Now that our app is ready to accept HTTP requests, we need to create a router to
 With H3, we've just to use the function `createRouter` and add it to our app:
 
 ```ts [app.ts]
-import { createApp, createRouter } from 'h3';
+import { createApp, createRouter } from 'h3'
 
-export const app = createApp();
+export const app = createApp()
 
-const router = createRouter();
+const router = createRouter()
 
-app.use(router);
+app.use(router)
 ```
 
 The `app.use(router)`{lang="ts"} is necessary to add the router to our app.
@@ -105,11 +104,11 @@ To add a handler, we can use any of the HTTP methods available on the router. Fo
 ```ts [app.ts]
 // ...
 
-const router = createRouter();
+const router = createRouter()
 
 router.get('/', () => {
-  return 'Hello World!';
-});
+  return 'Hello World!'
+})
 ```
 
 In the code above, we added a handler for the `/` route. This handler will send the string `Hello World!` to the client with a simple `return`{lang="ts"}.
@@ -123,51 +122,48 @@ For our app, we will return an HTML page populated with some data. This part wil
 To create our fake database (a JavaScript array) with some getters and setters, we need a file named `database.ts`:
 
 ```ts [database.ts]
-import { Book } from "./types";
+import { Book } from './types'
 
 /**
  * This is a fake database since it's just an array of objects.
  *
  * For this example, it's sufficient but do not use this in production.
  */
 const database: Book[] = [{
-  title: "Anna Karenina",
+  title: 'Anna Karenina',
   price: 42,
 }, {
-  title: "Madame Bovary",
+  title: 'Madame Bovary',
   price: 15,
 }, {
-  title: "War and Peace",
+  title: 'War and Peace',
   price: 36,
 }, {
-  title: "The Great Gatsby",
+  title: 'The Great Gatsby',
   price: 87,
 }, {
-  title: "Lolita",
+  title: 'Lolita',
   price: 23,
-}
-];
+}]
 
 export function getBooks(): Book[] {
-  return database;
+  return database
 }
 
 export function addBook(book: Book) {
-  database.push(book);
+  database.push(book)
 }
 
 export function removeBook(title: string) {
-  const item = database.find((item) => item.title === title);
+  const item = database.find(item => item.title === title)
 
-  if (!item) {
+  if (!item)
     return
-  }
 
-  const index = database.indexOf(item);
+  const index = database.indexOf(item)
 
-  if (index > -1) {
-    database.splice(index, 1);
-  }
+  if (index > -1)
+    database.splice(index, 1)
 }
 ```
 
@@ -189,7 +185,6 @@ For this first route, we will get the books from the database and render them in
 
 For the style, we will use [Pico CSS](https://picocss.com/).
 
-
 ```ts [app.ts]
 // ...
 
@@ -209,7 +204,7 @@ router.get('/', defineEventHandler(() => {
           <section>
         <h1>Books</h1>
         <ul>
-          ${books.map((book) => /* html */`
+          ${books.map(book => /* html */`
           <li>
           ${book.title} - ${book.price}
           <form action="/remove" method="post">