Category: Hono / Sonik

HonoでCloudflare Pagesを作りつつ、wrangler.tomlを使ってVectorizeをよびだしてみた

2024年春のDeveloepr WeekでCloudflare Pagesがwrangler.tomlをサポート。Cloudflare Pagesプロジェクト作成時にwrangler.tomlが自動生成され、Vectorizeも利用可能。WorkerからVectorizeを利用する方法も紹介。Vectorizeの操作確認後デプロイし、エラーなし。PagesでVectorizeが使用できることを確認。Node.jsの互換性設定時にエラーあり。cryptoのエラー解決方法が課題。Wrangler.tomlの更新によりVectorizeが利用可能に。

Published at: 2024/04/06

Hono / Sonik JavaScript

Honoの静的サイト生成機能（`toSSG`）を試してみる

最近Honoを使用してデモアプリを作成し、静的サイトビルド機能を試した結果を共有。Hono(v4)を使用し、nodejsテンプレートを利用してアプリをセットアップ。SSG対応のためにJSXでWebページを生成する方法やビルド用の処理を追加する手順を解説。ビルド時のログ記録方法や実際にビルドする際の注意点も紹介。静的ファイルを生成し、実践投入するための準備が整った。

Published at: 2024/03/20

Hono / Sonik JavaScript

Honoxで、サーバーサイドとクライアントサイドのfetchを試してみた

HonoでWebサイトを作る「honox」の実装方法を紹介。クライアント・サーバーサイドでのデータ取得やAPI呼び出しを説明。外部APIを用意し、クライアントでfetchやサーバーでfetch、レスポンス表示する手順を示す。Reactライクな使い勝手とHono/Cloudflare Workersっぽい特徴がある。honoxは個人的に興味深く、SSGの場合はAstroを、サーバー側処理が多い場合はhonoxを推奨。

Published at: 2024/03/20

Hono / Sonik JavaScript

Honoでサブディレクトリごとにリソースを分割したAPIを作る

Honoを使用してAPIを作り込む際に、ファイルの分割をサブディレクトリ・パス単位で行うことが多いです。ルートのAPIを作成し、app.routeを使用してサブディレクトリ内の追加したいAPIを登録することで、パスの指定やリソースの分割がシンプルになります。例として、/supabase/contentというパスを指定したAPIを追加する方法が説明されています。

Published at: 2023/12/27

Hono / Sonik JavaScript

HonoをVercelで動かしてみた（API / SSR HTML編）

HonoはVercelで動作すると聞いていたが、実際に試したことはなかった。Vercel向けにHonoをセットアップする方法と、Vercelでホストするためのファイルの生成方法が説明されている。Vercelにデプロイすると、Honoからのレスポンスが返ってくることが確認できた。さらに、静的HTMLの配信やHonoでSSRした結果の配信も試した。ただし、ワイルドカード（’*’）を利用する場合は注意が必要で、設定の順番によって動作が変わることがある。

Published at: 2023/12/25

AI / ML Cloudflare Hono / Sonik JavaScript LangChain.js LLM Node.js SaaS / FaaS

Cloudflare Workers / R2 / Hono / LangChain.jsを使ってRAGを作ってみる

この記事は、特定のアドベントカレンダーに関連しており、CloudflareとHonoの利用方法について説明されています。記事では、ベクターストアの作成や定期的なデータの取り込み処理などが紹介されています。また、自分のブログを参照したり、HonoでAPIを実装する方法やGUIアプリケーションの作成についても説明されています。しかしながら、Cloudflare Vectorizeの使用やFAISSの利用も検討する必要があると述べられています。

Published at: 2023/12/22

Cloudflare Hono / Sonik JavaScript momento SaaS / FaaS

MomentoをCloudflare Workers / Pages functionsで使う時は、Web SDKを使おう

この記事は、「Momento Advent Calendar 2023」および「Hono Advent Calendar 2023」の12日目の記事で、Cloudflare WorkersでMomentoのSDKを使用する際の注意点について紹介しています。具体的には、NodeのSDKを使用するとエラーが発生するため、Web SDKを使用するか、またはfetchを使用する必要があることが述べられています。また、SDKの使い方に関するポイントや注意点も説明されています。最後に、Workers KVとMomentoの比較も行われています。

Published at: 2023/12/12

Hono / Sonik JavaScript

Honoのmiddlewareを使って、Stripe Webhookの認証処理を作ってみた

この記事は、「Hono Advent Calendar 2023」の2日目の記事で、Honoを使用してStripe Webhookの認証処理を行う方法について試しています。記事では、Honoのmiddlewareを使ってAPIの動作確認を行い、StripeのWebhookのAPIも作成しています。実装にはいくつかの問題があり、解決策としてクラスを使用してイベントデータをハンドルする方法を提案しています。ただし、この実装にはまだ時間がかかるため、他の方法も試してみる予定です。

Published at: 2023/12/02

Cloudflare Hono / Sonik SaaS / FaaS

Honoで作成したWeb APIをCloudflare Workersにデプロイする覚書

Honoを使ってアプリを作成し、Cloudflare WorkersにWranglerを使ってデプロイする方法を簡単にまとめました。Honoのプロジェクトは「npx create hono」で生成され、デプロイ先のインフラ構築は後から変更できます。Cloudflare Workersを選択し、Wranglerを用いてデプロイします。デプロイ完了後には、npm run deployコマンドでWorkersへのデプロイが行えます。Wranglerのエラーが発生した場合は、Cloudflareアカウントの接続状態を確認しましょう。

Published at: 2023/11/28

Hono / Sonik JavaScript Next.js React

Next.js（App Router）でHonoを使ってREST APIを実装する

Next.jsをベースにして、Honoを使ったAPIの作成方法を試してみました。ファイルベースのルーティングに不便さを感じたため、ルーティング部分だけHonoを使用する方法を試しました。Honoで作成したAPIはNext.jsのミドルウェア上で動かします。APIパスの定義は、Next.js側で処理するパスも含める必要があります。また、Next.jsのミドルウェアでパスを書き換えることもできます。参考にしたものはこちらです：https://nextjs.org/docs/app/building-your-application/routing/middleware、https://github.com/honojs/examples/blob/main/nextjs-stack/pages/api/%5B…route%5D.ts

Published at: 2023/11/12