GraphQLでAPIを開発する。

これはノマドエンコーダ課程に基づいて作成された.
ノマドコード川のhttps://nomadcoders.co/graphql-for-beginners
参考資料https://graphql-kr.github.io/learn/
index.jsファイルを作成し、初期設定から開始します.

index.js

import { GraphQLServer } from "graphql-yoga";
import resolvers from "./graphql/resolvers";

const server = new GraphQLServer({
  typeDefs: "graphql/schema.graphql",
  resolvers,
});

server.start(() => console.log("graphql Server Running"));
}

まずGraphql-ヨガをインストールしてサーバーを作成します.

npm i graphql-yoga

typeDefs:自分で作成したタイプを保存済みパスとして指定します.
解析器:作成したQueryを解析しなければ、サーバが正常に動作しません.

schema.graphql.js

type Movie {
  id: Int!
  title: String!
  rating: Float
  description_intro: String
  language: String
  medium_cover_image: String
  genres: [String]
}

type Query {
  movies(limit: Int, rating: Float): [Movie]!
  movie(id: Int!): Movie
  suggestions(id: Int!): [Movie]!
}

ムービーのtpeeを保存します.
Intは整数、Stringは文字列です.

Int!

!フィールドがnon-nullableであることを意味します.これは、このフィールドを問い合わせると、GraphQLサービスが常に値を返すことを意味します.

 movies(limit: Int, rating: Float):

moviesはlimitとratingをパラメータとして受け入れます.結果のタイプは配列で、Movieを受信できるタイプです.

db.js

import axios from "axios";
const BASE_URL = "https://yts-proxy.now.sh/";
const LIST_MOVIES_URL = `${BASE_URL}list_movies.json`;
const MOVIE_DETAILS_URL = `${BASE_URL}movie_details.json`;
const MOVIE_SUGGESTIONS_URL = `${BASE_URL}movie_suggestions.json`;

BASE URLにURLを保存して映画apiを受信します.

export const getMovies = async (limit, rating) => {
  const {
    data: {
      data: { movies },
    },
  } = await axios(LIST_MOVIES_URL, {
    params: {
      limit,
      minium_rating: rating,
    },
  });
  return movies;
};

axiosを使用してapiを取得します.
params:limit、格付けを追加したのは、アーキテクチャで格付けを指定したからです.

 const {
    data: {
      data: { movies },
    },
  } 

Es 6非構造化割り当ては、上述した表現を提供する.
const movies = data.dataと同じ意味

export const getMovie = async (id) => {
  // const { movie } = movie.data.data;
  const {
    data: {
      data: { movie },
    },
  } = await axios(MOVIE_DETAILS_URL, {
    params: {
      movie_id: id,
    },
  });
  return movie;
};

export const getSuggestions = async (id) => {
  const {
    data: {
      data: { movies },
    },
  } = await axios(MOVIE_SUGGESTIONS_URL, {
    params: {
      movie_id: id,
    },
  });
  return movies;
};

他に必要な内容を指定することもできます.

結果

DOCSでは、typeが設定されていることがわかります.

query{
	movies(limit:5, rating:2){
    title
    rating
    language
    id
  }
}

上図のように、結果値は以下のようになります.

これでGraphQLを使用したAPIの作成が完了しました.
次の章では、作成したAPIで簡単なWebを作成します!!!
ありがとうございます.