Umble

Humble Pulumi Constructs for Apollo/React Developers

To use Umble you'll need to install pulumi and umble's subpackages.

For your infrastructure: npx install-peerdeps umble

For your apollo server: npm i umble-apollo-server

$3

#### Service
Here is a quick example on how to use it. The ./app directory requires a Dockerfile that exposes the service on port 4000, pulumi will use docker to build your image.

``
const pulumi = require('@pulumi/pulumi');
const aws = require('@pulumi/aws');
const awsx = require('@pulumi/awsx');
const { Service } = require('umble');

const repo = new awsx.ecr.Repository('repo', {
forceDelete: true,
});

const image = new awsx.ecr.Image('image', {
repositoryUrl: repo.url,
path: './app',
});

const api = new Service('api', {
image,
environment: {
NODE_ENV: 'production',
},
});

exports.url = pulumi.interpolatehttp://${api.httpListener.endpoint.hostname};
`

The values expressed are defaults. The only required variable is image.

#### StaticWebApp
Here is a quick example on how to use it with create react app. It can be used with any static site or static site generator.

`
const pulumi = require('@pulumi/pulumi');
const { StaticWebApp } = require('umble');

const webapp = new StaticWebApp('webapp', {
buildDir: './webapp/build/',
buildCmd: 'cd ./webapp && yarn build',
environment: {
REACT_APP_ENVIRONMENT: 'PRODUCTION',
},
});

exports.url = pulumi.interpolatehttp://${webapp.bucket.websiteEndpoint};
`

#### Lambda
Here is a quick example on how to use it with umble-apollo-server. It uses an opinionated abstraction of aws-lambda-graphql which internally extends apollo-server-lambda

`
const { Lambda } = require('umble-apollo-server');

const apollo = new Lambda('umble', {
source: './app',
handler: 'App.http',
websockets: {
enabled: true,
wsHandler: 'App.ws',
eventHandler: 'App.event',
},
});

exports.url = apollo.api.url;
exports.websocketUrl = apollo.websocketApi.url;
`

Your ./app directory should use umble-apollo-server and expose the http, ws, and event handlers.

$3

#### ApolloServer
Here is a quick example of what the ./app directory would look like for a basic app.

`
const { ApolloServer, PubSub } = require('umble-apollo-server');
const { gql } = require('apollo-server');

const pubSub = new PubSub();

const typeDefs = gql
type Mutation {
broadcastMessage(message: String!): String!
}

type Query {
dummy: String!
}

type Subscription {
messageBroadcast: String!
}
;

const resolvers = {
Mutation: {
broadcastMessage: async (root, { message }) => {
await pubSub.publish('NEW_MESSAGE', { message });

return message;
},
},
Query: {
dummy: () => 'dummy',
},
Subscription: {
messageBroadcast: {
resolve: (rootValue) => rootValue.message,
subscribe: pubSub.subscribe('NEW_MESSAGE'),
},
},
};

const server = new ApolloServer({
typeDefs,
resolvers,
playground: true, // playground subscriptions do not work live because it injects headers that AWS is currently unable to resolve
introspection: true,
});

exports.ws = server.handlers.ws();
exports.http = server.handlers.http();
exports.event = server.handlers.event();
``