GraphQLでファイルアップロードを実現する際に参照したリンク

こんにちは。nap5です。今回は小ネタです。

GraphQLでのマルチパートフォームの送信処理をハンディにハンドリングできるYogaというものがあったので、試してみてできたので、その際に参考にしたリンクをまとめてみました。

nextjsのAPIルートでYogaGraphQLサーバーをサーブしてクライアントからファイルアップロードするとできました。apolloとかだと苦しい感じがあったので、yoga便利だなと思いました。

ファイルアップロード以外はGraphQLに寄せてもいいかと考えていました。GraphQLでのファイルハンドリングが煩雑なので、RestAPIでいいと思っていましたが、Yogaライブラリを使えば、そこのボトルネックは解消されて実践投入できそうな感触はありました。ファイル上限サイズ等などの細かい制限はかかってくるとは思いますが、中身はGraphQLで実はPOSTしてたみたなAPIが一つ潜んでいてもいいんじゃないかと思いました。

useSWRでGraphQLを使用する際のハンドリング方法について

SWR with graphql-request how to add variables in swr?

I want to add variables to my swr which fetch using graphql request. this is my codeimport { request } from "graphql-request";import useSWR from "swr";const fetcher = (query,

Stack Overflow

外部サイト

https://stackoverflow.com/questions/65480752/swr-with-graphql-request-how-to-add-variables-in-swr/65562706#65562706

Yogaを使ったファイルアップロードのハンドリングについて

https://the-guild.dev/graphql/yoga-server/docs/features/file-uploads

the-guild.dev

外部サイト

https://the-guild.dev/graphql/yoga-server/docs/features/file-uploads

YogaをNextjsに組み込む際の設定について

https://the-guild.dev/graphql/yoga-server/docs/integrations/integration-with-...

the-guild.dev

外部サイト

https://the-guild.dev/graphql/yoga-server/docs/integrations/integration-with-nextjs

NextjsにYogaライブラリを組み込んだデモコード

graphql-yoga/examples/nextjs at main · dotansimha/graphql-yoga

🧘 Rewrite of a fully-featured GraphQL Server with focus on easy setup, performance & great developer experience. The core of Yoga implements WHATWG Fetch API and can run/deploy on any JS envir...