Définition
Apollo est un écosystème complet d'outils pour construire, gérer et consommer des API GraphQL. C'est la solution GraphQL la plus populaire, utilisee par des entreprises comme Airbnb, Expedia et The New York Times.
Apollo couvre les deux cotes : le client (Apollo Client) et le serveur (Apollo Server).
Apollo Client
Librairie JavaScript pour consommer des API GraphQL avec un cache intelligent integre.
import { ApolloClient, InMemoryCache, gql, useQuery } from '@apollo/client';
// Configuration
const client = new ApolloClient({
uri: 'https://api.exemple.com/graphql',
cache: new InMemoryCache(),
});
// Hook React
function UserProfile({ userId }) {
const { data, loading, error } = useQuery(gql\`
query GetUser($id: ID!) {
user(id: $id) {
name
email
posts { title createdAt }
}
}
\`, { variables: { id: userId } });
if (loading) return <Spinner />;
if (error) return <Error message={error.message} />;
return <Profile user={data.user} />;
}
Cache intelligent
Apollo Client maintient un cache normalise en mémoire. Quand une mutation modifie un objet, toutes les queries qui referencent cet objet sont automatiquement mises à jour.
Apollo Server
Serveur GraphQL pour Node.js :
import { ApolloServer } from '@apollo/server';
const typeDefs = \`
type User {
id: ID!
name: String!
email: String!
posts: [Post!]!
}
type Post { id: ID!; title: String!; createdAt: String! }
type Query { user(id: ID!): User; users: [User!]! }
type Mutation { createUser(name: String!, email: String!): User! }
\`;
const resolvers = {
Query: {
user: (_, { id }) => db.users.findById(id),
users: () => db.users.findAll(),
},
User: {
posts: (user) => db.posts.findByUserId(user.id),
},
};
const server = new ApolloServer({ typeDefs, resolvers });
Apollo Studio
Plateforme cloud pour gérer les API GraphQL :
- Schéma Registry : versionnage du schéma
- Explorer : IDE GraphQL en ligne
- Metrics : performance des resolvers
- Alerts : notifications sur les erreurs
Apollo vs alternatives
| Apollo | urql | Relay | |
|---|---|---|---|
| Cache | Normalise, puissant | Simple ou normalise | Normalise, strict |
| Taille | ~33 Ko | ~8 Ko | ~25 Ko |
| Complexité | Moyenne | Faible | Elevee |
| Écosystème | Le plus large | Croissant | |
| Cas idéal | Production, équipe | Projets simples | Apps Facebook-scale |