DEV Community

Rishi Raj Jain
Rishi Raj Jain

Posted on

Capture IP address using Bun with ElysiaJS, Docker and Render.com

In this tutorial, I'll walk you through creation of an app, which for demonstration purposes, reveals the IP address of visitors. The app is built using Bun, ElysiaJS, and Render. By the end, you'll have a setup to fetch and display users' IP address in your web application.

Installing Bun runtime & toolkit

Cherry picked from Bun itself, Bun is an all-in-one JavaScript runtime & toolkit designed for speed, complete with a bundler, test runner, and Node.js-compatible package manager.

In short, it's everything as is in the Node.js ecosystem, just with faster and good defaults (lots of work is being done on improving it each day).

Let's begin by installing the Bun, which we'll use to manage our project:

curl -fsSL https://bun.sh/install | bash
Enter fullscreen mode Exit fullscreen mode

Supported on macOS, Linux, and WSL.

Using Render's template to use Bun runtime

Render is a cloud platform for deploying web applications. We'll utilize their pre-baked Bun template to make the most of the Bun runtime. It was flawless to use Bun runtime with Render (say instead of Vercel, for example).

git clone https://github.com/render-examples/bun-docker
Enter fullscreen mode Exit fullscreen mode

Installing Dependencies

Ensure you install all the necessary dependencies for your project:

bun install
Enter fullscreen mode Exit fullscreen mode

Installing ElysiaJS

Next, we'll use ElysiaJS into our project.

ElysiaJS is a lightweight web framework for TypeScript, making it easier to handle HTTP requests and responses using Bun! Think of it like express but for Bun.

bun install elysia
Enter fullscreen mode Exit fullscreen mode

Building Your Application

Update your app.ts with your the code to display the IP Address of the users visiting the website. In this example, we're returning a response header that includes the user's IP address.

// File: app.ts

import { Elysia } from "elysia";

new Elysia()
  .head('/', ({ set }) => {
    set.status = 200
  })
  .get("/", ({ request, set }) => {
    set.status = 200
    return request.headers.get('true-client-ip')
  })
  .listen(3000)
Enter fullscreen mode Exit fullscreen mode

With these steps, you'll be able to capture and display the IP addresses of visitors to your web application. This can be valuable for various purposes, including security, analytics, and personalization.

You're Done

In this guide, we've walked through the process of capturing users' IP addresses with the Bun Runtime, ElysiaJS framework, and Render deployment platform.

Top comments (0)