daangn/plantae

複数の HTTP クライアント(Fetch・Ky・Axios)に同じミドルウェアを適用できるリクエスト・レスポンス API ジェネレータです。

開発の材料自由に使える · MITWeb・Next.js・フルスタックTypeScript難易度
72+0今週0
1フォーク0Issue

中辛 の解説

TypeScript で書かれた Fetch・Ky・Axios 用の middleware フレームワークです。各クライアントごとに createFetch()createKyHooks()createAxiosInterceptors() を提供し、プラグイン化された認証・リトライ・タイムアウト処理を組み込めます。 からインストールして数行のコードで動作し、すぐに複数クライアント向けの統一ミドルウェアが実装できます。

이런 레포예요

이럴 때 쓰면 좋아요

  • 複数の HTTP クライアント(Fetch・Ky・Axios)をサポートする SaaS プロバイダが、認証・リトライ・エラーハンドリングを統一したい場合
  • エンタープライズツール開発で、顧客ごとに異なる HTTP クライアント選択に対応する必要があるとき
  • 認証トークンの自動更新・タイムアウト処理などの横断関心事を、クライアント依存なくポリシーとして再利用したいとき

핵심 기능

複数 HTTP クライアント対応の統一ミドルウェアインターフェースRequest・Response フックベースのプラグインアーキテクチャ依存関係ゼロの超軽量実装

대안 대비 차별점

Fetch・Ky・Axios など複数クライアントに対し、1 度書いたプラグインを共通コードベースで再利用できるため、クライアント切り替え時の middleware 再実装コストが不要です。

食べた人たち

実際に使ってみた人の記録です — 一言も完走の記録も、確認のうえで公開しています。

試食評 · 使った人のひとこと

まだ試食評がありません。使ってみたら、最初のひとことをどうぞ。

ほかのリポジトリの試食評を見る →

이 레포로 만든 것들

🖋 완주 인증하기

아직 이 레포로 만든 완주 인증이 없어요. 첫 밥도장을 찍어보세요!

このリポジトリの作り方

はじめてですか? むずかしくありません — 上から順にたどれば、自分の環境で動かして味見できます。

すぐ動かしてみるNode.js (yarn)

ギット飯がリポジトリの構成を確認して組み立てた実行コマンドです。ターミナルに貼り付ければ、取得から実行までまとめて進みます。

git clone --depth 1 https://github.com/daangn/plantae.git &&
cd plantae &&
yarn

실행 명령은 README를 확인하세요.

コードは自分の環境で動きます — はじめて見るリポジトリなら、中身にひととおり目を通してから実行するのがおすすめです。

README가 안내하는 자세한 단계 보기
  1. Plantae パッケージをインストールする
npm install plantae
  1. 希望する HTTP クライアント用の関数をインポートし、プラグインを指定する
import { createFetch } from "plantae";
import myPlugin from "../myPlugin";

export const myFetch = createFetch({
  client: fetch,
  plugins: [myPlugin()],
});
  1. 他のクライアント(Ky など)を使う場合は、対応する関数でセットアップする
import { createKyHooks } from "plantae/ky";
import ky from "ky";

const hooks = createKyHooks({
  client: ky,
  plugins: [myPlugin()],
});

export const myKy = ky.extend({ hooks });
  1. カスタムプラグインを作成する場合は、beforeRequestafterResponse フックを実装する
import type { Plugin } from "plantae";

export default function AuthPlugin(): Plugin<{ token: string }> {
  const context = { token: "token" };
  return {
    name: "plugin-auth",
    context,
    hooks: {
      beforeRequest: (req) => {
        req.headers.set("Authorization", context.token);
        return req;
      },
      afterResponse: async (res, req, retry) => {
        if (res.status === 401) {
          const refresh = new Request("https://example.com/refresh-token");
          const token = await retry(refresh).then((res) => res.text());
          context.token = token;
          req.headers.set("Authorization", `token ${token}`);
          return retry(req);
        }
        return res;
      },
    },
  };
}

ギット飯トライで味見

入れるのが面倒で少し不安だったなら — 安全スキャンからインストールまで、ターミナル一行で終わります。

ターミナルに貼り付ければ、ギット飯の安全スキャン → 隔離フォルダへ clone → インストール → 実行方法の案内まで自動です。はじめてでも大丈夫 — この一行だけです。

npx gitbap-try daangn/plantae

Node.js さえあれば、インストールなしで動きます · ギット飯トライとは? →

スター推移 · 7日

72+0 / 7일

使いやすさ · まねしやすいか

サンプル評点 20/100
  • ゆるいライセンス
  • テストあり
  • サンプル集
  • 最近の更新
  • AGENTS.md
  • llms.txt
  • テンプレート

更新の情報なし · 2023 年に作成

「웹·Next.js·풀스택」 こういうリポジトリを毎週受け取りませんか?

毎週月曜の朝、選んだ一膳だけ。広告なし · いつでも解除。

自分のリポジトリですか? README にギット飯バッジを貼る
[![깃밥](https://www.gitbap.com/badge/daangn/plantae.svg)](https://www.gitbap.com/r/daangn/plantae)
Claude からそのまま使う — ギット飯のつなぎ方

ギット飯を Claude につなぐと、こうしたリポジトリを Claude・Cursor・Codex から直接さがして試せます。

方法 ① コネクタ URL

Claude の設定 → コネクタにこのアドレスを貼り付け。

https://www.gitbap.com/api/mcp
方法 ② プラグイン(試用まで)

プラグインを入れると /gitbap-trending·/gitbap-try のスラッシュコマンドで、その場でリポジトリを試せます。Claude Code で下の 2 行を順に実行してください。

/plugin marketplace add jakeparkcolde/gitbap-cowork
/plugin install gitbap-cowork@gitbap
つなぎ方をくわしく →

AI が README をもとに要約しました · 原文を見る