Brangr - Browse Any Graph
Brangr is a simple, unique tool that any web server can host to provide a user-friendly browser/viewer for any GraphQL service (or many).
Brangr formats GraphQL results attractively, via a selection of user-configurable layouts. It lets users extract the generated HTML, and its source JSON. It provides a clever schema browser. It has built-in docs.
Brangr enables sites hosting it to present users with a collection of pre-fab GraphQL requests, which they can edit if desired, and let them create their own requests. And it allows sites to define custom CSS styling for all aspects of the formatted results.
Try it at the public Brangr site.
Example
query {
heroes(_layout: { type: table }) { # _layout arg not sent to service
first
last
}
}
Brangr renders the above query as follows (though not in a quote block):
heroes...
First Last Arthur Dent Ford Prefect Zaphod Beeblebrox
GiraphQL makes writing type-safe schemas simple, and works without a code generator, build process, or extensive manual type definitions.
import { ApolloServer } from "apollo-server"
import SchemaBuilder from "@giraphql/core"
const builder = new SchemaBuilder({})
builder.queryType({
fields: t => ({
hello: t.string({
args: {
name: t.arg.string({}),
},
resolve: (parent, { name }) => `hello, ${name || "World"}`,
}),
}),
})
new ApolloServer({
schema: builder.toSchema({}),
}).listen(3000)
GraphQL Middleware is a schema wrapper which allows you to manage additional functionality across multiple resolvers efficiently.
Features💡 Easy to use: An intuitive, yet familiar API that you will pick up in a second. 💪 Powerful: Allows complete control over your resolvers (Before, After). 🌈 Compatible: Works with any GraphQL Schema.
Exampleconst { ApolloServer } = require("apollo-server")
const { makeExecutableSchema } = require("@graphql-tools/schema")
const typeDefs = `
type Query {
hello(name: String): String
bye(name: String): String
}
`
const resolvers = {
Query: {
hello: (root, args, context, info) => {
console.log(`3. resolver: hello`)
return `Hello ${args.name ? args.name : "world"}!`
},
bye: (root, args, context, info) => {
console.log(`3. resolver: bye`)
return `Bye ${args.name ? args.name : "world"}!`
},
},
}
const logInput = async (resolve, root, args, context, info) => {
console.log(`1. logInput: ${JSON.stringify(args)}`)
const result = await resolve(root, args, context, info)
console.log(`5. logInput`)
return result
}
const logResult = async (resolve, root, args, context, info) => {
console.log(`2. logResult`)
const result = await resolve(root, args, context, info)
console.log(`4. logResult: ${JSON.stringify(result)}`)
return result
}
const schema = makeExecutableSchema({ typeDefs, resolvers })
const schemaWithMiddleware = applyMiddleware(schema, logInput, logResult)
const server = new ApolloServer({
schema: schemaWithMiddleware,
})
await server.listen({ port: 8008 })
GraphQL Shield helps you create a permission layer for your application. Using an intuitive rule-API, you’ll gain the power of the shield engine on every request and reduce the load time of every request with smart caching. This way you can make sure your application will remain quick, and no internal data will be exposed.
import { rule, shield, and, or, not } from "graphql-shield"
// Rules
const isAuthenticated = rule({ cache: "contextual" })(async (
parent,
args,
ctx,
info,
) => {
return ctx.user !== null
})
const isAdmin = rule({ cache: "contextual" })(async (
parent,
args,
ctx,
info,
) => {
return ctx.user.role === "admin"
})
const isEditor = rule({ cache: "contextual" })(async (
parent,
args,
ctx,
info,
) => {
return ctx.user.role === "editor"
})
// Permissions
const permissions = shield({
Query: {
frontPage: not(isAuthenticated),
fruits: and(isAuthenticated, or(isAdmin, isEditor)),
customers: and(isAuthenticated, isAdmin),
},
Mutation: {
addFruitToBasket: isAuthenticated,
},
Fruit: isAuthenticated,
Customer: isAdmin,
})
// Server
const server = new GraphQLServer({
typeDefs,
resolvers,
middlewares: [permissions],
context: req => ({
...req,
user: getUser(req),
}),
})
Microfiber is a JavaScript library that allows:
npm install microfiber
# OR
yarn add microfiber
Then in JS:
import { Microfiber } from "microfiber"
const introspectionQueryResults = {
// ...
}
const microfiber = new Microfiber(introspectionQueryResults)
// ...do some things to your schema with `microfiber`
const cleanedIntrospectonQueryResults = microfiber.getResponse()
SpectaQL is a Node.js library that generates static documentation for a GraphQL schema using a variety of options:
Out of the box, SpectaQL generates a single 3-column HTML page and lets you choose between a couple built-in themes. A main goal of the project is to be easily and extremely customizable—it is themeable and just about everything can be overridden or customized.
npm install --dev spectaql
# OR
yarn add -D spectaql
# Then generate your docs
npm run spectaql my-config.yml
# OR
yarn spectaql my-config.yml
The Apollo Router Core is a configurable, high-performance graph router written in Rust to run a federated supergraph that uses Apollo Federation 2.
Apollo Router Core is free, source-available, well-tested, regularly benchmarked, includes most major features of Apollo Gateway and is able to serve production-scale workloads.
GraphOS RouterIn conjunction with the Apollo GraphOS platform, GraphOS Router is the enterprise-grade runtime plane and a client’s entry point to your federated supergraph. Configure it to secure your supergraph, monitor and optimize performance, extend functionality, and more.
Run gqt
against your GraphQL endpoint. Build your query in an
intuitive TUI and execute it. The response from the server is written
to standard output.
gqt -e https://your.app.com/graphql
GraphQL Protect helps you protect your GraphQL API against abuse by providing a large number of plug-and-play protection mechanism with sane defaults, while still allowing you complete customizability.
Getting started with GraphQL Protect is as simple as pulling the provided container, or running the binary directly, and supplying it with your configuration.
GraphQL Protect offers the following protection mechanism, and more:
Protecting your GraphQL API against abuse has never been easier, start protecting your API today.
The full example can be found on GitHub.
Microcks is a platform for turning your API and microservices assets - GraphQL schemas, OpenAPI specs, AsyncAPI specs, gRPC protobuf, Postman collections, SoapUI projects_ - into live simulations in seconds.
It also reuses these assets for running compliance and non-regression tests against your API implementation. We provide integrations with Jenkins, GitHub Actions, Tekton and many others through a simple CLI.
Run Schemathesis via Docker against your GraphQL endpoint:
docker run schemathesis/schemathesis \
run https://your.app.com/graphql
Schemathesis will generate queries matching your GraphQL schema and catch server crashes automatically. Generated queries have arbitrary depth and may contain any subset of GraphQL types defined in the input schema. They expose edge cases in your code that are unlikely to be found otherwise.
Note that you can write your app in any programming language; the tool will communicate with it over HTTP.
For example, running the command above against https://bahnql.herokuapp.com/graphql
uncovers that running the { search(searchTerm: "") { stations { name } } }
query leads to a server error:
{
"errors": [
{
"message": "Cannot read property 'city' of undefined",
"locations": [
{
"line": 1,
"column": 28
}
],
"path": ["search", "stations"]
}
],
"data": null
}
WunderGraph composes all your APIs into a single unified GraphQL API and allows you to expose your Graph as a secure and type-safe JSON-RPC API.
To get started with WunderGraph, you can use create-wundergraph-app
to bootstrap a new project:
npx create-wundergraph-app my-project -E nextjs-swr
On the client side, WunderGraph’s JSON-RPC API integrates very well with frameworks like Next.js, SWR and React Query, while one the backend, we’re able to leverage the power of “Server-Side-Only GraphQL”. Handle authentication, authorization, validation, joins and more right in the Query Layer.
mutation (
$name: String! @fromClaim(name: NAME)
$email: String! @fromClaim(name: EMAIL)
$message: String! @jsonSchema(pattern: "^[a-zA-Z 0-9]+$")
) {
createOnepost(
data: {
message: $message
user: {
connectOrCreate: {
where: { email: $email }
create: { email: $email, name: $name }
}
}
}
) {
id
message
user {
id
name
}
}
}
The Query above requires the user to be authenticated, injects the user’s name and email from the JWT token and validates the message against a JSON Schema.
Here’s another example showcasing how we can use Server-Side GraphQL with WunderGraph’s unique join capabilities, composing data from two different APIs into a single GraphQL response.
query (
$continent: String!
# the @internal directive removes the $capital variable from the public API
# this means, the user can't set it manually
# this variable is our JOIN key
$capital: String! @internal
) {
countries_countries(filter: { continent: { eq: $continent } }) {
code
name
# using the @export directive, we can export the value of the field `capital` into the JOIN key ($capital)
capital @export(as: "capital")
# the _join field returns the type Query!
# it exists on every object type so you can everywhere in your Query documents
_join {
# once we're inside the _join field, we can use the $capital variable to join the weather API
weather_getCityByName(name: $capital) {
weather {
temperature {
max
}
summary {
title
description
}
}
}
}
}
}
The full example can be found on GitHub.