React + GraphQL から成る Kaizen Ad のフロントエンド - Kaizen Platform 開発者ブログ
追記: 2021年6月現在はアーキテクチャが変わってきています。 次の記事に詳細を書いていますので、一読をお願いします。 Kaizen Adのフロントエンドアーキテクチャの遷移について - Kaizen Platform 開発者ブログ Kaizen Platform でフロントエンドエンジニアをしている山本です。この記事では、我々が運営するサービス「Kaizen Ad」のフロントエンド部分をご紹介します。 Kaizen Ad とは Kaizen Ad は、動画広告をサポートするマーケットプレイスです。 カスタマーがクリエイティブを依頼すると、広告クリエイティブを作成するグロースハッカーから動画広告クリエイティブが納品される仕組みです。 カスタマーにとってはクリエイティブ改善の運用を省力化できると同時に、グロースハッカーにとっても新しい働き方が創造できるソリューションとして提供しています。
記事の概要 この記事は、Meta 社 relay.dev チームの Jordan Eldredge 氏の Tweet で紹介された GraphQL 成熟度モデル (GraphQL maturity model) を個人的な見解を加えながら和訳した記事です。 jordaneldredge.com GraphQL を実装する上で、どの程度 GraphQL を使いこなせているか判断するための参考になれば幸いです。 実際の成熟度モデルの和訳 最初の Tweet 私は、GraphQLの利点がまだ十分には理解されていないと思っています。ほとんどの組織では、GraphQL の提供する価値を捉えきれていません。 そこで、私は「GraphQL成熟度モデル」をスケッチしてみました。あなたの組織はどの程度成熟して（＝使いこなせて）いますか？ もし以下に示す13の成熟度を達成していたとしたら、よりGraphQLを
AWS Startup ブログ スタートアップが AWS Amplify を使うべき3つの理由 こんにちは、スタートアップ ソリューションアーキテクトの水馬です。 今回のテーマは AWS Amplify です。 みなさん Amplify はご存知でしょうか？ Amplify は AWS を使用したスケーラブルな Web およびモバイルアプリ開発のためのフレームワークです。近年の複雑化するアプリケーションでは多くの場合、複数の AWS サービスを組み合わせてサービスを構築する必要があります。開発者はバックエンドの構築に加え、これらと連携する多くのソースコードをアプリケーションに実装する必要がりました。 Amplify を用いれば、複雑なバックエンドの構築、アプリケーションとの統合を簡略化し、開発者は本質的な機能の開発に集中することができるようになります。 今回は、スタートアップ において、
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは、PayPayフリマバックエンド開発の三宅です。 今回、YJTC2019-shibuyaにてPayPayフリマのバックエンド設計について話して来ましたので内容を紹介したいと思います。 本記事ではセッション前半のバックエンド部分をメインに紹介させていただきます。よろしくおねがいします。 PayPayフリマとは PayPayフリマはフリマに特化したサービスとして10月7日にiOS版をリリースしました。PayPayの名前がつく通り、PayPayを利用してフリマの商品をかんたんに購入でき、買い手から価格の相談をできる機能などが特長です。 また、ヤフオク!とも連携し、ヤフオク!に出品されている固定価格商品の一部もユーザー体験に変わ
React及びその周辺技術、事例から見るReact最新情報！──HTML5とか勉強会イベントレポート 佐川 夫美雄（Ashiras, inc.） 5月31日、イベント＆コミュニティスペース dots.にて「第65回HTML5とか勉強会──React最新情報」が開催されました。React及びその周辺技術、事例からReactの最新情報をキャッチアップします。 React現状確認 ＠koba04氏は「React現状確認」というタイトルで、現在、Reactの取り巻く状況を様々まとめて語りました。 皆さんご存知の通り、React.jsはFacebookが開発しているJavaScriptライブラリです。まず、Reactはどのようなアプリで利用されているかということからお話します。具体的な例として、まず挙げられるのがFacebookです。ここではバリバリに利用されていますし、Instagramでは、アプ
GraphQL Code Generator で TypeScript の型を自動生成する - クックパッド開発者ブログ
技術部の外村（@hokaccha）です。 レシピサービスのフロントエンドを Next.js と GraphQL のシステムに置き換えている話 - クックパッド開発者ブログ という記事を書きましたが、この中で詳しく説明しなかった GraphQL のスキーマやクエリから TypeScript の型定義を自動生成する仕組みについて紹介します。 なお、今回紹介したコードは以下で試せます。 https://github.com/hokaccha/graphql-codegen-example-for-techlife GraphQL Code Generator を使った型生成 GraphQL のスキーマから TypeScript の型を生成するためのライブラリはいくつかあります。 Apollo GraphQL Code Generator などが有名どころです。今回はシンプルさや拡張性を考えて G
2018年の初めくらいから、仕事でGraphQL APIを何度も作っている。サーバーサイドもクライアントサイドも実装している。 最近クライアント側にRelayを使ってみている。 GraphQLのクライアントとしてはApolloを使う場合が多いと思うが、Facebook製のRelayもかなりよくできている。以前はTypeScriptに対応していなかったが、今はTypeScriptも使える。最近のバージョンではhooksのAPIがexperimentalではなくなり、ReactのSuspense API（Suspense for Data Fetchingは使わずに）と合わせて使える。 RelayはGraphQLのスキーマに制約を設けることで、クライアント側のAPIがデータの再取得やページネーションなどを抽象化している。換言すると、Relayからデータの再取得やページネーションに必要なスキーマ
実サービスで GraphQL API をインターネットに公開する際は、悪意あるクエリに対する防衛が欠かせません。この記事における「悪意あるクエリ」とはサービスに意図的に負荷をかけるクエリのことです。GraphQL では 、木構造や再帰的な構造を利用して、一回のクエリで容易に数百万・数千万件のデータを取得することができます。そのようなクエリを実行してしまうと、アプリケーションサーバーや、その後ろにいる別のサービスに甚大な負荷がかかります。これは攻撃者からしてみれば恰好の的で、なんらか対策を講じる必要があります。 幸いこうした問題はよく知られており、クエリを静的に解析するライブラリがいくつか存在します。しかし、そうしたライブラリをどう使うかといったことはあまり議論されておらず、効果的な対策を行うのは依然として難しい状況だと感じます。この記事では、典型的な負荷の高いクエリとその具体的な対策を紹介
こんにちは、サーバーサイドエンジニアの竹若です。今回GraphQLにおけるエラーハンドリングを調査、Ruby on Railsとgraphql-rubyを使って実装する機会があったので、そこで得られた知見を共有させていただきたいと思います。(なお今回の実装はプロダクション環境には出ていません) GraphQLの仕様とプラクティス それではまず初めに、GraphQLが仕様に定めているレスポンスの返し方を見ていきましょう。 レスポンスのフォーマットに関するプラクティス GraphQLのプラクティスの1つに、レスポンスのhttp statusを200で統一し、レスポンスのerrorsキーにエラーの詳細な情報を持たせるというものがあります。 なぜならGraphQLではリクエストに複数のクエリを含めることができるからです。 https://www.graph.cool/docs/faq/api-ee
tl;drNext.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クライアントの組み合わせは、フロ
本文書は、 Kibela Web API の実装についてのスタイルガイドです。 実装の原則 GraphQL official site に従う GraphQLに足りない部分は Relay server specに従う 実例としてはGraphQL+Relayで構築されているGitHub API v4を参考にする Naming フィールド名 ※ graphql-ruby 1.8 以降は自動的にcamelizeされるようになっているので、任せましょう。 camelCase にしてください。 定義の際にmodel本来の名前と変える必要がありますが、クライアントサイド言語（JS, Swift, Java）はcamel caseが基本なので、そのまま使えるというメリットがあります。 なお camel case はいくつかのバリエーションがありますが ActiveSupport の String#cam
Become part of a community passionate about building better apps.
Announcing Pub/Sub: Programmable MQTT-based Messaging
Announcing Pub/Sub: Programmable MQTT-based Messaging2022-05-12 This post is also available in 简体中文, 日本語, Español. One of the underlying questions that drives Platform Week is “how do we enable developers to build full stack applications on Cloudflare?”. With Workers as a serverless environment for easily deploying distributed-by-default applications, KV and Durable Objects for caching and coordin
API設計が楽でコア業務に集中できるように。GraphQLで開発がどう変わったか？タクシーアプリGOの中の人に聞きました【技術選定の裏側：GraphQL編 vol.1】 | IT/Webエンジニアの転職・求人サイトFindy – GitHubからスキル偏差値を算出
ハイクラスエンジニア向け転職・求人サイト。自社開発のWeb企業の求人多数！GitHub登録をすると、IT/Web企業とマッチングします。ユーザーサクセス (キャリア)面談も実施。
はじめに マイクロサービスの開発では、サービスが増え続けるバックエンドに対して、フロントエンドは接続先が増えるため、開発効率を下げてしまいます。その対策として、さまざまな設計パターンが存在します。 弊社の開発ではGraphQL Gatewayを用いていますが、そこに至るまでや周辺の技術/アーキテクチャを解説します。 マイクロサービスとフロントエンド マイクロサービスを採用する場合、フロントエンド（ウェブアプリケーション、モバイルアプリケーションなど）は複数のサービスとの連携が必要になることが多いです。各マイクロサービスは通常、API（REST、gRPCなど）を提供し、フロントエンドはこれらのAPIを通じてデータの取得や操作を行います。 API Gateway API Gatewayは、フロントエンドとマイクロサービス間の中間に位置するコンポーネントとして機能し、マイクロサービスアーキテクチ
こんにちは、ユビーでプロダクト開発エンジニアをしている Sosuke Suzuki です。 最近、チームのエンジニア間の連携がいい感じだなーと思ったので、その要因の一つであるモブプログラミングについて、実践したことを紹介します。 はじめに 最近、私の所属するチームでは、データベース、バックエンド、そしてフロントエンドにも大きな変更を加える必要がある、規模の大きなプロジェクトに取り組んでいました（そして、今も同じチームで別の大きなプロジェクトに取り組んでいます！）。 そのプロジェクトの具体的な内容を書くことはできませんが、大雑把に事情を説明します。 数年前に設計されたいくつかのテーブルがあり、それは当時からずっとユビーのビジネスにとって重要でした。しかしそれらのテーブルは、この数年の間に複雑になったビジネス要件には耐えられなくなっていました。 このままではビジネスの機会を毀損することになりま
宣言的UIの状態管理とアーキテクチャSwiftUIとGraphQLによる実践/swiftui-graphql
宣言的UI https://speakerdeck.com/sonatard/xuan-yan-de-ui GraphQL実践ノウハウ https://speakerdeck.com/sonatard/graphql-knowhow GraphQLの誤解 https://speaker…
モバイルとの相性最強と言われるgRPCをFlutter x NestJSで実装し、Stream通信や認証、複数言語実装に使えるか試す
まとめ 相性バツグンといわれる、モバイル x gRPCは思ったよりずっと簡単に実装可能 複数言語間でもProtocol Buffersの恩恵により型変換を意識することなくスムーズに開発が進められる。 メソッド、引数の型、引数の返り値の型が自動生成されるのでとても良い RESTful APIにおけるheaderを、表現力の高いMetaDataとして利用し、認証認可等にも使えそう Streamをうまく使いこなせば、ユーザー体験をめっちゃ高くできそう。チャットやゲームなどの双方向通信が比較的楽に実装できるかも どんな人向きでない記事？ NestJSの詳しい実装を知りたい方 Bidirectional streaming, Client streamの詳細実装を知りたい方 モバイル向け通信技術の本格的な選択肢、gRPCを実際に試してみたい 現在、私の働いているMinediaで開発しているサービス群
k0kubun.hatenablog.com 非常に丁寧に書かれていると思うのですが、少し反論したい部分があるので、記載したいと思います。 GraphQLのキャッシュ効率について クエリをパースしないとキャッシュの可否を判定できないため、HTTPキャッシュが難しい こちらに関して、２つの観点から反論してみたいと思います。 まずに、GraphQL は GET リクエストでも送ることができます。Serving over HTTP | GraphQL によると、http://myapi/graphql?query={me{name}} のような URL の GET リクエストができます。(※そもそも、これ自体は GraphQL の絶対的な制約ではなく、 GraphQL を一般的に HTTP で提供するときのプラクティス、という位置づけです) そして、GraphQL は 1 回のリクエストで送らな
RejectKaigi 2017で「GraphQL on Rails」という発表をしました - Bit Journey's Tech Blog
id:gfxです。 RejectKaigi 2017で「GraphQL on Rails」という発表をしました。 当日はKibelaでプレゼンテーションをしたので、それをそのまま資料として発表します。 2017/08/19 at Speee, Roppongi. 自己紹介 Kibelaという情報共有サービスを開発している Kibelaの公開Web APIをフルスクラッチするにあたってGraphQLを調べているところ 自分のOSSを誰かに引き継いだり共同開発体制にしていたら、GitHubのpinned reposがすべてorganizationのものになった 本日の話 GraphQLとは GraphQLをRailsに組み込む話 GraphQLとは Web API のためのクエリ言語 http://graphql.org/ RESTful API の次を狙うWeb APIアーキテクチャという位
こんにちは。エンタメ領域のDXを推進するブロックチェーンスタートアップ、Gaudiyでエンジニアをしている高島（@takashima_katsu）です。 Gaudiyでは現在、BFFレイヤとしてGraphQLサーバを利用しています。導入してから1年以上が経ちますが、スキーマ駆動開発はDXの向上につながっていると実感しています。（以下のブログが詳しいです。） techblog.gaudiy.com 今回は、GraphQLの利点を活かしたエラーハンドリングの方法について、Gaudiyでの実践をもとに書いてみたいと思います。エラーハンドリングの実装について課題感のある人や、現在GraphQL Errorsを使っている人に、ぜひ読んでいただけると嬉しいです。 1. エラーハンドリングとGraphQL 2. GraphQL Errorsにおける課題 3. GraphQLエラーハンドリングの実践 3-
One Model Everywhere Falcor lets you represent all your remote data sources as a single domain model via a virtual JSON graph. You code the same way no matter where the data is, whether in memory on the client or over the network on the server. The Data is the API A JavaScript-like path syntax makes it easy to access as much or as little data as you want, when you want it. You retrieve your data u
こんにちは。武田（@tkdn）です。 GraphQL を API として採用したサービスを今年序盤にリリースしています。具体的な内容は今年の夏サミ 2020 の公募枠でお話させていただいたのでよろしければ資料もご参考ください。 週一でリリースし続けるためのフロントエンドにおける不確実性との戦い方 / Developers Summit 2020 Summer C-4 - Speaker Deck今日は GraphQL や Apollo Server についての振り返りと反省を中心に供養しておきます。GraphQL 採用に迷いがある開発者、Apollo Server を採用しようとしている開発者へ向けた知見になれば幸いです。 まとめてみたら GraphQL みが思いの外少なくなりましたが、GraphQL Advent Calendar 2020 の 23 日目の記事です。 なぜ GraphQ
すばらしきポケモンエコシステム⚡️ - Qiita
タイトルだけだと何を言っているのか意味が分からないと思うのですが、最近ポケモン図鑑を作っていて、その過程で思いの外ポケモン関連のエコシステムが充実していたので、発見したものを紹介いたします。 ちなみに私はXYまでは全作プレイしてました。スプラトゥーン沼のせいで時間がなくなり卒業しました。(自慢ですがウデマエXです) データ系 まずは要となるポケモンデータを管理してくれているパッケージたちを紹介します。この分野は競合がたくさんいるのですが、私が見つけた中で一番筋が良さそうだったのはこちらです。 GitHub - fanzeyi/Pokemon-DB: A Pokemon database in JSON format. 次のそれぞれの要素に対してのJSONがあります。 ポケモン アイテム ワザ タイプ 例えば私はクチートが好きなのですが、クチートのデータはこんな感じ。 { "base": {
GraphQL Tokyo #10 Links: p11 https://speakerdeck.com/qsona/graphql-for-service-to-service-communication-protocol p12 https://note.com/qsona/n/nfc73a8e82dff p14 https://speakerdeck.com/qsona/graphql-changing-and-unchanging p23, p28 https://www.apollographql.com/docs/apollo-server/features/schema-stitching/ p30, p31 https://www.apollographql.com/docs/apollo-server/federation/introduction/ p33 https:
Convert JSON into gorgeous, typesafe code in any language. Generate models and serializers from JSON, schema, and GraphQL for working with data quickly & safely in any programming language. Generate Code Now { "people": [ { "name": "Atticus", "high score": 100 }, { "name": "Cleo", "high score": 900 }, { "name": "Orly" }, { "name": "Jasper" } ] }Provide sample JSON files, URLs, JSON schemas, or Gra
「Mix Leap Study」はヤフーの独自技術や業界の最先端テクノロジーに触れる勉強会。第59回は「React とその仲間たち」と題して、より実践的にReactを使うための仲間たちにも注目。株式会社Gemcookの藤本卓哉氏が、プロジェクトにGraphQLを採用してみた経験から、いい点、悪い点を語ります。 React + GraphQLで社内の負債を解決した話 藤本卓哉氏：みなさん、こんばんは。ジェムクックの藤本です。『React + GraphQLで社内の負債を解決した話』というタイトルでお話ししたいと思います。よろしくお願いします。 まず簡単にプロフィールです。藤本卓哉と言います。去年（2019年）30歳になって、今年（2020年）31になります。会社の代表兼エンジニアをやっています。会社の代表といったら、経営ガッツリやっているんかなって言われがちなんですけど、僕けっこうエンジニア
ROUTE06 でソフトウェアエンジニアをしている @MH4GF です。 ROUTE06 ではエンタープライズ向けビジネスプラットフォーム「Plain」を開発しています。この記事では 2023 年 8 月に Plain クラウド EDI の Web フロントエンドで採用している技術について、その選定理由をまとめました。 現代の Web フロントエンド技術は領域ごとに選択肢が多く、プロダクトに最適な技術選定をする上で検討事項が多いと感じます。この記事がフロントエンド技術選定において参考になれば幸いです。 前提 プロダクトの特徴 技術選定に影響するプロダクトの特徴を箇条書きでまとめます。 エンタープライズ向け SaaS 現在開発中のプロダクトは商取引におけるクラウド EDI のドメインにフォーカス Plain が解決する課題は、元々フルスクラッチで開発すると 1 年かかるプロダクトの開発期間を
RedwoodJS RedwoodJS は JavaScript/TypeScript で構築されたフルスタック Web アプリケーションフレームワークです。RedwoodJS プロジェクト自体は Tom Preston-Werner 氏 (GitHub 創設者であり Gravatar や Jekyll などの作成者) が中心となり始まりました。 私自身もつい最近になって同じ職場の @sakitoさんに存在を教えてもらったばかりです。 RedwoodJS は、READMEから抜粋するだけでも、次のような機能を持ちます。 フォーマット・ディレクトリ・ビルドなどに関するデフォルト構成 単一ファイルによるルーティング定義 GraphQL Client / API (with Serverless deploy) の構築 ページ・レイアウトなどのジェネレータ CRUD 操作に特化した Scaffo
作って学ぶGraphQL。gqlgenを用いて鉄道データ検索API開発入門 | フューチャー技術ブログ
春の入門祭りの7日目です。 はじめに※このエントリーはGoでGraphQLサーバアプリ開発の入門記事です。技術要素にGo, gqlgen, Docker, PosgreSQLなどが登場します。 TIG DXユニット 1の真野です。技術ブログ運営もしています。 フューチャーではOpenAPI関連の過去記事からお察しもできるように、REST-likeなWebAPIを実装することが多いです。しかし日本製HeadlessCMSのmicroCMSを触ってみたの記事で紹介されたように、HeadlessCMS界隈を初めGraphQLのAPIを提供するサービスが増えている体感もあり、GraphQLを春の入門祭りのテーマにしました。 学習する上でドキュメントを読み込むだけでは忘れがちです。手を動かしながらタイトルにあるように鉄道データ検索APIをGraphQLで実装していきましょう。実装の前に結果のみを知り
こんにちは。LINEフィナンシャル開発センター フロントエンドエンジニアの峯です。 先日新卒としてLINE証券プロジェクトに配属となり、最初のタスクとしてRecoilによる状態管理の導入に取り組みました。 その際、なぜRecoilにしたのか、また本番開発にRecoilを使うにあたって設計に気をつけたことなどを本記事でご紹介しようと思います。 技術選定 いままでの状態と課題 LINE証券フロントエンドではReact+Typescriptによる開発を採用しており、いままでのグローバルな状態管理にはUnstated を用いていました。 Unstatedでは Container classを状態の単位とし、その内部の stateを setState によって更新します。状態を使用したいコンポーネント側では、<Subscribe> コンポーネントによって情報を読み出すことができます。 一方ご存知の通
IndexedDB, Worker, Server-side Rendering そしてフロントエンドの未来 // Speaker Deck
IndexedDB, Worker, Server-side Rendering そしてフロントエンドの未来
Gridsome - Build blazing fast websites with Vue.js and GraphQL
A Jamstack framework for Vue.js Gridsome makes it easy for developers to build static generated websites & apps that are fast by default 🚀 Get started Open-source MIT Licensed. GitHub (v0.7.23) CMSsAny Headless CMS, Contentful, WordPress, Drupal, Sanity.io, etc. DataAny APIs, Databases, AirTable, YAML, CSV, JSON, etc. MarkdownAny Git-based CMS, Forestry, Netlify CMS, Blogs, Documentation.
Releases, Offers & More Be the first to hear about our newest content, best promotions and upcoming events. Plus get 25% off your next purchase. Newsletter Sign Up Download Accounts Your email address is your account identifier. You can create a password, or just download from the links sent via email. My Orders (Resend order emails) How We're Different Hands-on instructions Solutions to real-worl
Slack botが更新する研究室のHPを作りました。 できたもの https://moriokalab.com Slack botが動いている様子 なぜ作ることになったか 〜ある日〜 指導教員「研究室のHPが欲しいから作って。何も管理したくないからWordPressとかCMSはいやだ。Slackから投稿出来るようにしたい。」 後輩くん「分かりました」 〜その後〜 後輩くん「先輩・・・お願いします・・・」 俺「任せろ」 こうして我々はHPを作ることになった。 要件整理 使う技術を決める前に、まずは頂いた要件を整理します。 webページを作る 動的に変更されるコンテンツがある データのリレーションは特になし サーバーやパスワードとか、何も管理したくない 研究室のみんなで更新したい Slackからアップデートできるようにしたい なるほど。どう作るかぼんやりと見えてきました。 構成を考える まず
社内でOSSへの貢献をもっと奨励していきたいねと話していて, そもそも普段どれくらい貢献できているか知りたくなった. 以前, 自分のポートフォリオに貢献しているOSSのリストを出すのをやっていて, ちょっと改造したら組織内のメンバー全員のものもすぐに出せそうだったのでやってみた. (というのをずっと前にやっていたけど宣伝するのを忘れていた.) モチベーション OSSに(趣味にせよ仕事の一部にせよ)貢献している同僚はけっこういるけど, 「こういうのやったよ!」と宣伝してくれない限りあんまりどういう活動をしているのか知らない. 「今月はこれだけの人たちがOSS貢献してました」というのを社内の全エンジニアで眺めてわいわい盛り上がれると, 自分も何かやってみようという気になるだろうし, 「これに手をつけてみたいけど, どこから手をつけたらいいかわからないから詳しそうなあの人に聞いてみよう」となって
6.サーバーサイドの開発裏話 | GraphQLを本番投入して実感したメリットと課題 - 行灯Labo（アンドンラボ）｜JapanTaxi採用ブログ
こんにちは、JapanTaxi SREチームの水戸です。 インフラからアプリケーションまでサービスの安定性向上のための改善を日々行っています。 今年9月のリニューアルで、JapanTaxiアプリ向けのAPIにGraphQLを導入しました。この記事では実際にGraphQL導入したことで感じたメリットと課題を書いていきたいと思います。 現在のJapanTaxiアプリにおけるGraphQLの導入状況 今回は数年間開発を続けてきたアプリのリニューアルプロジェクトということで、既存部分を使いまわしている部分も多々あり全てのAPIを一斉に置き換えるのは難しい状況でした。そのためリリース時点ではアプリの変更に合わせて改修が必要になった参照系のAPIにのみGraphQLを導入しました。 リリース後は順次RESTからGraphQLに切り替えを進めており、一部では更新系でもGraphQLを使い始めています。
【Go編】Next.js × Go × AWSでJWT認証付きGraphQLアプリとCI/CDを構築してみよう - Qiita
■ご案内■ 本連載の背景/作成できるアプリケーション/進め方をご理解頂く上でも【環境構築編】 をご一読頂けると幸いです。 【環境構築編】 【Next.js編】 【Go編】 👈いまここです 【AWS編】 これからも頑張ってハンズオン系の記事を書いていきたいと思っているので、いいねっと思って頂けたらLGTM押していただけると励みになります！ 環境構築 本サンプルアプリの環境構築方法は【環境構築編】に記載しているので、そちらをご参照ください。 クリーンアーキテクチャ風なディレクトリ設計 以下の記事を参考にしつつクリーンアーキテクチャ風なディレクトリ設計をしてみました。 各階層間をインターフェースを利用して、システムの各部分を疎結合化しております。 # 簡単のため一部ファイルは割愛しています go-graphql-jwt-api/ ├── build/ │ ├── db/ │ └── dock
Build GraphQL APIs you can trust Learn how to design and build predictable, performant, and secure GraphQL APIs at scale. Hey 👋 I'm Marc-Andre Giroux! I've always found there was a lack of resources on how to build reliable GraphQL servers. Over the last few years, I helped build and maintain some of the biggest GraphQL APIs out there at both Shopify and GitHub. During those years, I also worked
概要 こんにちは、Offers を運営している株式会社 overflow の Software Engineer（主戦場はフロントエンド）の Kazuya です。2022 年 2 月入社でそこまで日が経っていないので、今回は社内の技術スタックではなく、今後社内でも検討されるかもしれない「BFF」について触れていきたいと思います。BFF（Backend For Frontend）導入することで得られるメリット/デメリット、GraphQL を用いた技術スタック事例など紹介していますので、ぜひ参考にしてもらえればと思います。 BFF とは？ BFF とは、Backend For Frontendの略称で、「フロントエンドとバックエンドの中間に配置され双方の複雑な処理を緩和させる責務を持つアーキテクチャ設計パターン」のことです。これだけだと分かりづらいので簡単にまとめると、「バックエンドの API
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GraphQL 成熟度モデル - とろろこんぶろぐ
スタートアップが AWS Amplify を使うべき3つの理由 | Amazon Web Services
CtoCフリマアプリの作り方 (バックエンド編) 〜6カ月間のPayPayフリマ開発を支えた設計〜
React及びその周辺技術、事例から見るReact最新情報！──HTML5とか勉強会イベントレポート
Relayに学ぶGraphQLのスキーマ設計 - cockscomblog?
GraphQL API を悪意あるクエリから守る手法 - yigarashiのブログ
GraphQLにおけるエラーハンドリングの仕方 - ZOZO TECH BLOG
Real World GraphQL on Next.js SSR
GraphQL Coding Style Guide - bitjourney.kibe.la
Dgraph | GraphQL Cloud Platform, Distributed Graph Engine
GraphQL Gatewayはフロントエンド開発を幸せにする
開発スピードを維持しながらモブプログラミングを実施した話
「GraphQLは何に向いているか」に対してのちょっとした反論 - 病みつきエンジニアブログ
GraphQLにおけるエラーハンドリングの実践 - Gaudiy Tech Blog
Falcor: One Model Everywhere
GraphQL 採用における反省と Apollo Server の運用について
純粋培養GraphQL / Pure GraphQL Architecture
Convert JSON to Swift, C#, Java, C++ and more • quicktype
「React」とFacebookのWeb API「GraphQL」で技術的負債を取り除く方法
Plainのフロントエンドにおける技術選定(2023年8月版) - ROUTE06 Tech Blog
RedwoodJS を Ruby on Rails と比較してみる
【LINE証券 FrontEnd】Recoilを使って安全快適な状態管理を手に入れた話
The Pragmatic Bookshelf | CoffeeScript
研究室のHPをサーバレス、SPA、GraphQL、ChatOpsで作った - Qiita
個人/組織のOSS貢献を可視化する - 貳佰伍拾陸夜日記
Production Ready GraphQL
流行りのBFFアーキテクチャとは？｜Offers Tech Blog