Hono Tutorial Pt. 1
Kiran

Kiran @chauhankiran

Joined:
Mar 23, 2025

Hono Tutorial Pt. 1

Publish Date: Mar 23
0 0

This is the first article in the series where we are going to build a simple back-end application in Hono in Node.js environment.

mkdir hono-app
Enter fullscreen mode Exit fullscreen mode

Go inside the created hone-app folder.

cd hono-app
Enter fullscreen mode Exit fullscreen mode

Create a package.json file using npm with default values (-y).

npm init -y
Enter fullscreen mode Exit fullscreen mode

Let's install hono package.

npm i -E hono
Enter fullscreen mode Exit fullscreen mode

In order to use Hono in the Node.js environment, we need to install @hono/node-server package.

npm i -E @hono/node-server
Enter fullscreen mode Exit fullscreen mode

Finally, let's install nodemon to ease the development. We should install nodemon as development dependency.

npm i -E -D nodemon
Enter fullscreen mode Exit fullscreen mode

For now, we are done with setup. Let's move on to the coding side. Create a new file with name app.js.

touch app.js
Enter fullscreen mode Exit fullscreen mode

Open this app.js file (or hono-app folder) in your favorite text-editor/IDE and write the following code.

import { Hono } from "hono";

const app = new Hono();
Enter fullscreen mode Exit fullscreen mode

We are using the latest import...from syntax in our Node.js application! We have imported the Hono and then created an instance of the Hono() using a new keyword and saved it as an app.

Let's now define a root route and return a simple Hello! text as a response (don't forget to return the response).

import { Hono } from "hono";

const app = new Hono();

app.get("/", (c) => {
    return c.text("Hello!");
});
Enter fullscreen mode Exit fullscreen mode

Here, c is a context and it contains both request and response in it with many useful methods such as .text(). The .text() method return response in plain text with string passed to it e.g. Hello!.

Now, to run the application on a given port, we need to use @hono/node-server package. Import serve from @hono/node-server package.

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

const app = new Hono();

app.get("/", (c) => {
    return c.text("Hello!");
});
Enter fullscreen mode Exit fullscreen mode

Use the serve method as follows.

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

const app = new Hono();

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

serve(app, (info) => {
    console.log(`Listening on http://localhost:${info.port}`);
});
Enter fullscreen mode Exit fullscreen mode

serve() function takes Hono instance as the first argument and second argument should be a callback function with info param that gives useful information such as port. If you don't define the port value as we did, the default is 3000.

Before we go further and run the application, we need to do some adjustment in the package.json file. As we are using the latest import...from syntax, we need to define type as module. Also, update the main entry point to app.js file.

{
    "name": "hono-app",
    "version": "1.0.0",
    "main": "app.js",
    "type": "module",
    "scripts": {
        "test": "echo \"Error: no test specified\" && exit 1"
    },
    "keywords": [],
    "author": "",
    "license": "ISC",
    "description": "",
    "dependencies": {
        "@hono/node-server": "1.14.0",
        "hono": "4.7.5"
    },
    "devDependencies": {
        "nodemon": "3.1.9"
    }
}
Enter fullscreen mode Exit fullscreen mode

Finally, let's add two scripts dev and start to run the app.js file with nodemon and node respectively.

{
    "name": "hono-app",
    "version": "1.0.0",
    "main": "app.js",
    "type": "module",
    "scripts": {
        "dev": "nodemon app.js",
        "start": "node app.js"
    },
    "keywords": [],
    "author": "",
    "license": "ISC",
    "description": "",
    "dependencies": {
        "@hono/node-server": "1.14.0",
        "hono": "4.7.5"
    },
    "devDependencies": {
        "nodemon": "3.1.9"
    }
}
Enter fullscreen mode Exit fullscreen mode

With these changes, we are now ready to run the application. Run the following command in the terminal.

npm run dev
Listening on http://localhost:3000
Enter fullscreen mode Exit fullscreen mode

Open http://localhost:3000 in the web browser and you should see Hello! as the plan text. If that is the case, congratulations! You have just created first Hono application in Node.js.

Comments 0 total

    Add comment