5분 안에 GraphQL 이해하기

GraphQL이 인터넷에 나타났을 때, 그것은 유행병처럼 전파되었다.GraphQL은 일하는 방식을 철저히 바꾸고 각지에서 계속 발전시켰다.만약 네가 5분의 시간이 있다면, 나는 네가 알아야 할 모든 것을 설명할 것이다.

종전

2012년까지 전 세계 휴대전화의 사용량은 놀라운 수치에 이르렀다.이것은 일종의 침입으로 제품을 조정하지 않는 회사가 위험에 직면하게 된다.당시 페이스북은 위험에 처해 있었다.
페이스북은 주로 인터넷 회사다.그래서 그들은 인터넷 보기를 이용하여 IOS 응용 프로그램을 하나의 사이트로 만들었다.곧 그들은 인터넷 보기가 개똥이라는 것을 깨달았다.그래서 그들은 더 좋은 고객 체험을 얻기 위해 완전히 네이티브로 재제작하기로 결정했다.그들은 즉시 다른 벽에 부딪혔다.
기존의 구조는 작용하지 않는다.기존 REST api의 단점이 데이터의 유연성을 허용하지 않기 때문이다.중첩된 데이터는 여러 번 서로 다른 단점으로 왕복해야 하기 때문에 속도가 느리고 일치하지 않는다.대부분의 조회는 일부 유효 부하를 필요로 하지 않아 불필요한 데이터 전송을 초래한다.무엇보다 페이스북이 이렇게 많은 HTTP 호출을 처리하는 것은 무미건조하다.
그는 2012년 2월 이 지옥 같은 배경 아래 페이스북 한구석에 일부 워크스테이션을 보존했다.

곧 우리 세 명의 개발자가 슈퍼그래프라고 불렸던 GraphQL의 첫 번째 원형을 만들었다.2012년 8월, GraphQL은 새로운 네이티브 페이스북 앱과 함께 생산에 들어갔다.2015년에 첫 번째 공개 버전이 인터넷에 등장했다.페이스북 벽을 굴릴 때GraphQL은 여전히 존재합니다.그러나 그들은 페이스북뿐만 아니라 업계 전체에 영향을 미치는 문제를 어떻게 해결합니까?

GraphQL이란?

GraphQL은 API용 데이터 쿼리 언어입니다.SQL과 마찬가지로 QL은 질의 언어를 나타냅니다.GraphQL은 간단하고 유연하며 매우 정확한 방식으로 데이터를 조작할 수 있습니다.GraphQL은 프로그래밍 언어도 프레임워크도 아니다.GraphQL은 API를 실현하는 규범이다.구체적으로 말하면 이렇다.
청원

{
    pokemons {
        name,
        abilities {
          name,
          damage,
          accuracy,
          mana,
          type
        }
    }
}

응수

{
    "data": {
        "pokemons": \[
            {
                "name": "pikachu",
                "abilities": \[
                    {
                        "name": "Thunder punch",
                        "damage": 75,
                        "accuracy": 70,
                        "mana": 15,
                        "type": "physical"
                    },
                    {
                        "name": "Thunderbolt",
                        "damage": 90,
                        "accuracy": 80,
                        "mana": 15,
                        "type": "electric"
                    }
                \]
            },
            {
                "name": "mewtwo",
                "abilities": \[
                     {
                        "name": "Earthquake",
                        "damage": 130,
                        "accuracy": 100,
                        "mana": 20,
                        "type": "ground"
                    },
                    {
                        "name": "Brutal swing",
                        "damage": 180,
                        "accuracy": 90,
                        "mana": 25,
                        "type": "physical"
                    }
                \]
            }
        \]
    }
}

이것이 바로 GraphQL을 사용하여 데이터를 요청하고 받는 방식입니다.그래, 아직 잘 모르겠어.우선, 이 물건이 당신의 구조에 적합합니까?

그 웃는 놈이 너야.내가 전에 보여준 포켓몬스터와 그 기술의 유효한 하중을 실현하기 위해 귀찮은 일이 생겼소.네가 사용하는 REST API는 네가 필요로 하는 것이 아니기 때문에 너는 발버둥치고 있다.너는 결국 모든 포켓몬스터에게 전화를 한 통, 그리고 모든 포켓몬스터에게 전화를 할 것이다.
응용 프로그램의 논리가 데이터베이스에 요청을 하고 유효 부하를 보낼 때마다그래서 얼굴에 웃음을 띠고 있지만 자살하고 싶어요.이것이 바로 GraphQL의 용무지다.

GraphQL이 있으면 문제없습니다.게시물을 한 편 올리고GraphQL 요청을 통해 원하는 것을 정확히 물어보세요.그리고 서버가 모든 것을 관리하면 완전한 부하를 얻을 수 있습니다.
REST를 사용하면 끝점으로 정의된 객체를 얻을 수 있습니다.GraphQL을 사용하면 백엔드에서 정의한 대상에 적응하지 않고 클라이언트에서 받을 대상을 동적 정의할 수 있습니다.이것은 모든 것을 변화시켰다.
네, 이 모든 것은 다 좋은데, 구체적으로 말하면 어떻게 일을 합니까?GraphQL은 어떻게 데이터베이스에 접근하여 조회를 진행합니까?GraphQL을 진정으로 이해하려면 반드시 그것을 파악해야 한다.

비밀번호 보여주세요.

Javascript 구현(NodeJS)을 작성합니다.다음 내용은 모든 언어에 적용됩니다.GraphQL 논리는 가장 먼저 규범이기 때문에 어느 곳에서든 변하지 않는다.
GraphQL의 작업을 시작하려면 공식 사이트와 세계 모든 언어의 실현 목록을 방문하십시오.NodeJS를 간소화하기 위해서는express graphql과graphql 모듈이 필요합니다.기본 서버 설치부터 시작하겠습니다.
색인js

const path = require("path");
const express = require("express");
const graphqlHTTP = require("express-graphql");
const graphql = require("graphql");

const { query } = require(path.resolve("schema/query"));
const graphQLSchema = new graphql.GraphQLSchema({ query });

const app = express();

app.use(
  "/graphql",
  graphqlHTTP({
    schema: graphQLSchema,
    graphiql: true
  })
);

app.listen(8080);

우선, 우리는 의존 관계라고 부른다.그리고 여섯 번째 줄에서 루트 조회를 찾아 일곱 번째 줄의 주 모드로 전달합니다.우리는express 서버를 시작하여express 중간부품을 통해/graphql 루트를 공개하고 마지막으로 포트 8080을 감청합니다.이제 모드 내부에 무슨 일이 일어났는지 봅시다.
패턴/조회.js

const path = require("path");
const { GraphQLObjectType, GraphQLList } = require("graphql");
const { pokemonsType } = require(path.resolve("schema/types"));

const RootQuery = new GraphQLObjectType({
  name: "RootQueryType",
  type: "Query",
  fields: {
    pokemons: {
      type: new GraphQLList(pokemonsType),
      resolve() {
        const data = require(path.resolve("data/pokemons.json"));

        return data;
      }
    }
  }
});

exports.query = RootQuery;

모델은GraphQL의 핵심이다.클라이언트와 서버 간의 통신을 결정합니다.I*t 클라이언트가 수행할 수 있는 질의, 검색할 수 있는 데이터 유형 및 이러한 유형 간의 관계를 지정합니다. *모든 것이 이 모델에서 정의된다.루트 질의부터 시작합니다.
루트 쿼리는 GraphQL이 어떤 종류의 데이터를 검색할 수 있는지 알 수 있도록 합니다.여기, 내 루트 검색에서, 나는 포켓몬 라인 9을 지정했는데, 이것은 포켓몬 라인 10가지 유형의 목록이다.
열한 줄에 해석기가 하나 있다.해석 프로그램은 데이터베이스에서 데이터를 얻는 것을 책임진다.모든 필드에 해상도를 할당합니다.내 포켓몬 필드의 해석기는 포켓몬 대상 목록이다.여기에서, 내 해상도는 JSON 파일을 통해 데이터를 되돌려줍니다. 이 파일은 포켓몬 그룹에 대응합니다.
간단하고 간결하기 위해서, 나는 데이터를 위해 JSON을 되돌려 주었다.그러나 현실 생활에서 데이터베이스를 호출하고 조회를 하며 데이터를 되돌려야 하는 곳이다.이제 이런 유형들이 어떤지 봅시다.
패턴/유형.js

const path = require("path");
const graphql = require("graphql");
const { GraphQLObjectType, GraphQLString, GraphQLList } = graphql;

const abilitiesType = new GraphQLObjectType({
  name: "ability",
  fields: {
    name: {
      type: GraphQLString,
      resolve: parent => parent.name
    },
    damage: {
      type: GraphQLString,
      resolve: parent => parent.damage
    },
    accuracy: {
      type: GraphQLString,
      resolve: parent => parent.accuracy
    },
    mana: {
      type: GraphQLString,
      resolve: parent => parent.mana
    },
    type: {
      type: GraphQLString,
      resolve: parent => parent.type
    }
  }
});

const pokemonsType = new GraphQLObjectType({
  name: "pokemons",
  fields: {
    name: {
      type: GraphQLString,
      resolve: parent => parent.name
    },
    abilities: {
      type: new GraphQLList(abilitiesType),
      resolve(parent) {
        const abilities = require(path.resolve("data/abilities.json"));

        return abilities.filter(ability =>
          ability.linkedTo.includes(parent.name)
        );
      }
    }
  }
});

exports.pokemonsType = pokemonsType;

원칙은 변하지 않는다.데이터 구조를 나타내는 GraphQL 객체 유형을 만듭니다.우리는 필드를 지정하고, 모든 필드에 정확한 데이터를 찾기 위해 해상도를 분배합니다.흥미로운 것은 내가 이곳에서 부모 대상의 상하문을 사용하여 모든 포켓몬스터의 44행에서 되돌아오는 기능을 필터한다는 것이다.
만약 네가 이 실현된 업무 버전을 보고 싶다면, 나는 조금 했다.거기서 놀아도 돼.JSON 파일을 포함한 모든 파일을 볼 수 있고 원하는 것을 바꿀 수 있습니다.
JSON 데이터 대신 PokéAPI에서fech를 실행하면 같은 기능을 할 수 있습니다.GraphQL을 연습할 수 있습니다.

공동 모래상자 후기

이렇게 해서 나는 강연 중에 더 이상 진일보할 수 없다.나는 이미 네가 나에게 준 5분을 초과했다.이 기술에 관해서는 아직 할 말이 많다.돌연변이, 캐시, 변수, 상하문.나는 기본 원칙을 견지할 것이다.더 알고 싶고 한가한 시간이 있다면 이걸 추천합니다!