Hono.js: Das Next-Gen Node.js Framework

Warum Hono lernen

Es gibt bereits viele Backend-Bibliotheken und -Frameworks für Node.js auf dem Markt. Ich habe Nest.js bereits für einige kleine Projekte verwendet. Es verfügt über umfassende Funktionen und ermöglicht eine schnelle Projektimplementierung. Für meine kleinen Projekte sind jedoch viele seiner Funktionen wirklich übertrieben, und es hat ein hohes Maß an Kapselung, was wenig Freiheit beim Schreiben von Code lässt.

Durch Zufall bin ich online auf Hono gestoßen. Nachdem ich die Dokumentation gelesen hatte:

Ultra-schnell 🚀 - Der Router RegExpRouter ist wirklich schnell. Er verwendet keine linearen Schleifen. Er ist einfach schnell.
Leichtgewichtig 🪶 - Das hono/tiny Preset ist kleiner als 12 kB. Hono hat keine Abhängigkeiten und verwendet nur Webstandard-APIs.
Multi-Runtime 🌍 - Es funktioniert für Cloudflare Workers, Fastly Compute@Edge, Deno, Bun, Lagon, AWS Lambda oder Node.js. Der gleiche Code läuft auf allen Plattformen.
Fähig 🔋 - Hono wird mit eingebauter Middleware, benutzerdefinierter Middleware, Third-Party-Middleware und Helfern geliefert. Es ist alles inklusive.
Angenehme DX 🛠️ - Es hat eine super saubere API und exzellente TypeScript-Unterstützung. Jetzt haben wir "Types".

Anwendungsfälle

Hono ist ein einfaches Webanwendungs-Framework, ähnlich wie Express, aber ohne Frontend. Es ermöglicht Ihnen, größere Anwendungen in Kombination mit Middleware zu erstellen. Hier sind einige Anwendungsbeispiele:

Erstellung von Webschnittstellen
Backend-Server-Proxy
CDN-Frontends
Edge-Anwendungen
Basic Servers für Bibliotheken
Full-Stack-Anwendungen

Großartig, lasst uns anfangen, es zu lernen.

Hello World

https://hono.dev/docs/getting-started/basic

Sie können den Port ändern, indem Sie den port setzen.

import { Hono } from 'hono';

const app = new Hono();

app.get('/', (c) => {
    return c.text('Hello Hono!');
});

export default app;

Zum Ausführen:

npm run dev

Zum Zugriff: http://localhost:8787

Routen

HTTP-Methoden

app.get('/', (c) => c.text('GET /'));
app.post('/', (c) => c.text('POST /'));
app.put('/', (c) => c.text('PUT /'));
app.delete('/', (c) => c.text('DELETE /'));

Hierarchische Routen

const apiRoutes = app
   .basePath("/api")
   .route("/expenses", route1)
   .route("/", route2);

Das vorherige basePath("/api") fügt allen Routen das Präfix /api hinzu.

export const route1 = new Hono()
   .post("/", async (c) => {
        return c.json({ });
    });

Sie können die obige Route über http://localhost:8787/api/expenses aufrufen.

Anfragen

Get Request Params und Query

app.get('/posts/:id', (c) => {
    const page = c.req.query('page');
    const id = c.req.param('id');
    return c.text(`You want see ${page} of ${id}`);
});

Ergebnis anzeigen: http://localhost:8787/posts/1?page=12

Holen Sie sich den Inhalt des Request Body

app.put("/posts/:id{[0-9]+}", async (c) => {
    const data = await c.req.json();
    return c.json(data);
});

Antworten

Neben text() gibt es viele Methoden wie json(), html(), notFound(), redirect() usw., um die Anfrage verschiedene Datentypen zurückgeben zu lassen. html() kann direkt JSX zurückgeben.

JSX

import type { FC } from 'hono/jsx';

const app = new Hono();

const Layout: FC = (props) => {
    return (
        <html>
            <body>{props.children}</body>
        </html>
    );
};

const Top: FC<{ messages: string[] }> = (props: {
    messages: string[]
}) => {
    return (HTTP Methods
        <Layout>
            <h1>Hello Hono!</h1>
            <ul>
                {props.messages.map((message) => {
                    return <li>{message}!!</li>;
                })}
            </ul>
        </Layout>
    );
};

app.get('/', (c) => {
    const messages = ['Good Morning', 'Good Evening', 'Good Night'];
    return c.html(<Top messages={messages} />);
});

export default app;

Ändern Sie einfach die Dateiendung in .tsx und Sie können direkt JSX schreiben, sehr React-ähnlich.

Validatoren

Validatoren werden über zod und @hono/zod-validator implementiert, um zu überprüfen, ob die vom Client gesendeten Anfragen dem angegebenen Datenformat entsprechen. Installation: yarn add zod @hono/zod-validator Wenn wir beispielsweise überprüfen müssen, ob in einer Anfrage das vom Client gesendete Datenformat wie folgt sein muss: account: string; password: string

import { z } from "zod";
import { zValidator } from "@hono/zod-validator";

const loginSchema = z.object({
    account: z.string(),
    password: z.string(),
});

app.post("/login", zValidator("json", loginSchema), async (c) => {
    // do something
    const user = c.req.valid("json");
    return c.json({ });
});

Erfahren Sie mehr in der zod-Dokumentation. Und die IDE kann direkt Typhinweise für user anzeigen.

Leapcell: Die fortschrittliche Serverless-Plattform für Nodejs-Hosting

Zum Schluss möchte ich eine Plattform vorstellen, die sich sehr gut für die Bereitstellung von Hono-Apps eignet: Leapcell.

Leapcell ist eine serverlose Plattform mit folgenden Eigenschaften:

Multi-Language Support
- Entwickeln Sie mit JavaScript, Python, Go oder Rust.
Stellen Sie unbegrenzt Projekte kostenlos bereit
- Bezahlen Sie nur für die Nutzung – keine Anfragen, keine Gebühren.
Unschlagbare Kosteneffizienz
- Pay-as-you-go ohne Leerlaufgebühren.
- Beispiel: 25 US-Dollar unterstützen 6,94 Millionen Anfragen bei einer durchschnittlichen Antwortzeit von 60 ms.
Optimierte Entwicklererfahrung
- Intuitive Benutzeroberfläche für mühelose Einrichtung.
- Vollautomatische CI/CD-Pipelines und GitOps-Integration.
- Echtzeit-Metriken und -Protokollierung für umsetzbare Erkenntnisse.
Mühelose Skalierbarkeit und hohe Leistung
- Auto-Skalierung zur einfachen Bewältigung hoher Parallelität.
- Kein Betriebsaufwand – konzentrieren Sie sich einfach auf den Aufbau.

Erfahren Sie mehr in der Dokumentation!

Leapcell Twitter: https://x.com/LeapcellHQ