cstrnt / fuse.js

Fuse.js: The opinionated framework for creating typesafe data layers

Fuse.js

Getting Started

Before you begin

Before you start using Fuse.js, you need to have:

• Familiarity with TypeScript
• A Next.js app*

*Note that a Fuse.js data layer can also be developed and deployed outside of Next.js. However, our current focus is on making the experience with Next.js great, so expect rough edges elsewhere.

Setting up your Fuse.js data layer

When you are in your Next.JS app run the following command, this will install all the packages and generate the files you need.

npm create fuse-app

Next, run npm run dev and... That’s it! Fuse.js will now serve a GraphQL API at /api/fuse.

Querying your data layer

import { graphql } from '@/fuse'
import { execute } from '@/fuse/server'

const UserQuery = graphql(`
  query User($id: ID!) {
    user(id: $id) {
      id
      name
    }
  }
`)

export default async function Page() {
  const result = await execute({
    query: UserQuery,
    variables: { id: '1' },
  })

  return <p>Welcome {result.data?.user?.name}</p>
}

Docs

Read the documentation for more information about using Fuse.js.

Quicklinks to some of the most-visited pages:

• Getting started
• Querying from the client
• Nodes
• Introduction to data layers

License

Licensed under the MIT License, Copyright © 2023-present Stellate, Inc.

See LICENSE for more information.