Skip to content
Get packs

Guide · Open source

How to use apollo-client: install and run your first query

Updated · written with AI from the project's own documentation and checked against our catalogue data

Apollo Client is a library that lets a front-end app fetch data from a GraphQL server and keep the results in a local cache. This guide walks through what it is, how to install it with npm, and where to go next for queries and setup. It is written for readers who are comfortable with JavaScript and want to understand what Apollo Client does before adding it to a project.

Apollo Clientapollographql/apollo-client · ★ 19.8k · MIT

Quick start

  1. 1Check prerequisites. Confirm that Node.js and npm are installed and that you have a GraphQL API to query.
  2. 2Install the packages. Run npm install @apollo/client graphql in your project folder.
  3. 3Read the Getting Started Guide. Follow the official guide for complete setup and your first query.
  4. 4Create your first query. Use the API reference to write a query and connect it to your GraphQL endpoint.
  5. 5Inspect results with DevTools. Install the Apollo Client DevTools browser extension to debug your GraphQL app.

What is Apollo Client and who is it for?

Apollo Client is a GraphQL client for TypeScript, JavaScript, React, Vue, Angular and more. According to the README, it offers caching, APIs for queries, and developer tools.

It is best suited to developers building React apps that query a GraphQL API, teams using TypeScript who want typed GraphQL operations, and apps that need a client-side cache for GraphQL responses.

  • Caching: a local cache for GraphQL responses
  • Framework support: React, Vue, Angular and plain JavaScript
  • TypeScript: typed GraphQL operations

What do you need before you install Apollo Client?

The README lists Node.js and npm as the prerequisites. You also need a GraphQL API to query, because the library is built around GraphQL queries.

If your project does not use GraphQL, or you only need a simple HTTP request library, Apollo Client adds a larger set of concepts than you need.

  • Node.js
  • npm
  • A GraphQL server or API to query

Install Apollo Client with npm

Run the install command from the README in your project folder. It installs the client and the GraphQL package together.

npm install @apollo/client graphql

Where to learn queries and setup next

The README points to a Getting Started Guide with complete setup and a first query, the full documentation, and an API reference. These are the best places to learn how to write queries and configure the client for your app.

The README also lists a VS Code extension and browser DevTools for debugging GraphQL apps.

  • Getting Started Guide: https://www.apollographql.com/docs/react/get-started
  • Full documentation: https://www.apollographql.com/docs/react
  • API reference: https://www.apollographql.com/docs/react/api/apollo-client

Compare Apollo Client with similar projects

The README does not compare Apollo Client with other tools. Projects commonly considered alongside it are urql, Relay and graphql-request. Choose based on how much caching and tooling you need and how large a concept set you are willing to learn.

  • urql
  • Relay
  • graphql-request

What people use it for

  • Fetching GraphQL data into a React app with a client-side cache
  • Writing typed GraphQL operations in a TypeScript project
  • Using one GraphQL client across Vue, Angular or plain JavaScript front ends

Frequently asked questions

Is Apollo Client free to use?

The repository is licensed under MIT. The README does not state pricing for the client library itself; it does mention a GraphOS platform that offers a free start with no credit card needed, which is a separate product.

What do I need to install Apollo Client?

The README lists Node.js and npm as prerequisites. Install the client with npm install @apollo/client graphql.

Does Apollo Client work with React?

Yes. The README says it works with React, Vue, Angular and plain JavaScript, and the main documentation is for React.

What is the difference between Apollo Client and graphql-request?

The source does not compare them. Apollo Client includes caching and developer tooling, while graphql-request is a simpler request library. Choose based on whether you need a cache.

Is Apollo Client only for TypeScript?

No. It is written in TypeScript and supports TypeScript well, but the README says it works with plain JavaScript too.

Where can I get help if something breaks?

The README links to a Community Forum at community.apollographql.com and a GraphQL Discord at discord.graphql.org.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

Apollo Client is a good fit for developers building front-end apps that query a GraphQL API and want a built-in cache and TypeScript support. If your project does not use GraphQL or you only need simple HTTP requests, pick a lighter tool such as graphql-request.

Install options & downloads