TLDR:
JavaScript’s landscape just got more exciting with Bun’s debut. Hitting the scene with version 1.0, Bun is a speedy toolkit that simplifies running, building, testing, and debugging JavaScript and TypeScript projects. It’s a fresh take on the cluttered world of JS tooling since node.js came around. If you’re a dev seeking a snappier tool or a sleek node.js alternative, Bun’s got you covered. With its wide file support, built-in web APIs, and impressive speed, Bun is set to shake up JavaScript runtimes. Dive in as we explore Bun and craft a DApp using its APIs, all without any extra dependencies.
Dive into this guide, and we’ll kickstart your journey with Bun. We’re crafting a simple DApp using its APIs. And here’s the kicker: we’ll spin up a server to get blockchain data with zero dependencies.
Before starting the project, let’s briefly review what makes Bun such an interesting tool.
All-in-one toolkit. Bun is a unified toolkit designed for running, building, testing, and debugging JavaScript and TypeScript applications, eliminating the need for multiple tools and dependencies.
Server capabilities:
Bun.serve()
. Easily spin up an HTTP or WebSocket server using familiar web-standard APIs like Request
and Response
.Native .env support. Bun natively reads .env
files, removing the need for third-party packages like dotenv
and cross-env
.
Hot reloading:
bun --hot
to enable hot reloading, which automatically reloads your application when files change.nodemon
, Bun reloads your code without terminating the old process, preserving HTTP and WebSocket connections and maintaining state.Additional features:
fetch
, Request
, Response
, WebSocket
, and ReadableStream
.esbuild
, allowing for custom loading logic and support for additional file types.At its core, the project aims to provide a creative example of how you can use the new Bun JavaScript runtime to work with DApps, highlighting the fact that you can make a functioning tool with zero extra dependencies.
In this guide, we’ll walk you through creating a DApp designed to fetch the balance of an Ethereum address. Leveraging Bun, we’ll set up a server that awaits user requests containing an Ethereum address. The application will then use a Chainstack Ethereum RPC node to get the balance. The retrieved balance will then be decoded and presented to the user as a structured JSON object looking like the following:
Bun installed on your machine. Bun is available on macOS, Linux, and Windows.
A Chainstack account to deploy an Ethereum node.
Once you’ve installed Bun and secured an Ethereum endpoint from Chainstack, it’s time to set up your project. Create a new directory and initiate it with the following:
This process is straightforward, especially if you’re familiar with npm init
. Here’s how I configured mine:
With that, your Bun project is set up, complete with a .gitignore
, README, and main file, which in this case is named server.js
.
.env
fileNext up, we’re going to set up a .env
file. This is where we’ll store our Chainstack endpoint. Just create a new .env
file and add this inside:
This way, our Chainstack endpoint stays safe. With Bun, we can directly get environment variables from its environment; no extra packages are needed.
Now it’s time for the code; in the server.js
file already created for us by Bun, paste the following:
Let us further explain the code.
The beginning sets up some constants, like the port number, which you can adapt to your use case, and the Chainstack RPC URL picked up from the environment variables.
PORT
— the port number on which our server will listen.
ETHEREUM_ADDRESS_REGEX
— a regular expression to validate Ethereum addresses.
CHAINSTACK_NODE_URL
— the URL of the Ethereum node we’ll be querying. This is fetched from an environment variable.
Note that the environment variable is taken directly from the Bun environment using Bun.env
.
JSON_HEADERS
— standard JSON headers used in HTTP responses.
isValidEthereumAddress(address)
This function checks if a given string matches the Ethereum address format, and the server will return an error if the pattern doesn’t match; it is good practice and enhances UX.
convertWeiToEther(weiValue)
The smallest unit in Ethereum is named Wei
. This function converts a value in wei to its equivalent in ether, considering that 1 ether = 10^18 wei, and it is used to return a human-readable value to the user.
fetchFromEthereumNode(address)
This function does the following:
getEthereumBalance(address)
This function orchestrates the process of fetching the balance:
fetchFromEthereumNode(address)
to get the balance in wei.logAndReturnResponse(status, content)
This utility function logs the response status and content and returns the response to the client.
The Bun.serve
function sets up the server:
It first logs any incoming request.
If the request is a GET request to the "/getBalance/"
endpoint, it processes it the following way:
getEthereumBalance(address)
If the endpoint doesn’t match, it sends a 404 error.
Any errors during the process are caught, and a 500 error is returned.
Finally, a log statement indicates that the server is running and listening on the specified port.
So, as you can see, we run everything within Bun. Bun.serve
spins up a server with no extra dependencies.
Your server setup is complete, and it’s time to get it up and running. For an enhanced development experience, start the server with the --hot
flag. This activates Bun’s hot reloading feature, ensuring that any modifications you make to your modules or files are instantly reflected on the server without manual restarts.
When using Bun.serve()
for HTTP server tasks, Bun got you covered. It smartly identifies any changes and refreshes your fetch handler, all without rebooting the entire Bun process. This results in almost instantaneous hot reloads, optimizing your development flow.
Start the server with the following command:
Upon execution, you should see:
With your server active, you’re all set to test your DApp. You can use tools like Postman; you can use the following curl request:
This prompts the server to retrieve the balance from the Ethereum node, returning:
While the console will log the following:
You’ve just crafted a streamlined API to fetch Ethereum balances using Bun without additional dependencies.
In the ever-evolving landscape of JavaScript, Bun emerges as a promising toolkit that simplifies and streamlines the development process. Through this guide, we’ve witnessed the power and efficiency of Bun, crafting a DApp to fetch Ethereum balances with minimal fuss and zero extra dependencies. The ease with which we can set up servers, integrate with blockchain nodes, and benefit from hot reloading showcases Bun’s potential to become a staple in the developer’s toolkit.
As we move forward, we must keep an eye on tools like Bun that prioritize developer experience and performance. Whether you’re a seasoned developer or just starting, embracing such tools can significantly enhance your productivity and the quality of your projects.
TLDR:
JavaScript’s landscape just got more exciting with Bun’s debut. Hitting the scene with version 1.0, Bun is a speedy toolkit that simplifies running, building, testing, and debugging JavaScript and TypeScript projects. It’s a fresh take on the cluttered world of JS tooling since node.js came around. If you’re a dev seeking a snappier tool or a sleek node.js alternative, Bun’s got you covered. With its wide file support, built-in web APIs, and impressive speed, Bun is set to shake up JavaScript runtimes. Dive in as we explore Bun and craft a DApp using its APIs, all without any extra dependencies.
Dive into this guide, and we’ll kickstart your journey with Bun. We’re crafting a simple DApp using its APIs. And here’s the kicker: we’ll spin up a server to get blockchain data with zero dependencies.
Before starting the project, let’s briefly review what makes Bun such an interesting tool.
All-in-one toolkit. Bun is a unified toolkit designed for running, building, testing, and debugging JavaScript and TypeScript applications, eliminating the need for multiple tools and dependencies.
Server capabilities:
Bun.serve()
. Easily spin up an HTTP or WebSocket server using familiar web-standard APIs like Request
and Response
.Native .env support. Bun natively reads .env
files, removing the need for third-party packages like dotenv
and cross-env
.
Hot reloading:
bun --hot
to enable hot reloading, which automatically reloads your application when files change.nodemon
, Bun reloads your code without terminating the old process, preserving HTTP and WebSocket connections and maintaining state.Additional features:
fetch
, Request
, Response
, WebSocket
, and ReadableStream
.esbuild
, allowing for custom loading logic and support for additional file types.At its core, the project aims to provide a creative example of how you can use the new Bun JavaScript runtime to work with DApps, highlighting the fact that you can make a functioning tool with zero extra dependencies.
In this guide, we’ll walk you through creating a DApp designed to fetch the balance of an Ethereum address. Leveraging Bun, we’ll set up a server that awaits user requests containing an Ethereum address. The application will then use a Chainstack Ethereum RPC node to get the balance. The retrieved balance will then be decoded and presented to the user as a structured JSON object looking like the following:
Bun installed on your machine. Bun is available on macOS, Linux, and Windows.
A Chainstack account to deploy an Ethereum node.
Once you’ve installed Bun and secured an Ethereum endpoint from Chainstack, it’s time to set up your project. Create a new directory and initiate it with the following:
This process is straightforward, especially if you’re familiar with npm init
. Here’s how I configured mine:
With that, your Bun project is set up, complete with a .gitignore
, README, and main file, which in this case is named server.js
.
.env
fileNext up, we’re going to set up a .env
file. This is where we’ll store our Chainstack endpoint. Just create a new .env
file and add this inside:
This way, our Chainstack endpoint stays safe. With Bun, we can directly get environment variables from its environment; no extra packages are needed.
Now it’s time for the code; in the server.js
file already created for us by Bun, paste the following:
Let us further explain the code.
The beginning sets up some constants, like the port number, which you can adapt to your use case, and the Chainstack RPC URL picked up from the environment variables.
PORT
— the port number on which our server will listen.
ETHEREUM_ADDRESS_REGEX
— a regular expression to validate Ethereum addresses.
CHAINSTACK_NODE_URL
— the URL of the Ethereum node we’ll be querying. This is fetched from an environment variable.
Note that the environment variable is taken directly from the Bun environment using Bun.env
.
JSON_HEADERS
— standard JSON headers used in HTTP responses.
isValidEthereumAddress(address)
This function checks if a given string matches the Ethereum address format, and the server will return an error if the pattern doesn’t match; it is good practice and enhances UX.
convertWeiToEther(weiValue)
The smallest unit in Ethereum is named Wei
. This function converts a value in wei to its equivalent in ether, considering that 1 ether = 10^18 wei, and it is used to return a human-readable value to the user.
fetchFromEthereumNode(address)
This function does the following:
getEthereumBalance(address)
This function orchestrates the process of fetching the balance:
fetchFromEthereumNode(address)
to get the balance in wei.logAndReturnResponse(status, content)
This utility function logs the response status and content and returns the response to the client.
The Bun.serve
function sets up the server:
It first logs any incoming request.
If the request is a GET request to the "/getBalance/"
endpoint, it processes it the following way:
getEthereumBalance(address)
If the endpoint doesn’t match, it sends a 404 error.
Any errors during the process are caught, and a 500 error is returned.
Finally, a log statement indicates that the server is running and listening on the specified port.
So, as you can see, we run everything within Bun. Bun.serve
spins up a server with no extra dependencies.
Your server setup is complete, and it’s time to get it up and running. For an enhanced development experience, start the server with the --hot
flag. This activates Bun’s hot reloading feature, ensuring that any modifications you make to your modules or files are instantly reflected on the server without manual restarts.
When using Bun.serve()
for HTTP server tasks, Bun got you covered. It smartly identifies any changes and refreshes your fetch handler, all without rebooting the entire Bun process. This results in almost instantaneous hot reloads, optimizing your development flow.
Start the server with the following command:
Upon execution, you should see:
With your server active, you’re all set to test your DApp. You can use tools like Postman; you can use the following curl request:
This prompts the server to retrieve the balance from the Ethereum node, returning:
While the console will log the following:
You’ve just crafted a streamlined API to fetch Ethereum balances using Bun without additional dependencies.
In the ever-evolving landscape of JavaScript, Bun emerges as a promising toolkit that simplifies and streamlines the development process. Through this guide, we’ve witnessed the power and efficiency of Bun, crafting a DApp to fetch Ethereum balances with minimal fuss and zero extra dependencies. The ease with which we can set up servers, integrate with blockchain nodes, and benefit from hot reloading showcases Bun’s potential to become a staple in the developer’s toolkit.
As we move forward, we must keep an eye on tools like Bun that prioritize developer experience and performance. Whether you’re a seasoned developer or just starting, embracing such tools can significantly enhance your productivity and the quality of your projects.