Serveur Hono TypeScript : démarre-le en 10 lignes claires

Pourquoi seulement 10 lignes suffisent

Tu veux juste répondre "Comment je démarre un serveur Hono maintenant ?".
Voici le listing complet du fichier. Il tient sur dix lignes actives :

1
import { serve } from "@hono/node-server";
2
import "dotenv/config";
3
import { Hono } from "hono";
4
import { getCookie } from "hono/cookie";
5
import Dashboard from "./components/Dashboard.js";
6
import GenerateImageForm from "./components/GenerateImageForm.js";
7
import LandingPage from "./components/LandingPage.js";
8
import Layout from "./components/Layout.js";
9
import RegisterForm from "./components/RegisterForm.js";
10
import { parseEnv } from "./env.js";
11
import auth from "./routes/auth.js";
12
import imageGeneration from "./routes/image-generation.js";
13
import users from "./routes/users.js";
14
import { getAllTokens, getExistingToken } from "./token.js";
15
import { TOKEN_COOKIE_NAME } from "./utils/cookie-utils.js";
16

17
parseEnv();
18

19
const app = new Hono();
20

21
/* --- next snippet --- */
22

23
serve(
24
  {
25
    fetch: app.fetch,
26
    port: 3000,
27
  },
28
  (info) => {
29
    console.log(`Server is running on http://localhost:${info.port}`);
30
  },
31
);

1. import { serve } from "@hono/node-server";

Hono fournit son propre utilitaire serve.
Pourquoi ? Tu évites la configuration d’un serveur HTTP bas-niveau.

2. import "dotenv/config";

Charge tes variables d’environnement avant toute exécution.
Rappel : place un fichier .env à la racine pour stocker tes secrets.

3. import { Hono } from "hono";

Instancie le micro-framework.
Hono expose une API minimaliste façon Express mais plus rapide.

4. Imports utilitaires et routes

Tu vois passer :

• ./components/... pour tes vues HTMX/Tailwind.
• ./routes/... pour tes routeurs modulaires.
• ./token.js et cookie-utils.js pour la gestion d’authentification.

Ces lignes n’augmentent pas la complexité du serveur principal : elles organisent seulement le code.

5. parseEnv();

Valide et charge tes variables.
Astuce : ici la fonction vient de ./env.js et peut utiliser Zod pour typage.

6. const app = new Hono();

Tu crées l’instance de l’application.
C’est le point d’entrée où tu pluggeras middlewares et routes.

7. serve({ fetch: app.fetch, port: 3000 }, callback);

1
serve(
2
  { fetch: app.fetch, port: 3000 },
3
  (info) => {
4
    console.log(`Server is running on http://localhost:${info.port}`);
5
  },
6
);

Explications rapides :

1. fetch : Hono s’appuie sur l’API Fetch standard, donc pas besoin de req, res.
2. port : choisis le 3000, classique pour dev.
3. Callback : simple console log pour confirmer le démarrage.

Étape suivante

Pluge tes routes :

1
app.route("/auth", auth);
2
app.route("/users", users);
3
app.route("/generate", imageGeneration);

Pourquoi ?

• Routeur dédié = code lisible.
• Séparation claire entre fonctionnalités.

Récap en 3 points

1. Une seule fonction serve suffit à monter le serveur.
2. Tout le reste (auth, tokens, images) reste dans des modules séparés, le cœur reste léger.
3. Dix lignes suffisent, tu débogues plus vite, tu déploies plus vite.