# Migrating from Apollo Tooling to GraphQL Codegen at Yelp

DevFeed: [Migrating from Apollo Tooling to GraphQL Codegen at Yelp](<https://devfeed.tech/articles/migrating-from-apollo-tooling-to-graphql-codegen-at-yelp-27428.md>)

Original publisher: [Read original article](<https://engineeringblog.yelp.com/2026/07/migrating-to-graphql-codegen.html>)

Author: Igor Kusakov, Software Engineer

Published: 2026-07-16T00:00:00Z

Content type: article

Language: en

Sources: [Yelp](<https://devfeed.tech/sources/yelp.md>)

Topics: [GraphQL](<https://devfeed.tech/topics/graphql.md>), [Code generation](<https://devfeed.tech/topics/code-generation.md>), [migration](<https://devfeed.tech/topics/migration.md>), [Tooling](<https://devfeed.tech/topics/tooling.md>), [React](<https://devfeed.tech/topics/react.md>), [TypeScript](<https://devfeed.tech/topics/typescript.md>), [monorepo](<https://devfeed.tech/topics/monorepo.md>)

Tags: [code-generation](<https://devfeed.tech/tags/code-generation.md>), [deprecated](<https://devfeed.tech/tags/deprecated.md>), [graphql](<https://devfeed.tech/tags/graphql.md>), [migrate](<https://devfeed.tech/tags/migrate.md>), [monorepo](<https://devfeed.tech/tags/monorepo.md>), [react](<https://devfeed.tech/tags/react.md>), [tooling](<https://devfeed.tech/tags/tooling.md>), [typescript](<https://devfeed.tech/tags/typescript.md>)

## AI overview

Yelp describes migrating its frontend React monorepo from deprecated Apollo Tooling to GraphQL Codegen for generating TypeScript definitions from GraphQL queries and the server schema.

## Source excerpt

Introduction At Yelp, we rely heavily on GraphQL and Apollo for data loading in our frontend React monorepo. When a developer writes a GraphQL query or mutation inside a React component, the shape of the response is defined by the query itself -- but TypeScript has no way to know what that shape looks like at compile time. That's where code generation (codegen) comes in. We rely on codegen to read our queries and server schema, then produce TypeScript type definitions for every operation's input variables and output data. In our codebase, this looks like: src/components/UserProfile/ ├── UserProfile.tsx <- contains...