Hono on Cloudflare with SST
Create and deploy a Hono API on Cloudflare with SST.
We are going to build an API with Hono, add an R2 bucket for file uploads, and deploy it using Cloudflare with SST.
Before you get started, make sure to Create your Cloudflare API token.
1. Create a project
Let’s start by creating our app.
Init SST
Now let’s initialize SST in our app.
Select the defaults and pick Cloudflare. This’ll create a sst.config.ts
file in your project root.
Set the Cloudflare API token
You can save your Cloudflare API token in a .env
file or just set it directly.
2. Add a Worker
Let’s add a Worker. Update your sst.config.ts
.
We are enabling the Worker URL, so we can use it as our API.
3. Add an R2 Bucket
Let’s add an R2 bucket for file uploads. Update your sst.config.ts
.
Add this above the Worker
component.
Link the bucket
Now, link the bucket to our Worker.
4. Upload a file
We want the /
route of our API to upload a file to the R2 bucket. Create an index.ts
file and add the following.
Add the imports.
And install the npm packages.
5. Download a file
We want to download the last uploaded file if you make a GET
request to the API. Add this to your routes in index.ts
.
We are getting a list of the files in the files in the bucket with Resource.MyBucket.list()
and we are getting a file for the given key with Resource.MyBucket.get()
.
Start dev mode
Start your app in dev mode.
This will give you the URL of your API.
Test your app
Let’s try uploading a file from your project root. Make sure to use your API URL.
Now head over to https://my-hono-api-jayair-honoscript.sst-15d.workers.dev
in your browser and it’ll load the file you just uploaded.
6. Deploy your app
Finally, let’s deploy your app!
You can use any stage name here but it’s good to create a new stage for production.