Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/favware/graphql-pokemon

Extensive Pokémon GraphQL API
https://github.com/favware/graphql-pokemon

favware graphql graphql-pokemon hacktoberfest pokemon showdown smogon

Last synced: about 1 month ago
JSON representation

Extensive Pokémon GraphQL API

Lists

README 

        



[ArchAngel][dashboard]



# [`GraphQL-Pokemon`][dashboard]



**Extensive Pokémon GraphQL API!**



[![GitHub](https://img.shields.io/github/license/favware/graphql-pokemon)](https://github.com/favware/graphql-pokemon/blob/main/LICENSE)



[![npm](https://img.shields.io/npm/v/@favware/graphql-pokemon?color=crimson&label=TypeScript%20API%20Typings%20Version&logo=npm)](https://www.npmjs.com/package/@favware/graphql-pokemon)



[![Support Server](https://discord.com/api/guilds/512303595966824458/embed.png?style=banner2)](https://join.favware.tech)






---



**Table of Contents**



- [GraphQL-Pokemon](#graphql-pokemon)

  - [About](#about)

  - [Key Features](#key-features)

  - [JavaScript Companion Library](#javascript-companion-library)

  - [API Documentation](#api-documentation)

    - [Autogenerated text based documentation](#autogenerated-text-based-documentation)

    - [Interactive playground with documentation embedded](#interactive-playground-with-documentation-embedded)

  - [Usage](#usage)

    - [Using `Fetch`](#using-fetch)

    - [Using `Apollo Boost`](#using-apollo-boost)

    - [Using `Apollo Client React`](#using-apollo-client-react)

  - [Meta](#meta)

    - [License](#license)

    - [Buy us some doughnuts](#buy-us-some-doughnuts)

  - [Contributors](#contributors)



---



## About



[GraphQL-Pokemon][dashboard] 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][showdown-github], [Serebii],

and [Bulbapedia].



## Key Features



- Fully generated client-side TypeScript typings published to

  - [npm] as `@favware/graphql-pokemon`

  - [GitHub Package Registry][ghcr_npm] as `@favware/graphql-pokemon`

- Docker images of the API for private hosting published to

  - [Dockerhub] as `favware/graphql-pokemon`

  - [GitHub Package Registry][ghcr_docker] as

    `ghcr.io/favware/graphql-pokemon:latest`

- Provides information about various assets in Pokémon

  - Pokédex

  - Items

  - Abilities

  - Moves

  - Learnsets

  - Type matchups



## 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:



```sh

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][docs].



## 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][docs] 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][dashboard].



## 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]_



```ts

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



interface GraphQLPokemonResponse> {

  data: Record>;

}



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>)

  .then((json) => console.log(json.data));

```



### Using `Apollo Boost`



_note: for a working example see [dexa]_



```ts

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> = Record<

  K,

  Omit

>;



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`



```ts

// 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'

    }

  }

});

```



```tsx

// 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> {

  data: Record>;

}



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 
 Insert how you want to display the data here 
;

};

```



## Meta



### License



Copyright © 2019, [Favware](https://github.com/favware). Released under the

[MIT License](LICENSE.md).



### 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 With   |                      Address                      |

| :-------------: | :-----------------------------------------------: |

|      Ko-fi      |  [Click Here](https://donate.favware.tech/kofi)   |

|     Patreon     | [Click Here](https://donate.favware.tech/patreon) |

|     PayPal      | [Click Here](https://donate.favware.tech/paypal)  |

| GitHub Sponsors |  [Click Here](https://github.com/sponsors/Favna)  |

|     Bitcoin     |       `1E643TNif2MTh75rugepmXuq35Tck4TnE5`        |

|    Ethereum     |   `0xF653F666903cd8739030D2721bF01095896F5D6E`    |

|    LiteCoin     |       `LZHvBkaJqKJRa8N7Dyu41Jd1PDBAofCik6`        |



## Contributors



Please make sure to read the [Contributing Guide][contributing] before making a

pull request.



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





  




[contributing]: ./.github/CONTRIBUTING.md

[dashboard]: https://graphqlpokemon.favware.tech/v8

[yarn]: https://yarnpkg.com/package/@favware/graphql-pokemon

[npm]: https://www.npmjs.com/package/@favware/graphql-pokemon

[ghcr_npm]: https://github.com/favware/graphql-pokemon/packages/199047

[ghcr_docker]:

  https://github.com/orgs/favware/packages/container/package/graphql-pokemon

[dockerhub]: https://hub.docker.com/r/favware/graphql-pokemon

[dexa]: https://github.com/favware/dexa

[dragonite]: https://github.com/favware/dragonite

[showdown-github]: https://github.com/smogon/pokemon-showdown/

[serebii]: https://www.serebii.net/

[bulbapedia]: https://bulbapedia.bulbagarden.net/wiki/Main_Page

[magidoc]: https://github.com/magidoc-org/magidoc

[docs]: https://graphql-pokemon.js.org/