The Serverless
API Developer Platform

Declaratively turn your services, databases and 3rd party APIs
into a secure, unified, and extensible API.
Compose, integrate, ship.

Less than 1 minute to get started • Open source • Local-first • No vendor lock-in

Supported Frameworks

Supported Data Sources

Supported Platforms

Access all your data through a single API

All your services are connected to a single GraphQL schema, so you can easily Query and Join data across all of them, just by writing a GraphQL Operation.

  • Unified GraphQL Schema across all data sources
  • A single pane of glass for all your data
  • Unified Security, Authentication, & Authorization
  • 10x easier integrations

A Workflow built for Developers

Legacy API Management solutions are built for Ops people. WunderGraph is built for Developers, and fits perfectly into their existing workflows.

  • No dashboards for configuration
  • No Gateways to worry about
  • Configure everything with TypeScript
  • Build upon standards like OAuth2, OpenAPI, S3, GraphQL

Declarative API Dependencies

Stop the chaos of implicitly calling APIs from your code. WunderGraph's declarative API Layer allows you to manage API dependencies like npm packages.

  • Auto generate custom type-safe API Clients
  • Know exactly what services your app depends on
  • Manage secrets and credentials in a single place
  • Publish and import APIs like npm packages

The fundamental difference of server-side compile-time GraphQL

Listen to Jack Herrington's talk on the fundamental difference of server-side-only vs. client-side GraphQL and what advantages it brings to your application architecture in terms of security and performance.

Jack is not affiliated with us. He's an amazing presenter who simply loves what we do. We highly recommend his other videos, please check out his channel!

Rethinking GraphQL with WunderGraph

How WunderGraph works

1

Configure your API dependencies

WunderGraph has the concept of declarative API Dependencies. As a first step, we'll use GraphQL introspection to add the SpaceX API to our application.

.wundergraph/
  • ├── operations/
    • └── # Your operation
  • ├── # Primary configuration file
  • ├── # Optional
  • ├── # Optional
  • └── generated/
    • ├── # Gateway configuration
    • ├── # Composed GraphQL Schema
    • ├── # Postman Integration
    • ├── # TypeSafe Models
    • └── # Validation and more
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
import { Application, configureWunderGraphApplication, cors, introspect } from '@wundergraph/sdk';
import Operations from './wundergraph.operations'
import Server from './wundergraph.server'
const spaceX = introspect.graphql({
apiNamespace: 'spacex',
url: 'https://api.spacex.land/graphql/',
});
const myApplication = new Application({
name: 'api',
apis: [
spaceX,
],
});
configureWunderGraphApplication({
application: myApplication,
operations: Operations,
server: Server,
});
2

Configure your first Operation / Endpoint

WunderGraph uses file-based routing, similar to Next.js, to define your API Endpoints.


To define your first Operation, create a new file in the .wundergraph/operations/ folder and add a GraphQL Operation.

1
2
3
4
5
6
query Dragons {
spacex_dragons {
name
active
}
}
3

Call your API via the generated JSON-RPC Endpoint

Once you saved your first Operation, you can call it via the generated JSON-RPC Endpoint.


That's it, you've created your first WunderGraph API Endpoint!


  • We're not exposing GraphQL anymore
  • You can call this API using curl or Postman
  • The attack surface of the API is reduced
  • We're sending less data between client and server
  • The resulting API is more performant
  • The resulting API supports HTTP-Layer Caching
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
curl -X GET http://localhost:9991/api/main/operations/Dragons
{
"data": {
"dragons": [
{
"name": "Dragon 2",
"active": true
},
{
"name": "Dragon 1",
"active": true
}
]
}
}

One minute Quickstart

1
2
3
4
5
6
# Create a new directory
mkdir my-api && cd my-api
# Create a new project
npx -y @wundergraph/wunderctl init --template nextjs-starter
# Install dependencies and start
npm install && npm start

Run the WunderGraph Next.js demo on your local machine to see it in action.

You can even skip this step and run it with GitPod in your browser.

Open in Gidpod

Frequently Asked Questions

We've heard a lot of questions about WunderGraph. These are the questions we get most often.

  • What problem is WunderGraph solving?

    Every application requires a unique composition of internal and external APIs, Databases, file storages and auth providers that need to be enriched with custom Middleware and connected to one or more frontend / client applications. WunderGraph builds on top of open Standards like OpenAPI, OpenID Connect, GraphQL, S3 and more to make building and maintaining such compositions as easy to build as possible.
  • How is WunderGraph faster and more secure than other GraphQL solutions?

    GraphQL is an excellent language for API Compositions, but comes with challenges regarding security and performance. We've realized that GraphQL Operations don't change in production, so we've built a GraphQL to JSON-Schema Compiler. This approach turns GraphQL into a compile time problem and removes it from the runtime. This gives you powerful API compositions without the drawbacks of exposing a GraphQL API.
  • How is the WunderGraph Developer Experience different from legacy GraphQL?

    The DX is actually almost the same. You compose a GraphQL Schema by adding your API Dependencies, and write GraphQL Operations like you always did. WunderGraph automatically compiles your Operations into JSON-RPC and generates a TypeSafe client for you, e.g. with React Hooks & SSR for NextJS. The generated Hooks execute your GraphQL Operations on the server, that's it.
  • How is Server-Side Only GraphQL different from client-side GraphQL?

    Legacy GraphQL Clients send GraphQL Operations as JSON objects via HTTP POST to the server. This approach is not able to leverage HTTP Caching or ETags. Server-Side Only GraphQL turns GraphQL Operations into JSON-RPC GET Endpoints at compile time. This reduces payloads and latency, makes the API more secure and you're able to leverage HTTP Caching and ETags for Queries.

Join the community

Be part of our growing community of wunderful API enthusiasts

Stay up to date

The latest WunderGraph news, articles, and resources, sent to your inbox.

© 2022 WunderGraph, Inc. All rights reserved.