DEV Community

Kay Gosho
Kay Gosho

Posted on

I created graphql-rest-proxy, which converts your REST api to GraphQL server

I've created graphql-rest-proxy. This tool enables to proxy GraphQL request to REST api.

https://github.com/acro5piano/graphql-rest-proxy

We all know GraphQL is great, so you want to move from REST api to GraphQL.

However, it requires a lot of effort to replace your current REST api with a brand new GraphQL server.

graphql-rest-proxy comes in to address this issue! It proxies GraphQL to REST API according to the defined schema.

image

Install

npm -g install graphql-rest-proxy
Enter fullscreen mode Exit fullscreen mode

Or if you use Yarn:

yarn global add graphql-rest-proxy
Enter fullscreen mode Exit fullscreen mode

Getting Started

STEP 1. Define your schema.

schema.graphql

type User {
  id: Int
  name: String
  isActive: Boolean
}

type Query {
  getUser: User @proxy(get: "https://my-rest-api.com/user")
}
Enter fullscreen mode Exit fullscreen mode

STEP 2. Run your proxy server.

graphql-rest-proxy schema.graphql

# => graphql-rest-proxy is running on http://localhost:5252
Enter fullscreen mode Exit fullscreen mode

STEP 3. Request!

curl -XPOST -H 'Content-Type: application/json' \
    -d '{ "query": "{ getUser { id name isActive } }" }' \
    http://localhost:5252/graphql
Enter fullscreen mode Exit fullscreen mode

It will return like this:

{
  "data": {
    "getUser": {
      "id": 1,
      "name": "Tom",
      "isActive": false
    }
  }
}
Enter fullscreen mode Exit fullscreen mode

Examples

Basic Query Proxy

type User {
  id: Int
  name: String
}

type Query {
  getUser: User @proxy(get: "https://my-rest-api.com/user")
  getUsers: [User] @proxy(get: "https://my-rest-api.com/users")
}
Enter fullscreen mode Exit fullscreen mode

Query with Parameters

You can refer the id of query args by $id.

type User {
  id: Int
  name: String
}

type Query {
  getUserById(id: Int!): User @proxy(get: "https://my-rest-api.com/users/$id")
}
Enter fullscreen mode Exit fullscreen mode

Mutation with Input Parameters

Mutation forward variables to the REST API.

type UserInput {
  name: String!
}

type User {
  id: Int
  name: String
}

type Mutation {
  createUser(user: UserInput!): User @proxy(post: "https://my-rest-api.com/users")
  updateUser(id: Int!, user: UserInput!): User @proxy(patch: "https://my-rest-api.com/users/$id")
}
Enter fullscreen mode Exit fullscreen mode

Request example:

fetch('http://localhost:5252/graphql', {
  method: 'patch',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    query: gql`
      mutation UpdateUser($id: Int!, $user: UserInput!) {
        updateUser(id: $id, user: $user) {
          id
          name
        }
      }
    `,
    variables: {
      id: 1,
      user: {
        name: 'acro5piano',
      },
    },
  }),
})
Enter fullscreen mode Exit fullscreen mode

Nested Objects

You can refer the id of parent object by $id.

type Post {
  id: Int
  title: String
}

type User {
  id: Int
  name: String
  posts: [Post] @proxy(get: "https://my-rest-api.com/users/$id/posts")
}

type Query {
  getUser: User @proxy(get: "https://my-rest-api.com/user")
}
Enter fullscreen mode Exit fullscreen mode

for more information, please take a look at https://github.com/acro5piano/graphql-rest-proxy

Development Status

Still in Beta. If you have any suggestions or feature requests, feel free to open new issues or Pull Requests!

TODO:

  • [ ] More type support
    • [ ] Fragment
    • [ ] Scalar
  • [ ] Refactoring
  • [ ] Logging

Please try it out and let me know your feedback/comments.

Side note

I used Rollup.js to create npm package before, but this time I tried @pika/pack.

https://www.pikapkg.com/blog/introducing-pika-pack/

@pika/pack is a great tool, which reduces a lot of steps and learning cost. For example, we can set executable command, code embedding, version managiments, and so on. I would like to write an article about @pika/pack in the future.

Top comments (0)