Documentation
Getting Started

Fuse Introduction

Fuse is an open-source library for building GraphQL APIs. (star it on GitHub! (opens in a new tab)) It empowers frontend teams to build and own the central translation layer from the backend microservices, data stores, & third-party APIs to the optimal GraphQL API for their websites, web apps, and mobile apps.

Fuse combines the best tooling from the GraphQL ecosystem to guide you to an organizational and technical “pit of success.” While it uses GraphQL (because it is the best technical choice) and familiarity with GraphQL will make for a minimal learning curve, you do not need to know GraphQL to use Fuse.

Getting Started

Before you begin

Before you start using Fuse, you need to have:

  • Familiarity with TypeScript
  • Basic familiarity with writing GraphQL queries*

*Note that we are working on improving the documentation so that Fuse doesn't even require basic familiarity with writing GraphQL queries.

Run create-fuse-app

In the root folder of your application run create-fuse-app with npx, pnpm, or yarn:

npx create-fuse-app

This will automatically set up Fuse for you, which consists of three main steps:

  1. Install the npm packages
  2. Set up GraphQLSP to get IDE autocomplete
  3. Adds a first example type in types/User.ts

If create-fuse-app detects that you are using Next.js, it will also automatically:

  1. Add the Next.js plugin to your next.config.js
  2. Create a /api/fuse API route

It generates the example User.ts type to allow you to verify your Fuse setup (see the next step) and serves as an example how to use Fuse to build an API. However, please delete the types/User.ts file once you start building your own.

Run the Fuse API server

Now, run npx fuse dev (or pnpm fuse dev, yarn fuse dev, or bun fuse dev) to start the API server. When you open localhost:4000/graphql in your browser, you should see GraphiQL and be able to query for a user:

Screenshot of GraphiQL showing a query for a user, their id, name, and firstName, and the corresponding result

If you are using Next.js, you don't need to run fuse dev. Instead, run your standard next dev process and open the /api/fuse API route in your browser, which create-fuse-app added for you.

You've now got Fuse setup! 🎉 Next, learn how to query your Fuse API from the client and learn more about the Fuse Method for managing APIs.

Overview