Page: 20 / 103
Hono / SonikJavaScriptNext.jsReact
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
AstroCloudflareJavaScriptSaaS / FaaS
AstroのSSRモードで作成したサイトを、Cloudflare Pagesにデプロイする際の覚書
Astroは、サーバーサイドレンダリング（SSR）モードを持つが、Cloudflare Pages / Workersにデプロイする場合、Node.jsではない実行環境に注意が必要。AstroにCloudflareのSSRモードを追加するには、`astro add cloudflare`コマンドを実行。`astro.config.mjs`の変更を自動で行い、プレビューが表示される。しかし、Markdocファイルを読み込む際のエラーが発生した場合、Cloudflare Workers / Pages Functionsの実行環境ではfsモジュールがサポートされていないため、Markdownファイルの読み込みに関しては静的にビルドしてデプロイする必要がある。
AI / MLCloudflareHono / SonikJavaScriptLLMSaaS / FaaS
HonoとWranglerを使って、ローカルでCloudflare Workers AIを試す
LLMに興味があり、Cloudflare Workers AIを使ってAPIを作る方法について説明されています。まず、Honoを使ってAPIプロジェクトを作成し、Workers AIをセットアップします。また、Aiクラスを利用してLLMの生成結果を受け取り、ローカルでWorkers AIを利用する場合は–remoteフラグを追加する必要があります。最後に、curlコマンドでAPIを呼び出す例が示されています。LLMアプリの開発にはStream形式でのレスポンスを作る方法が重要であり、HonoのStreamでレスポンスを返すAPIが利用できます。
CloudflareJavaScriptSaaS / FaaS
Cloudflare Turnstileを使って、送信ボタンのオンオフを制御する
CloudflareのTurnstileを使用して、ユーザーがボットであるかどうかを判別することができます。この機能を使用して、ボットと判定された場合にフォーム送信を制限する実装を試しました。Turnstileを管理画面からサイトに追加し、サイトキーとシークレットキーを取得します。HTMLファイルにTurnstileの設定を追加し、ボタンを無効化した状態から有効化するカスタマイズを行います。Turnstileの失敗ケースをテストする場合は、特定のSite Keyを使用します。Turnstileのドキュメントから詳細なテスト方法を確認できます。Turnstileを使用することで、簡単にボット対策ができるということです。