Amplify & GraphQLでのデータモデル設計事例集 - BioErrorLog Tech Blog
AWS Amplify & GraphQLでのデータモデル (スキーマ) 設計例をまとめます。 はじめに スキーマ設計例 Todoアプリ イベントアプリ チャットアプリ Eコマースアプリ WhatsAppクローン Redditクローン マルチユーザーチャットアプリ インスタグラムクローン カンファレンスアプリ おわりに 関連記事 参考 はじめに こんにちは、@bioerrorlogです。 最近、AWS Amplifyに注目してします。 Amplifyはフルスタックなサーバレスアプリを素早く作ることが出来るプラットフォームで、プロダクト開発の生産性を高めることが出来ます。 AmplifyプロジェクトのAPIを GraphQL (AppSync)で構築するときには、データモデルをスキーマschema.graphqlに定義する流れになります。 このGraphQLのスキーマ設計はリレーショナルデー
最初に GraphQLは参照系のQueryと更新系のMutationの２種類が区別して定義されています。 このように参照系と更新系のinterfaceを分けているため、GraphQLはCommand and Query Responsibility Segregation(CQRS)だと説明されることがあります。 確かにその通りなのですが、なぜCQRSのアーキテクチャなのか、具体的にQueryとMutationを定義する際にどういったことを意識するべきなのかということはあまり説明されていないように思います。 この記事ではCQRSがどういったことを意図しているのか、それを元にどのようにGraphQLでスキーマを設計するべきなのか説明します。 REST APIの問題点とCQRS RESTはURLで表現されるデータに対してCRUD(Post, Get, Put, Delete)のアクションを定義
Build apps users loveNhost is an open-source backend and development platform that enables developers to build and scale their web and mobile apps.
GraphQLにおけるSubscription処理について(実装例: Amplify + AppSync) - Qiita
はじめに こんにちは ! KDDI アジャイル開発センターの小板橋です。 この記事は、KDDI Engineer Advent Calendar 2020の15日目の記事となります。 GraphQLの記事はよく見かけますが、GraphQLにおけるSubscription処理についてはあまり目にすることがありません。そこで本記事は、Subscriptionに着目したもので、実装時の助けになれれば幸いです。 GraphQLについては、以前事細かく書いたので、そちらをご覧ください。GraphQL入門 仕組み realtime API pub/subのような仕組みのAPIをrealtime APIというらしいです。 参考: GraphQL Subscription このrealtime APIなのですが、大きく分けて3つのタイプに分類されます。 1.ポーリング クライアントは、定期的にリクエストを
先日、個人で愚痴を投稿するサービス「愚痴トーク」をリリースしました。 supabaseを使い、サクッとリリースまで持っていくことができたので、実装と合わせて紹介できればなと思います。 作ったもの 愚痴でつながるSNS - 愚痴トーク シンプルな愚痴投稿サービスです。カテゴリーを選び、愚痴を記入すればすぐに投稿することができます。匿名で投稿することもできるので、ぜひご活用ください。 使った技術・サービス supabase サービス開発に必要な機能を簡単に構築することができるサービスです。 詳細はこちらの記事が分かりやすいです。 特にデータの永続化に関しては、データストアにRDB（PostgreSQL）を使用できることもあり、RDBでのデータ設計に慣れている人にとっては非常に便利なサービスとなっています。 Next.js フロントはNext.jsを使っています。Next.jsでは、SSGやSS
GraphQLがあまり普及しない理由はなんですか？
回答 (3件中の1件目) えっと...ポリポリ... 単に面倒だからかな... 開発スピード遅くなるよ。みたいな。 いや、まあ、お使いの方にケチをつけたいわけじゃないですよ。 フロント側に期待する結果を送るためにいろいろサーバー側で準備しておくより、フロント側が相談したらすぐにサーバー側(API側)で、対応してくれた方がらくというかなんというか、 あと、TypeScriptの型とちょっと相性が悪いというかいろいろ苦しいような気がしました。ケースバイケースで、よりよい解決策があるのかもしれませんが、見つけられず、ひどい型の合算を経験したりとかですかね... GraphQL Ap...
graphql-codegen と Nominal Typing(Branded Type) で Custom Scalar をちょっといい感じにする | Wantedly Engineer Blog
graphql-codegen と Nominal Typing(Branded Type) で Custom Scalar をちょっといい感じにする GraphQL では標準で用意されてる Int や String 以外にも、自前で Scalar を定義することができます（ここでは Custom Scalar と呼びます）。よくある用途としては日付を表す Date や日時を表す DateTime でしょうか。 type Profile { birthday: Date } scalar DateCustom Scalar をうまく使えば GraphQL スキーマでドメインを表現する力がかなり高くなるので、みんなで育てる共通言語としてはどんどん活用していきたいです。 一方で、Apollo CLI や GraphQL Code Generator（以下 graphql-codegen）で C
出来る100%TypeScript 作って学ぶNext.js + GraphQL + Prisma(上) - GCP編
クライアントサイドでは広く普及したTypeScriptですが、その一方サーバーサイドでは比較すると緩やかな採用拡大に留まっています。もしも両方を一貫してTypeScriptでの開発が出来たら？ 本書ではTypeScriptの強みである静的型の力を最大限活かした構成でのアプリケーション開発について、SNS開発を題材に学べる実践的なチュートリアルです。
graphql/dataloader を読んだ話
graphql/dataloader のドキュメント及びソースコードを全て読んだので、その話を書く。 読むことにした第一の理由は仕事で使うからだが、以下の特徴から自分のプログラミング学習教材として適していそうだと考えたからでもある。 広く使われている OSS である GitHub の星が 11k npm trends で検索しても多くの人がダウンロードしている コードの量が少ない 実装は src/index.js に全て書かれている コメント含めて 500 行にも満たず、しかもその 1/3 くらいはコメント テストカバレッジが高い 常に 100% 初めて読むコードでテストカバレッジが高いと、テストコードを読むことで期待される挙動を確認できるので嬉しい npm trends によると、一週間で 200 万件近くダウンロードされているようだ。 目次 graphql/dataloader とは
Prismaを使ってサクッとGraphQLのバックエンドを作成する！ - FLINTERS Engineer's Blog
こんにちは。菅野です。 最近はスマホアプリ全盛期ですね。誰しもが毎日たくさんのアプリを使っていると思います。 アプリでしかサービスを展開していないものもたくさんあったりします。 そのアプリを開発するときには、バックエンド側はFirebaseのようなmBaaSを利用するのが一番手軽だと思います。 ただ、mBaaSが用意するデータベースの中にはちょっと特殊なものもありますよね。別のサービスに乗り換えたくなったときとかに困るのでは？と思ったりもします。 あと、DBはRDBであることが要件の場合も少し悩ましいです。 そこで、mBaaSに頼らずに手軽にアプリのデータ置き場を作成できるか試してみるためにPrismaを使ってGraphQLのバックエンドを作成してみたので紹介します。 Prismaとは www.prisma.io Prismaとはnode.jsのORMです。特徴はGraphQLとの親和性の
Apollo Client, now with React Hooks | Apollo GraphQL Blog
Our mission is to make Apollo Client the most modern and frictionless state management solution for React developers. As the React community has evolved and pioneered new UI development best practices over time, we’ve ensured that Apollo Client adopts and upholds those practices. In keeping with that tradition, today we’re thrilled to announce the addition of React Hooks to Apollo Client! 🚀 Intro
@graphql-codegen/typescript-react-apolloとの思い出 - スタディサプリ Product Team Blog
こんにちは、 Web フロントエンドエンジニアの @progfay です。 この記事は Recruit Engineers Advent Calendar 2022 の 12 日目の記事です。 今回はプロジェクト内で使っている @graphql-codegen/typescript-react-apollo package との思い出を書き綴っていきます。 出会い 私の所属するスタディサプリ中学講座の開発プロジェクト (通称: tara) では通信に GraphQL を採用しています。 また、 GraphQL Code Generator を使って GraphQL にまつわる型や関数の生成を行なっています。 Web Frontend では API Client として Apollo Client を使用しており、 TypeScript と React と Apollo Client を合わ
はじめに GraphQLは、2015年に公開されて以降、徐々に注目が高まっている技術になります。 以下リンクによると、2019年時点で約90％の人が注目していることが分かります。 https://2019.stateofjs.com/data-layer/graphql/ しかし、実際にGraphQLを採用して開発した事例はまだ多くありません。 その結果、GraphQLのメリットが分からず、採用に二の足を踏んでいるようなプロジェクトも多いのではないかと想定しています。 我々は、新規開発のサービスにGraphQLを採用しました。 本ドキュメントは、そのときに得たGraphQLに関する知見やRESTと比較したときのメリットを構築事例としてまとめたものになります。 本ドキュメントで記述するGraphQLのメリット、マネージドサービスを用いたシステムの実装例、具体的な他サービスとのインテグレーショ
Why not use GraphQL?
Are you looking for an Open Source Graph Manager? Cosmo is the most complete solution including Schema Registry, Router, Studio, Metrics, Analytics, Distributed Tracing, Breaking Change detection and more. I think GraphQL will change the world. There will be a future where you can query any system in the world using GraphQL. I'm building this future. So why would I argue against using GraphQL? My
Help us understand the problem. What are the problem?
Using Apollo Client with Next.js 13: releasing an official library to support the App Router | Apollo GraphQL Blog
Blog /announcement /Frontend /Using Apollo Client with Next.js 13: releasing an official library to support the App Router Back to Blog May 10, 2023Using Apollo Client with Next.js 13: releasing an official library to support the App Router The latest release of Next.js 13 (13.4) declared the new app directory as stable and it will now be the default for new projects. The app directory is a major
概要 GraphQL Rubyのバージョン1.8~以降で導入されたClass-basedの書き方を使用し、簡単なAPIを作成する方法を紹介します。 ネット上でClass-basedの書き方に関する記事が少なかったので、誰かの助けになれば幸いです。 GraphQL,GraphQL Rubyの基本概念等は以下で学習して頂けます。 - GraphQL入門 - 使いたくなるGraphQL - Qiita - GraphQL Rubyに関して - GraphQL公式 - How to GraphQL - The Fullstack Tutorial for GraphQL GraphQL with Ruby on Rails ユーザーが記事(post)の取得、作成、更新、削除を行える簡単なapiをRuby on RailsとGraphQLを用いて作成します。 ソースコードはこちらから確認する事ができ
安全なGraphQL API開発が出来るって本当？ FastAPI+GraphQL+テストで安全なAPI開発 - Qiita
安全なGraphQL API開発が出来るって本当？ FastAPI+GraphQL+テストで安全なAPI開発PythonテストGraphQL型定義FastAPI はじめに この記事はZOZOテクノロジーズ アドベントカレンダー#2 16日目の記事です！ TL;DR REST上でGraphQLを使用するメリットを説明 ORMを使用してPostgresを操作 GraphQLで用いられるスキーマ、ミューテーション、クエリについて説明 Grapheneを使用してGraphQLをFastAPI上で使えるようにする Grapheneとpytestを使用してGraphQL APIをテストする なぜREST上でGraphQLを使用するか RESTは、WebAPIを構築するためのデファクトスタンダードです。CRUD操作ごとに複数のエンドポイント（GET、POST、PUT、DELETE）を設計します。これらの
PRODUCTHasura Product OfferingsChoose from our Open Source Community Edition, fully-managed Hasura Cloud or on-prem Hasura Enterprise Edition.
GitHub - ardatan/graphql-mesh: 🕸️ GraphQL Mesh - The Graph of Everything - Federated architecture for any API service
https://www.graphql-mesh.com GraphQL Mesh allows you to use GraphQL query language to access data in remote APIs that don't run GraphQL (and also ones that do run GraphQL). It can be used as a gateway to other services or run as a local GraphQL schema that aggregates data from remote APIs. The goal of GraphQL Mesh is to let developers easily access services that are written in other APIs specs (su
技術書典10で頒布中の"GraphQLスキーマ設計ガイド"改定第2版です。 第1版を買った人はダウンロードし直しをお願いします。 本書は全文を https://github.com/vvakame/graphql-schema-guide で公開しており、自分でPDFをビルドするのが面倒じゃない人はこちらを利用するとよいでしょう。 本書の宣伝(第1版時点) https://blog.vvaka.me/2019/09/20/graphql-schema-guide/ 技術書典公式Webでの販売ページ https://techbookfest.org/product/5680507710865408
GraphQLでタスク管理アプリを作る -フロントエンド編- [React+Apollo Client+Typescript] - Qiita
GraphQLでタスク管理アプリを作る -フロントエンド編- [React+Apollo Client+Typescript]TypeScriptReactGraphQLapolloreact-hooks まえがき バックエンド編とフロントエンド編の２つに分けて、GraphQL を使ったタスク管理アプリを作っていきます。 このフロントエンド編では、React / Apollo Client / typescript によるGraphQLを使ったTODOアプリの実装をご紹介していきます。 この記事は@ebknさんの記事の後編です。 まだ読んでないというそこのあなた、ぜひご一読ください！(そして願わくばこの記事に戻ってきてくださいな) このアプリのコードは公開しています。 こんな感じのTODOアプリを作ります。 主な技術要素 React Typescript(v3.7.2以上、Optional
![GraphQLでタスク管理アプリを作る -フロントエンド編- [React+Apollo Client+Typescript] - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/2093fcd79407b074bbb10ef19e9034d9ebd3a034/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Fadvent-calendar-ogp-background-7940cd1c8db80a7ec40711d90f43539e.jpg%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9R3JhcGhRTCVFMyU4MSVBNyVFMyU4MiVCRiVFMyU4MiVCOSVFMyU4MiVBRiVFNyVBRSVBMSVFNyU5MCU4NiVFMyU4MiVBMiVFMyU4MyU5NyVFMyU4MyVBQSVFMyU4MiU5MiVFNCVCRCU5QyVFMyU4MiU4QiUyMC0lRTMlODMlOTUlRTMlODMlQUQlRTMlODMlQjMlRTMlODMlODglRTMlODIlQTglRTMlODMlQjMlRTMlODMlODklRTclQjclQTgtJTIwJTVCUmVhY3QlMkJBcG9sbG8lMjBDbGllbnQlMkJUeXBlc2NyaXB0JTVEJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMzQTNDM0MmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmcz04ODFmMDMwN2Y1YzY3NWVmNzY4YTkzYjFjZTMzZDdmMg%26mark-x%3D120%26mark-y%3D96%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9OTcyJnR4dD0lNDBDbGltYmVyMjImdHh0LWNvbG9yPSUyMzNBM0MzQyZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPWZkZGVlMWE1M2VmYzk2NDk3M2U0ZWFiNTBkNzY5Njk3%26blend-x%3D120%26blend-y%3D445%26blend-mode%3Dnormal%26txt64%3DaW4g5qCq5byP5Lya56S-44OH44Kj44O844O744Ko44OM44O744Ko44O8%26txt-width%3D972%26txt-clip%3Dend%252Cellipsis%26txt-color%3D%25233A3C3C%26txt-font%3DHiragino%2520Sans%2520W6%26txt-size%3D36%26txt-x%3D134%26txt-y%3D546%26s%3D79c1b09ef4e7b79735d133bdf8fc8683)
Ruby on RailsエンジニアがGraphQLを使うと簡単に最強のWebAPIを作れる話。(デモもあるよ！) | ⬢ Appirits spirits
ホーム 記事タイプ 技術発信 Ruby on RailsエンジニアがGraphQLを使うと簡単に最強のWebAPIを作れる話。(デモもあるよ！) API、好きですか？！ データイノベーション部 AI-labo所属の吉岡です。 私は今入社3年目で、入社当初からRuby on Railsを使っていました。 入社2年目から配属してるプロジェクトでは、Rails + GraphQLでバックエンド開発をしております。 過去に自分は趣味で色んなWebAPIを触ってきましたが、GraphQLはすごく画期的です。 Railsに慣れたエンジニアがWebAPIを開発しようと思ったとき、GraphQLを使うとこういう利点があるよ！というのを伝えたいと思います。 こういう人に読んでもらいたい！ 主に以下に当てはまる人は、より楽しめる記事になっているかと思います！ Ruby on Railsのフロント・バックエンド
GraphQL is a popular approach to building APIs, since it makes it easy for developers to access only the data they need, saving bandwidth and reducing waterfall requests, which leads to better client performance. In this tutorial we’re going to show you how to build a GraphQL API server with Deno. View source here. You could also use Apollo with npm specifiers in this tutorial. Note, however, that
熱心な REST 信者、が 挑んだ AppSync/GraphQL API 開発 | Slides | Riotz.works
「Serverless Meetup Japan Virtual #14」にて発表した際のスライドです。
Sleemo – A new way to develop serverless GraphQL backend using AWS AppSync | DevelopersIO
Sleemo – A new way to develop serverless GraphQL backend using AWS AppSync Introduction AWS has announced Direct Lambda Resolvers for AWS AppSync in Aug 2020, and I was super excited about this new feature support. Prior to this feature release, VTL(Velocity Template Language) was a MUST to implement GraphQL resolvers using AWS AppSync, which made GraphQL backend implementation using AppSync compl
しんのきです。 自社サービスで Apollo Client の fetchMore を使ったページネーションを実装する際、出たばかりの TypedDocumentNode を思い出し、これを使えばもっとシンプルに型定義できそうだと思って調査してみました。 結果としては大きなハマりどころもなく期待通り動いてくれました。 （ちなみにドキュメントにもまだ反映されていませんが、 fetchMore と updateQueries を使ったページネーションは Apollo Client v3 で deprecated になっています。これはまた別のお話。） TypedDocumentNode とは TypedDocumentNode は graphql-codegen など GraphQL 関連のツール群を作っている The Guild が 2020 年 7 月にリリースした、 GraphQL ライ
Amplify CLIを使い、労力ゼロでGraphQL/REST APIやウェブホスティング用にコンテナをデプロイする | Amazon Web Services
Amazon Web Services ブログ Amplify CLIを使い、労力ゼロでGraphQL/REST APIやウェブホスティング用にコンテナをデプロイする この記事は、Zero-effort Container deployment for GraphQL and REST APIs and Web Hosting with Amplify CLIを翻訳したものです。 AWS Amplifyを使うことで、最速かつ簡単に、AWSでクラウド対応のモバイルアプリケーションやウェブアプリケーションを構築することができます。Amplifyは、フロントエンドのウェブ開発者やモバイル開発者が AWSの豊富なサービス群を活用して、革新的で多機能なアプリケーションを構築できるよう、ツール類や各種サービスを一通り備えています。 本日リリースしたAmplify CLIをお使いになることで、フロントエ
なぜGraphQLを使うべきではないのか
Jens Neuse GraphQLの柔軟性、RESTのシンプルさとハイパフォーマンスを組み合わせたバックエンドサービス「WunderGraph」の創業者 この記事は、著者の許可を得て配信しています。 https://wundergraph.com/blog/why_not_use_graphql 私はGraphQLで世界が変わると思います。GraphQLを使って世界中のどんなシステムでもクエリができる未来が来るでしょう。私はその未来を作っているのです。では、なぜ私はGraphQLを使うことに反対なのでしょうか？私が個人的に嫌なのは、コミュニティがGraphQLの利点を宣伝し続けているときに、それが非常に一般的なもので、実際にはGraphQLとは全く関係のないものだという点です。もっと普及させたいのであれば、正直に言って、楽観的過ぎる見方を改めるべきだと思います。この投稿は、Kyle Sc
【Direct Lambda Resolvers: No VTL】 AWS AppSync GraphQL API で Velocity Template なしで Lambda Function を呼び出せるようになりました | DevelopersIO
【Direct Lambda Resolvers: No VTL】 AWS AppSync GraphQL API で Velocity Template なしで Lambda Function を呼び出せるようになりました 個人的に嬉しいアップデートです。 AWS AppSync で Velocity Template なしで Lambda Function を呼び出せるようになりました！ AWS AppSync releases Direct Lambda Resolvers for GraphQL APIs Introducing Direct Lambda Resolvers: AWS AppSync GraphQL APIs without VTL | AWS Mobile Blog Direct Lambda Resolvers for GraphQL APIs とは？ 従来、
上記は、idとnameそしてroomをプロパティとして持つ、Hotelの型です。 nameが文字列型の必須のプロパティであり、roomというオブジェクトを複数持つことが簡潔に定義できます。 ちなみに、Roomの型は以下のように表現できます。 SDLは非常にシンプルで簡潔であるため、どのような言語を扱う技術者や非技術者でも理解しやすく、チームの枠を超えて、組織のデータモデルを定義するためのドキュメントとして機能します。 一方、欠点として、SDLにはfieldの値を計算して返すResolverの実装が含まれていません。 GraphQLを機能させるためには、何らかの言語でResolverの実装を追加で行わなくてはならず、GraphQLのみをSingle Source of Truthとすることはできません。 Code First Code Fistは、開発者はResolverだけを書くのみでよく
GraphQL vs. REST APIs: Why you shouldn’t use GraphQL - LogRocket Blog
Editor’s note: This post was last updated on 14 December 2023 to inform readers about REST API and GraphQL security concerns, as well as alternatives to GraphQL, such as tRPC and gRPC. GraphQL is great if you want to work in a declarative style, as it enables you to select only the information or operations you need. However, depending on your use case, performance requirements, and tolerance for
GraphQL.Reimagined. Garph provides fullstack TypeScript experience for building GraphQL-APIs without codegen
gqlgen で GraphQLサーバーを運用した感想
これは GraphQL Advent Calendar 2019 1日目の記事です こんにちは、ebiken です。 自分は今スタートアップでバックエンドエンジニアとして、gqlgen を使ったGraphQLサーバーを運用しています。運用し始めて半年ほど経ったので感想とかを色々書いていきます。 具体的な技術スタックは、APIサーバー(Go) gqlgen、iOSアプリ(Swift) apollo-ios、管理画面(Vue) vue-apollo です。 まずは軽くGraphQLとgqlgenについて紹介します。 GraphQL graphql.org GraphQL is a query language for APIs and a runtime for fulfilling those queries with your existing data. GraphQL provides
GitHub - graphql-kit/graphql-faker: 🎲 Mock or extend your GraphQL API with faked data. No coding required.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
上記のトピックについてもう少し突っ込んだ議論をしたい。 背景: GraphQL におけるエラーの表現の手法Web API において、正常系以外の、例外(エラー)的な状況をレスポンスの情報に埋め込みたい場合、REST API では HTTP ステータスコードがよく用いられる。 一方、GraphQL API では、複数のリソースを同時に取得することが前提にあるので、「リソースXはエラーであるがリソースYは正常である」のように Partial Error の状況を表現したいことがままある。そのためステータスコードは不適であることが多い。 また、GraphQL の仕様として、返すデータのトップレベルに data と並列に errors を返すことが出来る。(手法aとする) { "errors": [ { "message": "forbidden", "path": ["x"] } ], "dat
Real World GraphQL on Next.js SSR - timakin.com | Seiji Takahashi (@__timakin__)
tl;dr Next.jsはv9.3.0以降Initial Loadingの扱いが変わった クライアント側ではApolloを利用することができるが、Authorization Headerを設定するなら一工夫必要 SSR時にはfetchによるシンプルなAPIリクエストをすると良い 昨今のWebフロントエンド 昨今のWeb開発において、React、TypeScriptとかのベース知識は当然として、やはりNext.js(あるいはNuxt.js)のような、SPA/SSR両方のニーズを汲み取りながら、dynamic routingを提供してくれたり、ビルド環境を高速に整備してくれるフレームワークが重宝されるようになってきていると感じます。 また、Reduxもアリですが、スキーマ駆動開発が推進できるGraphQL、特に尋常じゃなくステート管理が用意になるHooksとApolloクライアントの組み合わ
メディア開発部の今村です. 最近はグノシーの社内管理画面のリプレイスをしており, Next.js / Go / GraphQL / MySQLという構成で新しい管理画面を作っています. 開発の途中で, 記事検索機能のページネーションを実装する機会がありました. GraphQLサーバーのページネーションについては, RelayというGraphQLクライアントライブラリが要求しているCursor Connectionsという仕様が有名です. 今回はこの仕様を参考にしたのですが, 読めばすぐに意義や実装方法が分かるというものでもなく, 解説記事を読みながら手探りで実装を進めることになりました. そこで, この記事では, Cursor Connectionsの仕様, メリットやGoとRDBを使う場合の実装について説明します. Cursor Connectionsとは オフセットページネーション カ
安いRDBといえばPlanetScaleのHobbyプランだったり、D1だったり、古き良きVPSでセルフマネージなんて選択肢もあるが、GCPで完結すると嬉しいだとかホストマシンの面倒を見たく無いだとか、そういう場合もあると思う。 なお今回の構成で本当に激安になるかどうか無料枠で収まるかどうか、などはインスタンス設定やワークロード次第の部分もあるので試算したり予算アラートを設定した方がいい。 また個人でのホビー用途など、データが欠損してもごめんごめんで許される用途での利用に留めておいた方が無難だとは思う。ごめんごめんで許されない場合にはCloud SQLとかへ移行するなり、最初からCloud SQLとかを採用するなりしたほうがいい。 完成品のサンプルコード これはeslint設定やらローカル環境向けのdocker-compose.ymlやらも一式入った、開発環境スターターキットになっている。
Server-Side Rendered Real-time Web App with Next.js, AWS Amplify & GraphQL
Server-Side Rendered Real-time Web App with Next.js, AWS Amplify & GraphQL In this blog post we will go through building a server-rendered realtime collaborative todo list app with Next.js and AWS Amplify. You can check out the final code here and a demo here. Introduction Creating our app skeleton Adding offline functionality Preparing the Graqhql Schema for Amplify GraphQL Transform Setting up A
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CQRSの観点から考えるGraphQLのスキーマ設計
Nhost: The Open Source Firebase Alternative with GraphQL
supabase × Next × GraphQLを使ってサクッと個人サービスをリリースする
AWS AppSync(GraphQL)を用いたバックエンドの構築事例 | Fintan
GraphQLでスキーマファーストなForm Validation - Qiita
【Rails】graphql-rubyでAPIを作成 - Qiita
GraphQLとREST | GraphQLチュートリアル
GraphQLスキーマ設計ガイド - わかめの自動売り場 - BOOTH
How to Build a GraphQL Server with Deno
@graphql-codegen/typed-document-node を使ってみた
GraphQL Server実装におけるSchema FirstとCode Firstの比較
Garph - GraphQL. Reimagined. | Garph
Re: GraphQL Error、下から見るか？横から見るか？｜qsona
Go / GraphQL / RDBなサーバーのページネーション - Gunosy Tech Blog
Cloud RunとLitestreamで激安GraphQL/RDBサーバーを動かす