This article is the first part of a course where we build a fullstack app with Next.js, GraphQL, TypeScript,Prisma and PostgreSQL. In this article, we'll create the data model and explore the different components of Prisma.
原文(投稿日：2019/12/03)へのリンク Airbnbは、APIの大半をGraphQLに移行して、ページロード時間の短縮とより直感的なユーザエクスペリエンスを実現することに成功した。GraphQL Summitで行われたプレゼンテーションでは、Brie Bunge氏が、同社の多くのチームで使用されたマルチステージのマイグレーションプロセスについて説明した。 各ステージを成功させることによってAirbnbでは、100パーセント型安全でオーバーフェッチングのないApolloおよびGraphQLアプリを完成すると同時に、マイグレーション作業の各過程を通じてサイトの稼働と運用を維持することにも成功した。ApolloとGraphQLの適用によって、従来のRESTベースのアーキテクチャでは到底実現できなかったような、新たなパフォーマンス改善を実現するための基礎を作り上げたのだ。 マイグレーション
こんにちは、バックエンドエンジニアの奈良です。 好きなコーヒーはイルガチェフェです。 先週12/6(木)に、はじめての自社オンリーのTech Meetupを開催しました。 当日は10名程の方々が参加していただきました！参加していただいた皆様、ありがとうございました。 今まで年一回の頻度で他の会社さんと一緒に勉強会を開催させてもらっていたのですが、 もっと気軽に参加してもらえて、弊社のことを知ってもらえる会を実施したいと思い、Tech Meetupを開催しました。 その様子をレポートさせてもらいたいと思います。 発表内容 技術的な話題になる前に、CTOの鈴木に会社のことや技術部のことについて紹介してもらいました。 スペースマーケットの名前は知ってもらっていましたが、使ったことのある人はほとんどいなかったので、 サービスの説明もちゃんとしてもらってよかったです。 早く、みんな一回は使ったことあ
GraphQLとクライアントサイドの実装指針.md GraphQLとクライアントサイドの実装指針 GraphQLって何 Facebookが開発した クエリ言語 今はGraphQL Foundationに移管されている https://quramy.github.io/graph-api-note/#/ GraphQLの特徴 スキーマと静的な型 Demand Driven Architecture Composition 1. スキーマと静的な型 スキーマには可能なクエリや操作の全てが記述されている。 表現方法はいくつかあるが、SDL(Schema Definition Language)で表現されることが多い。 type User { id: ID! name: String! age: Int friends: [User] articles: [Article] } type Arti
Next.js + Apollo Next.js の公式リポジトリには Apollo を使用する際のサンプルコードがあるが、 これらを参考に SSR するとかなりパフォーマンスが悪い。 with-apollo with-typescript-graphql 例えば、with-typescript-graphql の/pages/index.tsx を見てみる。 ... import { useViewerQuery, useUpdateNameMutation, ViewerDocument, } from '../lib/viewer.graphql' import { initializeApollo } from '../lib/apollo' const Index = () => { const { viewer } = useViewerQuery().data! ... re
こんにちは。宿泊事業本部の宇都宮です。この記事では、GraphQLをベースに、GoとTypeScriptでスキーマを共有しながら開発を進める方法について紹介します。 この記事は 一休.com Advent Calendar 2019 の16日目の記事です。 GraphQLとは ライブラリの選定 コードファースト vs スキーマファースト Goによるサーバ実装 TypeScriptによるクライアント実装 おわりに 参考文献 GraphQLとは GraphQLは、Facebookによって開発された、Web APIのための クエリ言語 です。その特徴もSQLに似ていて、データの取得や更新を宣言的な記述によって行うことが出来ます。 仕様は公開されており、リファレンス実装として graphql-js がありますが、それ以外にも様々な言語でGraphQLサーバを実装できます。 GraphQLでは以下の
せっかく TypeGraphQL で TypeScript Ready な GraphQL にしたのに Sequelize はもったいない。 先週の記事(【2019年10月版】Apollo + Sequelize で GraphQL やるなら TypeScript バッチリの TypeGraphQL がおすすめ!、【2019年10月版】Cloud Functions + Cloud SQL で TypeGraphQL + Sequelize の Apollo Server を動かす) にて Cloud Functions 上で Apollo + TypeGraphQL を使って GraphQL の API エンドポイントを作成してみましたが、その際に使った ORM は Sequelize でありまして、以下のような不満がありました。 Classの宣言にアノテーションでRDB用のマッピングも
はじめに 基本的にPrismaの公式チュートリアル Build a GraphQL server from Scratch に倣って、Prisma、graphql-yogaを使ってGraphQLサーバーを書いていきます。 本記事では上記チュートリアルとは少し異なるアプローチ 言語：TypeScript DB：ローカルに立てるDocker上のMySQL でご紹介します。 チュートリアルを進める前に、Prismaって何？という方は、 prisma - 最速 GraphQL Server実装 Prisma.ioでGraphQL APIサーバーを楽して作る 辺りを一読してPrismaをざっくりと理解し、公式の Prisma Introduction: What, Why & How を確認してみるのがオススメです。 対象読者 GraphQLに関する知識をある程度有している方 GraphQL API
2020-11-06GraphQL, TypeScript, React を用いて型安全に社内システムをリニューアルした話こんにちは。メドレーのエンジニアの山田です。現在、医療介護求人サイト「ジョブメドレー」のチームで開発を担当しています。 今回、ジョブメドレーの社内スタッフが利用する社内システムをリニューアルした事例をご紹介します。 リニューアル対象はバックエンド領域も含まれますが、本記事ではフロントエンドの話を中心にご紹介します。 また、弊社デザイナー酒井が以前投稿した デザイナーがデザインツールを使わずに、React を使ってデザインした話 も関連しているので、よろしければあわせてご覧ください。 リニューアルの背景社内システムでは、求人サイト「ジョブメドレー」を利用する求職者に関する情報や求職者の応募状況を管理しています。 前回のリニューアルから時間が経ち、複雑性が高くなってきました
graphql-codegen で型定義を生成する (React, Apollo, TypeScript)TypeScriptReactGraphQLapollo 本記事はこのリポジトリでやったことのまとめです。 GraphQL + TypeScript への課題感 TypeScript(に限らず他の静的型付の言語) と GraphQL を使うと、型の二重定義が発生がちです。折角 GraphQL に通信規約としての型を書いているのに、それを多重定義することで、運用の面倒臭さやバグの温床になりかねない、という懸念がありました。 今回は、graphql のスキーマとクエリを書くと、サーバー向けに resolver の型定義、クライアント向けにクエリの型定義を生成し、それによってできるかぎり型安全なコードを扱うのをゴールとします。 やり方 graphql-code-generator を使います
突然ですが、@suzukalight は来年からジョブチェンジして、バックエンドエンジニアとして働くことになりました！ 弊社の開発環境としては、Node, GraphQL, koa, apollo-server, RxJS などを採用しているのですが、順次キャッチアップするとして、まずは基本中の基本からしっかり押さえておきたいと思い、GraphQL の素振りを始めています。 Apollo-Server を使った GraphQL サーバの具体的なチュートリアルとして、こちらの素晴らしい記事がありましたので、これをなぞりつつ、TypeScript で記述したり、適宜改造したりしながら素振りをしていこう、というのが本記事の主旨になります。なお数回のシリーズとして書いていく予定です。 今回実装したリポジトリはこちらです； https://github.com/suzukalight/study-g
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
