"LayerX、スタディサプリ、SHEと考える GraphQLが向いている現場とは？運用実践LT" で登壇した資料です。 引用した資料 [Rails アプリに RESTful API のレールを敷いて生産性が大きく上がった話 | Wantedly Engineer Blog](https://w…
ここ数年、私はGraphQL APIサーバーの開発を行っています。GraphQLは柔軟かつ強力なAPIクエリ言語で、Webフロントエンドからモバイルアプリなどいくつかのクライアントがそれぞれ画面に必要なデータをフェッチしており、フロントエンドの開発パフォーマンスが向上しました。 破壊的変更の問題 私のチームではGraphQLサーバーはRailsとGraphQL Rubyを用いてCode First[1]で開発しています。 しかし、複雑性が増すにつれてクライアントやクエリの全体像を把握できずに破壊的変更を引き起こすこともあり、その変更が既存のクライアントに影響を与えないように注意深くSchemaを管理する必要があります。 実際に最近、fieldやmutationの引数の変更がクライアントに不具合をもたらす事態に発生しました。 破壊的変更の検知 そもそもGraphQLは仕様が網羅されているSc
※この投稿は米国時間 2022 年 12 月 1 日に、Google Cloud blog に投稿されたものの抄訳です。 オンラインで、組み立て式のテーブルを注文したとします。ところが、パッケージを開けてみると、組立説明書が入っていません。完成品がどんなものかはわかっていても、それぞれのパーツをどう組み立てればいいのか、まるでわかりません。設計が不十分な API を使うコンシューマ開発者も、同じような経験をしているといえます。適切に設計された API なら、容易に見つけ、検索してアクセスし、使用することができます。高品質の API は、コンシューマ開発者がアイデアをひらめき、新しいユースケースを作り上げる手助けになってさえくれます。 もちろん、API 設計を改善する方法はあります。たとえば、RESTful のプラクティスに従うなどです。しかし、お客様が知らず知らずのうちに、ちょっとした不便
Amplify Boost Up #04 Amplify Japan User Group さん主催の Amplify Boost Up の4回目に登壇したので、その内容について補足しつつまとめてみました。 資料は以下の SpeakerDeck で共有しておりますので、ご確認ください Amplify を使っている理由 我々開発運用チームは社外の方も含めて5名です。この人数で動画配信サービスの「hod」と番組関連グッズを販売している「HTBオンラインショップ」の２つのオンライン事業のシステムを担当しています。やらないことを少しでも増やすために、サーバレス構成を基本としており、その流れでAmplifyを活用しています。 だいぶ、省略した部分はありますが、以下にアーキテクチャを載せます。 フロントエンドのデプロイ先としては Amplify Hosting を利用しており、フロントエンドはサービス
GraphQLはオワコンですか?これからはtRPCの時代ですか?REST APIの位置づけは何ですか? いやー良いですね、このズバッとした質問。 特に流行というものに敏感な方なのかなーと言う印象ですね。 何が流行って何が廃れてるのかとかもはや少しずつゆるく置いていかれてる自分のような人間に聞かれても難しいですが、GraphQLをオワコンと称するにはまだ早いと思います。同じくtRPCもその時代になってるかと問われると微妙です。 GraphQLも現代でまだ戦えるツールですし、tRPCと比較すると仕様がオープンに残ってたりするのでオワコンですかと聞かれるとそうじゃないと思います。 tRPC は流行の兆しはあるものの、まだ自分が見てる範囲だと "兆し" のレベルを出ていないと思います。自分の見ている範囲で言えば、使ってる人が GraphQL よりも少ない状況だと思います。ただ GraphQL より
皆さんこんにちは。筆者は最近、TypeScriptからGraphQLを使用するためのコード生成ツールnitrogqlを開発しています（初手宣伝）。 直近は、GraphQLのスカラーに関する機能拡張を行っていました。この記事では、そこで得た知見と考察について共有します。 GraphQLのスカラーとは GraphQLにおけるスカラーとは、それ以上分解できないデータ型のことです。GraphQLのデータはスカラー・オブジェクト・enumに分類でき、データの末端はスカラーまたはenumになります。 GraphQL仕様では組み込みのスカラー型が定義されており、以下のものがあります。 Int Float String Boolean ID また、カスタムスカラーとして、追加のスカラー型をスキーマ上で定義することもできます。 スカラー値がサーバー・クライアント間でやり取りされるときはシリアライズする必要が
この記事について 今年の7/27にGitHub Projectベータと呼ばれていたものがGAになりました。 新しくGAになったProject(以下ProjectV2と書きます)は、 フィールドを用いて、アイテムに様々なメタデータを追加できる カードに設定した様々なメタデータごとにかんばんを作ることができる アイテムのグループ化・ソート・フィルタが簡単にできる 日付・各種メタデータを軸として指定したグラフを作ることができるので可視化が簡単 といった、classic Projectではできなかったあれこれが一つのProjectでできるようになっており、とても便利になりました。 そしてProjectV2がGAした今、一部例外を除いてclassic Projectを新規作成するというのはできなくなっています。 そのため、ProjectV2への移行というのは今後どんどん進んでいくと思われます。 Yo
Next.js の App Router が安定版となり、React Server Components (以下 RSC) を実際に試す環境が整ってきた。 実際、今年はやれどこそこのプロダクトが Next.js を採用しただのやっぱり捨てだのといった話題が尽きなかったように思う。 かくいう自分自身も、今年は App Router の案件に取り組んで RSC と格闘する日々を送っていた。 その過程で、こんなようなことを考えるようになったので、今回はこの辺りの話を書き残しておこうと思う（何回か X に同じ旨の POST は上げていたけど、一回もちゃんとまとめてなかったので）。 RSC がない頃の、別の言い方をすると getServerSideProps を使っていた頃の、Next.js におけるアプリケーションの設計は、トラディショナルな MVC にかなり近しい。 ここでいう MVC は、Sp
銀の弾丸ではないので良し悪しあるのは当然として、それを差し引いても以下の2つの要素があるのではと思った。 なんとなく使ってもメリットが十分得られない RESTでできてたことができなくなる（※ちゃんと調べればできる） なんとなく使ってもメリットが十分得られないWeb界隈は良くも悪くも新しい技術をとりあえず使ってみるところがあると思っていて、そこがGraphQLは十分に事前知識を持って導入しないとメリットが薄いところとミスマッチを起こしてネガティブな意見が出るのかなと思う。 GraphQLはもともとFacebookがReact, Relayとの組み合わせで使い始めたもので、クライアントライブラリとしてのRelayと、IDやページネーションについての追加仕様を公開している。ライブラリとしてのRelayは使わなくても仕様に乗っかることはできるのでそれをRelayスタイルと言ったりする。出典を忘れた
はじめに 今回の記事ではGraphQLについて、公式などを参考にしながら基本的なことをまとめてみました。 自分自身GraphQLのキャッチアップを始めるときに こんなこと知っときたかったなあ、ということをまとめたので これからGraphQLの勉強を始める方や興味のある方はよかったら読んでみてください。 大枠を掴むことをイメージして書いており、深い部分の説明を省いている箇所もあるので その点はご了承ください。 そもそもGraphQLとは？ GraphQLはAPIのクエリ言語です。 クエリ言語というとSQLが有名ですが、SQLがデータベースに対してクエリを実行するのに対し、 GraphQLはAPIに対してクエリを実行します。 ちなみに、プログラミングにおけるクエリとは データに対する問い合わせや要求などを一定の形式で文字に表現すること、 要は所定の形式で対象のデータにやりたいことを伝えること、
最近 Hasura に入門していて，その前に GraphQL 自体を学べる Hasura のチュートリアル「GraphQL Tutorial」を実施してみた❗️ Hasura の話はほとんど出てこなくて，GraphQL と REST / gRPC の比較・GraphQL オペレーションの解説などを基礎から学べる．また実際に GraphiQL で GraphQL クエリを実行しながら体験もできるので「GraphQL ってたまに聞くけどわからんぞー🔥」という GraphQL 未経験者におすすめできる入門コンテンツだった ＼( 'ω')／ hasura.io ちなみに日本語もあるけど最新ではなく（例えば GraphQL vs gRPC がなかったり）英語を翻訳して実施するのが良いと思う． hasura.io ちなみに僕自身は GraphQL の基本的なことは理解できているはずだけど（例えば過去
概要 こんにちは、Offers を運営している株式会社 overflow でフロントエンドのテックリードをしている Kazuya です。今回は、筆者が担当しているプロダクト「Offers MGR(オファーズマネージャー) 」で採用しているディレクトリ構成の一部について書かせていただきます。 後述しますが、「Offers MGR」では求められる要件が複雑且つ通信で取得する情報量が膨大であることからAPI関連のディレクトリ構成もやや特殊なものになっています。ベースは以前こちらの記事で紹介した「Viewsレイヤー」を拡張させる形になっています。 専用構成になっている感があるため、参考になるかは分かりませんが、ぜひ最後まで読んでいただけると幸いです。 Offersのディレクトリ構成はこちら 弊社フロントエンドのボスであるAhomu先生が担当されているOffers側のディレクトリ構成は以下の記事をご
前回の記事では、GraphQLをプロダクトに投入するにあたり検討したエラーレスポンス設計パターンについて紹介しました。 この記事では、フロントエンドとバックエンド間でのバリデーションスキーマの取り決めについて解説します。 GraphQLスキーマ設計で悩まれている方の参考になれば幸いです。 ※ この記事に記載の内容は当時の情報です。最新の状況を反映していない可能性があるため、ご了承ください。 はじめに ハコベル配車計画では、バックエンドとフロントエンド間の通信においてGraphQLを活用しています。1年ほど運用していく中で、設計における課題がいくつか表面化してきました。 今回、社内ハッカソンイベントHackWeek 2023 [1] が開催され、ハコベル配車計画チームでは1年間の運用の中で感じた、GraphQLスキーマの設計における悩みを振り返ることにしました。 バリデーションにおける課題
さぼです、沖縄でWebと設計について考えてます。2023/09/23 に沖縄で行われたTechBaseOkinawa2023 にて上記のタイトルで登壇しました。 今回の内容は GraphQLを設計の観点から考えてみる GraphQLの目的や用途を整理する GraphQLを使う時、または使わない時のヒントを持ち帰ってもらう 最近、GraphQLじゃなくてRESTで良くないと思うケースがなんとなくわかってきたのでそれを共有する という感じで話しました。話した内容を文字に起こし少し改修してZennでも共有することとします。 まえおき 最近はクライアントAppとサーバーAppを分けて実装する事が増えてきた クライアントの環境はますます複雑になっている クライアントとサーバーはWebAPIで通信を行う クライアントが複雑になるのと同時にWebAPIの要求が更に増して来ている APIの要求・応答を効率
今さらですが！GraphQL、ついに、挑戦しました👏 興味はあったものの、まだ着手できていなかったのですが、お仕事の関係もあり、挑戦するに至りました。 ということで！GraphQLとは何なのかから、どう実装したのかまでを整理しておこうと思い、本記事を作成しました！ GraphQLを使ったことなくても、「へー、大体こんな感じなんだなー🤔」みたいな感じで伝われば良いなと思っています。 挑戦したこと 今回挑戦したのは、GraphQLです！ 「GraphQLってどうやって使うの？」っていうことを学ぶところから、実際に自分で使ってみる、サービスを軽く実装してみるっていうところに挑戦しました。 ちなみにこんなの実装してみました。 みんな大好き、タスク管理ですね👏 GraphQLって何？ まず、GraphQL とは何かについて、整理していきます。 概要 A query language for y
グラフモデルとSoEとGraphQL / TECH STAND #7 GraphQL 2022/03/03 に行われた stand.fmさん主催の TECH STAND #7 にて上記のタイトルで登壇しました。 今回の内容は GraphQLの採用を検討するにあたって、RESTとの違い、BFFとの違いをデータの観点から言語化したかった Hasuraが良いという意見と, Apolloやgraphql-ruby, gqlgenなどのハンドライティングなGraphQLが良いという意見の違いがどこから生まれているかの考察がしたかった データ指向アプリケーションデザイン(2017年リリース)にSoEやGraphQLへの言及がないため, 今だとこういう内容が書かれているんじゃないかという考察がしたかった をモチベーションに調査・検討しました。 発表のハイライトはこちらです。 以下発表内容です。一部発表時
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
