Home

Awesome

<div align="center">

<img height="200" src="https://cdn.favware.tech/img/gqlp.png" alt="ArchAngel"/>

GraphQL-Pokemon

Extensive Pokémon GraphQL API!

GitHub

npm

Support Server

</div>

Table of Contents


About

GraphQL-Pokemon is a GraphQL API that provides extensive Pokémon data. Unlike contemporary APIs this API focusses on speed, accuracy and data quality. New game data is added within relatively short time after release, and Smogon tier data is automatically updated after tier shifts. Data used for this API is pulled from the Pokemon Showdown GitHub, Serebii, and Bulbapedia.

Key Features

JavaScript Companion Library

For those consuming this API through JavaScript, you can install the companion library to add additional tools for parsing the responses as well as get the TypeScript typings for the responses.

Install library through your favourite package manager:

npm install @favware/graphql-pokemon
yarn add @favware/graphql-pokemon
pnpm add @favware/graphql-pokemon
bun add @favware/graphql-pokemon

For the usage of the JavaScript Companion Library please see the autogenerated documentation.

Known bugs / limitations

API Documentation

There are two ways to consume the documentation that this API offers. They are as follows.

Autogenerated text based documentation

For those who want purely text based documentation about all the GraphQL Queries and Types that are in this API, including a documentation search for those symbols, please see the autogenerated documentation powered by magidoc.

Interactive playground with documentation embedded

For those who want an interactive playground where they can directly test their queries and read about each query as they select them, please use the GraphQL Playground on the API.

Usage

These examples are written as based on TypeScript. For JavaScript simply change out the imports to require syntax and remove any type information.

Using Fetch

note: for a working example see dragonite

import type { Query } from '@favware/graphql-pokemon';

interface GraphQLPokemonResponse<K extends keyof Omit<Query, '__typename'>> {
  data: Record<K, Omit<Query[K], '__typename'>>;
}

fetch('https://graphqlpokemon.favware.tech/v8', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    query: `
      {
        getPokemon(pokemon: dragonite) {
            sprite
            num
            species
            color
        }
      }
    `
  })
})
  .then((res) => res.json() as Promise<GraphQLPokemonResponse<'getPokemon'>>)
  .then((json) => console.log(json.data));

Using Apollo Boost

note: for a working example see dexa

import type { Query, QueryGetFuzzyPokemonArgs } from '@favware/graphql-pokemon';
import ApolloClient from 'apollo-boost';
import fetch from 'cross-fetch';
import gql from 'graphql-tag';

type GraphQLPokemonResponse<K extends keyof Omit<Query, '__typename'>> = Record<
  K,
  Omit<Query[K], '__typename'>
>;

const getFuzzyPokemon = gql`
  query getFuzzyPokemon($pokemon: String!) {
    getFuzzyPokemon(pokemon: $pokemon) {
      sprite
      num
      species
      color
    }
  }
`;

const apolloClient = new ApolloClient({
  uri: 'https://graphqlpokemon.favware.tech/v8',
  fetch
});

const {
  data: { getFuzzyPokemon: pokemonData }
} = await apolloClient.query<
  GraphQLPokemonResponse<'getFuzzyPokemon'>,
  QueryGetFuzzyPokemonArgs
>({
  query: getFuzzyPokemon,
  variables: { pokemon: 'dragonite' }
});

console.log(pokemonData);

Using Apollo Client React

// ApolloClient setup
import { ApolloClient } from 'apollo-client';
import { InMemoryCache } from 'apollo-cache-inmemory';
import { HttpLink } from 'apollo-link-http';

// Instantiate required constructor fields
const cache = new InMemoryCache();
const link = new HttpLink({
  uri: 'https://graphqlpokemon.favware.tech/v8'
});

export const client = new ApolloClient({
  // Provide required constructor fields
  cache: cache,
  link: link,

  // Provide some optional constructor fields
  name: 'graphql-pokemon-client',
  version: '1.0',
  queryDeduplication: false,
  defaultOptions: {
    watchQuery: {
      fetchPolicy: 'cache-and-network'
    }
  }
});
// Component
import React from 'react';
import gql from 'graphql-tag';
import { useQuery } from '@apollo/react-hooks';
import type { Query } from '@favware/graphql-pokemon';
import { client } from './ApolloClient';

interface GraphQLPokemonResponse<K extends keyof Omit<Query, '__typename'>> {
  data: Record<K, Omit<Query[K], '__typename'>>;
}

const GET_POKEMON_DETAILS = gql`
  {
    getPokemon(pokemon: dragonite) {
      sprite
      num
      species
      color
    }
  }
`;

export const Pokemon: React.FC = () => {
  const { loading, error, data } = useQuery<
    GraphQLPokemonResponse<'getPokemon'>
  >(GET_POKEMON_DETAILS, {
    client: client
  });

  if (loading) return 'Loading...';
  if (error) return `Error! ${error.message}`;

  return <div> Insert how you want to display the data here </div>;
};

Meta

License

Copyright © 2019, Favware. Released under the MIT License.

Buy us some doughnuts

Favware projects is and always will be open source, even if we don't get donations. That being said, we know there are amazing people who may still want to donate just to show their appreciation. Thank you very much in advance!

We accept donations through Ko-fi, Paypal, Patreon, GitHub Sponsorships, and various crypto currencies. You can use the buttons below to donate through your method of choice.

Donate WithAddress
Ko-fiClick Here
PatreonClick Here
PayPalClick Here
GitHub SponsorsClick Here
Bitcoin1E643TNif2MTh75rugepmXuq35Tck4TnE5
Ethereum0xF653F666903cd8739030D2721bF01095896F5D6E
LiteCoinLZHvBkaJqKJRa8N7Dyu41Jd1PDBAofCik6

Contributors

Please make sure to read the Contributing Guide before making a pull request.

Thank you to all the people who already contributed to GraphQL-Pokemon!

<a href="https://github.com/favware/graphql-pokemon/graphs/contributors"> <img src="https://contrib.rocks/image?repo=favware/graphql-pokemon" /> </a>