Table of Contents
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.
- Fully generated client-side TypeScript typings published to
- npm as
@favware/graphql-pokemon - GitHub Package Registry as
@favware/graphql-pokemon
- npm as
- Docker images of the API for private hosting published to
- Dockerhub as
favware/graphql-pokemon - GitHub Package Registry as
ghcr.io/favware/graphql-pokemon:latest
- Dockerhub as
- Provides information about various assets in Pokémon
- Pokédex
- Items
- Abilities
- Moves
- Learnsets
- Type matchups
Note: This is only needed if you are writing TypeScript, or if you're using a GraphQL schema validator. If you're using neither of these, you do not need to install this package. The package does NOT include the actual API, ONLY type information.
Install client side typings from yarn or npm:
yarn add -D @favware/graphql-pokemonnpm install -D @favware/graphql-pokemonThere are two ways to consume the documentation that this API offers. They are as follows.
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 GraphQL Docs powered by magidoc.
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.
These examples are written as based on TypeScript. For JavaScript simply change
out the imports to require syntax and remove any type information.
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/v7', {
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));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/v7',
fetch
});
const {
data: { getFuzzyPokemon: pokemonData }
} = await apolloClient.query<
GraphQLPokemonResponse<'getFuzzyPokemon'>,
QueryGetFuzzyPokemonArgs
>({
query: getFuzzyPokemon,
variables: { pokemon: 'dragonite' }
});
console.log(pokemonData);// 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/v7'
});
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>;
};Copyright © 2019, Favware. Released under the MIT License.
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 |
| Patreon | Click Here |
| PayPal | Click Here |
| GitHub Sponsors | Click Here |
| Bitcoin | 1E643TNif2MTh75rugepmXuq35Tck4TnE5 |
| Ethereum | 0xF653F666903cd8739030D2721bF01095896F5D6E |
| LiteCoin | LZHvBkaJqKJRa8N7Dyu41Jd1PDBAofCik6 |
Thanks goes to these wonderful people (emoji key):
This project follows the all-contributors specification. Contributions of any kind welcome!